/* =====================================================================
   CRFLD — Composants de section
   ===================================================================== */

/* ══════════════════ HERO (accueil) ══════════════════ */
.hero{position:relative;min-height:min(100svh,880px);display:flex;flex-direction:column;justify-content:flex-end;
  background:var(--deep);overflow:hidden;padding-top:120px}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:60% 30%;opacity:.42}
.hero-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,var(--deep) 8%,rgba(10,32,24,.9) 42%,rgba(10,32,24,.42) 78%,rgba(10,32,24,.62) 100%)}
.hero-in{position:relative;z-index:2;padding-bottom:clamp(46px,6vw,84px);padding-top:clamp(40px,7vw,90px)}
.hero-in>*{max-width:820px}
.hero h1{color:#fff;margin-top:20px}
.hero .lead{color:rgba(255,255,255,.8);margin-top:22px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.hero-assur{display:flex;gap:clamp(14px,2.2vw,30px);flex-wrap:wrap;margin-top:32px;max-width:900px}
.hero-assur span{display:inline-flex;align-items:flex-start;gap:8px;font-size:12.4px;color:rgba(255,255,255,.66);line-height:1.5}
.hero-assur svg{width:14px;height:14px;color:var(--green-lt);flex:none;margin-top:3px}

/* torche : halo lumineux animé, écho au logo */
.torch{position:absolute;z-index:1;pointer-events:none;width:clamp(280px,34vw,540px);aspect-ratio:1;right:-6%;top:6%;
  background:radial-gradient(circle at 50% 45%,rgba(245,124,31,.34),rgba(245,124,31,.10) 42%,transparent 68%);
  filter:blur(12px);animation:torchPulse 7s ease-in-out infinite}
@keyframes torchPulse{0%,100%{opacity:.72;transform:scale(1)}50%{opacity:1;transform:scale(1.07)}}

/* barre de chiffres en pied de hero */
.hero-bar{position:relative;z-index:2;background:rgba(255,255,255,.05);backdrop-filter:blur(10px);
  border-top:1px solid rgba(255,255,255,.12)}
.hero-bar-in{max-width:1200px;margin:0 auto;padding:clamp(20px,2.4vw,30px) var(--pad);
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2.4vw,34px)}
@media(max-width:840px){.hero-bar-in{grid-template-columns:repeat(2,1fr);gap:20px}}
.hb-n{font-family:var(--ed);font-size:clamp(24px,2.5vw,36px);color:#fff;line-height:1}
.hb-l{font-size:11.4px;color:rgba(255,255,255,.6);margin-top:7px;line-height:1.45}

/* ══════════════════ HERO DE PAGE INTÉRIEURE ══════════════════ */
.page-hero{position:relative;background:var(--deep);padding:clamp(150px,17vw,210px) 0 clamp(52px,6vw,84px);overflow:hidden}
.page-hero .hero-bg img{opacity:.3}
.page-hero .hero-bg::after{background:linear-gradient(95deg,var(--deep) 12%,rgba(10,32,24,.86) 52%,rgba(10,32,24,.55) 100%)}
.page-hero-in{position:relative;z-index:2;max-width:840px}
.page-hero h1{color:#fff;margin-top:18px}
.page-hero .lead{color:rgba(255,255,255,.78);margin-top:18px}
.crumbs{display:flex;gap:9px;align-items:center;font-size:11.4px;color:rgba(255,255,255,.5);margin-bottom:22px;flex-wrap:wrap}
.crumbs a:hover{color:var(--green-lt)}
.crumbs svg{width:11px;height:11px;opacity:.5}

/* ══════════════════ GRILLES GÉNÉRIQUES ══════════════════ */
.grid{display:grid;gap:clamp(18px,2.2vw,30px)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}

/* ══════════════════ MANIFESTE (bloc sombre éditorial) ══════════════════ */
.manifesto{background:var(--deep);position:relative;overflow:hidden}
.manifesto::after{content:"";position:absolute;right:-8%;bottom:-30%;width:min(52vw,620px);aspect-ratio:1;
  background:radial-gradient(circle,rgba(0,154,73,.22),transparent 65%);pointer-events:none}
.manifesto-in{position:relative;z-index:1;max-width:900px}
.manifesto h2{color:#fff;margin-top:16px}
.manifesto p{color:rgba(255,255,255,.74);font-size:clamp(15px,1.16vw,17px);line-height:1.85;margin-top:22px}
.manifesto p b{color:#fff}
.manifesto .quote{font-family:var(--ed);font-style:italic;font-size:clamp(18px,1.9vw,25px);color:var(--green-lt);
  line-height:1.5;border-left:2px solid var(--orange);padding-left:22px;margin-top:32px;max-width:730px}

/* ══════════════════ DEUX PILIERS (soins / formation) ══════════════════ */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.2vw,28px)}
@media(max-width:860px){.pillars{grid-template-columns:1fr}}
.pillar{position:relative;overflow:hidden;border-radius:var(--r-lg);background:var(--card);border:1px solid var(--line);
  display:flex;flex-direction:column;transition:box-shadow .4s var(--ease),transform .4s var(--ease),border-color .4s}
.pillar:hover{transform:translateY(-5px);box-shadow:0 30px 60px -38px var(--shadow);border-color:var(--c,var(--green))}
.pillar-img{position:relative;aspect-ratio:16/10;overflow:hidden}
.pillar-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.pillar:hover .pillar-img img{transform:scale(1.05)}
.pillar-img::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,32,24,.7),transparent 55%)}
.pillar-tag{position:absolute;left:18px;bottom:16px;z-index:2;display:inline-flex;align-items:center;gap:8px;
  background:var(--c,var(--green-dk));color:#fff;padding:7px 14px;border-radius:var(--r);
  font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
/* Pastille posée sur l'orange : encre sombre, le blanc n'y est pas lisible. */
.pillar-tag[style*="--c:var(--orange)"],.pillar-tag.o{color:var(--on-orange)}
.pillar-body{padding:clamp(22px,2.6vw,34px);display:flex;flex-direction:column;flex:1}
.pillar-body h3{font-size:clamp(20px,2vw,27px);margin-bottom:12px}
.pillar-list{margin:20px 0 24px;display:flex;flex-direction:column;gap:11px;border-top:1px solid var(--line);padding-top:20px}
.pillar-list li{display:flex;gap:11px;align-items:flex-start;font-size:13.6px;line-height:1.55}
.pillar-list svg{width:15px;height:15px;color:var(--c,var(--green));flex:none;margin-top:3px}
.pillar-body .arrow-link{margin-top:auto;color:var(--c,var(--green))}

/* ══════════════════ CARTES DE SERVICE ══════════════════ */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(22px,2.4vw,30px);
  display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.card:hover{transform:translateY(-4px);box-shadow:0 26px 54px -38px var(--shadow);border-color:var(--c,var(--green))}
.card-ic{width:46px;height:46px;border-radius:var(--r);display:grid;place-items:center;margin-bottom:18px;
  background:color-mix(in srgb,var(--c,var(--green)) 12%,transparent);color:var(--c,var(--green));flex:none}
.card-ic svg{width:22px;height:22px}
.card h3{margin-bottom:10px}
.card p{font-size:14px;line-height:1.72}
.card-list{margin-top:16px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px}
.card-list li{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--ink-soft);line-height:1.5}
.card-list svg{width:13px;height:13px;color:var(--c,var(--green));flex:none;margin-top:3.5px}
.card .arrow-link{margin-top:20px;align-self:flex-start;color:var(--c,var(--green))}
.dark-sec .card{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)}
.dark-sec .card p,.dark-sec .card-list li{color:rgba(255,255,255,.68)}
.dark-sec .card-list{border-color:rgba(255,255,255,.1)}

/* numérotée */
.card-num{position:absolute;top:20px;right:22px;font-family:var(--ed);font-size:38px;color:var(--line-2);line-height:1}
.card.rel{position:relative}

/* ══════════════════ SECTION SPLIT (texte + image) ══════════════════ */
.split{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(28px,4.4vw,68px);align-items:center}
.split.rev .split-media{order:2}
@media(max-width:900px){.split{grid-template-columns:1fr}.split.rev .split-media{order:0}}
.split-media{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3.2}
.split-media img{width:100%;height:100%;object-fit:cover}
.split-media.tall{aspect-ratio:3/3.6}
/* pastille de chiffre posée sur l'image */
.media-badge{position:absolute;right:0;bottom:0;z-index:3;background:var(--green);color:#fff;padding:20px 26px;max-width:230px}
.media-badge b{display:block;font-family:var(--ed);font-size:32px;line-height:1}
.media-badge span{display:block;font-size:11.5px;margin-top:6px;line-height:1.45;color:rgba(255,255,255,.88)}
.media-badge.o{background:var(--orange);color:var(--on-orange)}

.feat{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line)}
.feat:last-child{border-bottom:0}
.feat-ic{width:38px;height:38px;border-radius:var(--r);display:grid;place-items:center;flex:none;
  background:color-mix(in srgb,var(--c,var(--green)) 12%,transparent);color:var(--c,var(--green))}
.feat-ic svg{width:18px;height:18px}
.feat h4{margin-bottom:4px;color:var(--ink);font-size:14.5px}
.feat p{font-size:13.6px;line-height:1.65}
.dark-sec .feat{border-color:rgba(255,255,255,.1)}
.dark-sec .feat h4{color:#fff}
.dark-sec .feat p{color:rgba(255,255,255,.66)}

/* ══════════════════ CHIFFRES / IMPACT ══════════════════ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.stats{grid-template-columns:1fr}}
.stat{background:var(--paper);padding:clamp(22px,2.6vw,34px)}
.alt .stat{background:var(--paper-2)}
.stat-n{font-family:var(--ed);font-size:clamp(30px,3.3vw,46px);color:var(--c,var(--green));line-height:1}
.stat-l{font-size:12.6px;color:var(--ink-soft);margin-top:10px;line-height:1.55}
.stat-micro{font-family:var(--ed);font-style:italic;font-size:15.5px;color:var(--dim);margin-top:26px;max-width:70ch}

/* bande de chiffres du fléau (fond sombre, ton alerte) */
.toll{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.6vw,36px)}
@media(max-width:900px){.toll{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.toll{grid-template-columns:1fr}}
.toll-i{border-top:2px solid var(--c,var(--orange));padding-top:18px}
.toll-n{font-family:var(--ed);font-size:clamp(28px,3vw,42px);color:#fff;line-height:1}
.toll-l{font-size:12.6px;color:rgba(255,255,255,.62);margin-top:9px;line-height:1.55}
.toll-src{font-size:11px;color:rgba(255,255,255,.34);margin-top:24px}

/* ══════════════════ PARCOURS EN ÉTAPES ══════════════════ */
.steps{position:relative;display:flex;flex-direction:column;gap:0}
.steps::before{content:"";position:absolute;left:23px;top:16px;bottom:16px;width:2px;
  background:linear-gradient(180deg,var(--orange),var(--green));opacity:.32}
@media(max-width:640px){.steps::before{left:17px}}
.step{position:relative;display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,2.4vw,30px);
  padding:clamp(18px,2.2vw,28px) 0;align-items:flex-start}
.step-n{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex:none;z-index:1;
  background:var(--paper);border:2px solid var(--c,var(--green));color:var(--c,var(--green));
  font-family:var(--ed);font-size:17px;transition:background .35s,color .35s}
.alt .step-n{background:var(--paper-2)}
.step:hover .step-n{background:var(--c,var(--green));color:#fff}
@media(max-width:640px){.step-n{width:36px;height:36px;font-size:14px}}
.step h3{margin-bottom:8px}
.step p{font-size:14.2px;line-height:1.74;max-width:70ch}
.step-meta{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px}
.step-meta span{display:inline-flex;align-items:center;gap:6px;font-size:11.6px;color:var(--dim)}
.step-meta svg{width:13px;height:13px;color:var(--c,var(--green))}

/* ══════════════════ FORMATIONS ══════════════════ */
.filters{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:clamp(26px,3vw,40px)}
.filter{padding:9px 18px;border:1px solid var(--line-2);border-radius:999px;font-size:11.5px;font-weight:600;
  letter-spacing:.06em;color:var(--ink-soft);transition:.3s var(--ease)}
.filter:hover{border-color:var(--green);color:var(--green)}
.filter.on{background:var(--green);border-color:var(--green);color:#fff}

.course{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.course:hover{transform:translateY(-4px);box-shadow:0 26px 54px -38px var(--shadow);border-color:var(--c,var(--green))}
.course.hide{display:none}
.course-img{position:relative;aspect-ratio:16/9;overflow:hidden}
.course-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.course:hover .course-img img{transform:scale(1.05)}
.course-lvl{position:absolute;top:14px;left:14px;background:var(--c,var(--green));color:#fff;padding:6px 12px;
  border-radius:var(--r);font-size:9.6px;font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.course-body{padding:clamp(20px,2.2vw,26px);display:flex;flex-direction:column;flex:1}
.course-body h3{margin-bottom:10px;font-size:18px}
.course-body p{font-size:13.6px;line-height:1.68}
.course-meta{display:flex;gap:14px;flex-wrap:wrap;margin:16px 0 18px;padding-top:16px;border-top:1px solid var(--line)}
.course-meta span{display:inline-flex;align-items:center;gap:6px;font-size:11.6px;color:var(--dim)}
.course-meta svg{width:13px;height:13px;color:var(--c,var(--green));flex:none}
.course-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;flex-wrap:wrap}
.course-price{font-family:var(--ed);font-size:16px;color:var(--ink)}

/* module de programme (fiche formation) */
.module{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--card);margin-bottom:12px}
.module-h{width:100%;display:flex;align-items:center;gap:16px;padding:18px 22px;text-align:left;transition:background .3s}
.module-h:hover{background:var(--paper-2)}
.module-h b{font-family:var(--ed);font-weight:400;font-size:15px;color:var(--green);flex:none;min-width:34px}
.module-h span{flex:1;font-size:14.6px;font-weight:600;color:var(--ink)}
.module-h svg{width:16px;height:16px;color:var(--dim);transition:transform .35s var(--ease);flex:none}
.module.open .module-h svg{transform:rotate(45deg)}
.module-b{max-height:0;overflow:hidden;transition:max-height .45s var(--ease)}
.module-b-in{padding:0 22px 22px 72px;font-size:13.8px;line-height:1.75}
@media(max-width:600px){.module-b-in{padding-left:22px}}
.module-b-in li{display:flex;gap:9px;align-items:flex-start;margin-top:9px}
.module-b-in svg{width:13px;height:13px;color:var(--green);flex:none;margin-top:4px}

/* ══════════════════ ÉQUIPE / ORGANISATION ══════════════════ */
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,26px)}
@media(max-width:980px){.team{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.team{grid-template-columns:1fr}}
.member-img{position:relative;aspect-ratio:1;border-radius:var(--r-lg);overflow:hidden;margin-bottom:16px}
.member-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.member:hover .member-img img{transform:scale(1.05)}
.member h4{font-family:var(--ed);font-weight:400;font-size:17px;color:var(--ink)}
.member .role{font-size:11.6px;color:var(--green);font-weight:600;letter-spacing:.06em;margin-top:4px}
.member p{font-size:12.8px;line-height:1.6;margin-top:9px;color:var(--ink-soft)}

/* organigramme */
.org{display:grid;gap:14px}
.org-top{background:var(--deep);color:#fff;padding:24px 28px;border-radius:var(--r-lg);text-align:center}
.org-top b{font-family:var(--ed);font-weight:400;font-size:20px;display:block}
.org-top span{font-size:12px;color:rgba(255,255,255,.62);margin-top:5px;display:block}
.org-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:980px){.org-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.org-row{grid-template-columns:1fr}}
.org-c{background:var(--card);border:1px solid var(--line);border-top:3px solid var(--c,var(--green));
  border-radius:var(--r);padding:20px 22px}
.org-c b{display:block;font-family:var(--f);font-size:13.6px;font-weight:600;color:var(--ink);margin-bottom:12px}
.org-c li{font-size:12.6px;color:var(--ink-soft);padding:5px 0 5px 15px;position:relative;line-height:1.5}
.org-c li::before{content:"";position:absolute;left:0;top:12px;width:5px;height:5px;border-radius:50%;background:var(--c,var(--green))}

/* ══════════════════ TÉMOIGNAGES ══════════════════ */
.testi{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,2.6vw,32px);
  display:flex;flex-direction:column;position:relative;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.testi:hover{transform:translateY(-4px);box-shadow:0 26px 54px -38px var(--shadow)}
.testi::before{content:"“";position:absolute;top:8px;right:24px;font-family:var(--ed);font-size:82px;color:var(--line-2);line-height:1}
.testi blockquote{font-family:var(--ed);font-size:17px;line-height:1.6;color:var(--ink);font-style:italic;position:relative;z-index:1}
.testi-meta{display:flex;align-items:center;gap:13px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.testi-av{width:44px;height:44px;border-radius:50%;overflow:hidden;flex:none;background:var(--paper-2)}
.testi-av img{width:100%;height:100%;object-fit:cover}
.testi-meta b{display:block;font-family:var(--f);font-size:13.4px;font-weight:600;color:var(--ink)}
.testi-meta span{display:block;font-size:11.6px;color:var(--dim);margin-top:2px}
.testi-badge{display:inline-flex;align-items:center;gap:6px;background:color-mix(in srgb,var(--green) 12%,transparent);
  color:var(--green);padding:5px 11px;border-radius:999px;font-size:10px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;align-self:flex-start;margin-bottom:18px}
.testi-badge svg{width:12px;height:12px}

/* vidéo */
.vid{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:var(--deep)}
.vid iframe{width:100%;height:100%;border:0}

/* ══════════════════ ACTUALITÉS / ÉVÉNEMENTS ══════════════════ */
.post{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.post:hover{transform:translateY(-4px);box-shadow:0 26px 54px -38px var(--shadow)}
.post-img{position:relative;aspect-ratio:16/10;overflow:hidden}
.post-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.post:hover .post-img img{transform:scale(1.05)}
.post-cat{position:absolute;top:14px;left:14px;background:var(--paper);color:var(--ink);padding:6px 12px;border-radius:var(--r);
  font-size:9.6px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.post-body{padding:clamp(20px,2.2vw,26px);display:flex;flex-direction:column;flex:1}
.post-date{font-size:11.4px;color:var(--dim);margin-bottom:10px;display:flex;align-items:center;gap:7px}
.post-date svg{width:13px;height:13px;color:var(--green)}
.post-body h3{margin-bottom:10px;font-size:18px}
.post-body p{font-size:13.6px;line-height:1.68}
.post-body .arrow-link{margin-top:auto;padding-top:18px;align-self:flex-start}

/* agenda : ligne d'événement */
.event{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(18px,2.4vw,30px);align-items:center;
  padding:clamp(20px,2.2vw,26px);background:var(--card);border:1px solid var(--line);border-left:3px solid var(--c,var(--green));
  border-radius:var(--r);margin-bottom:12px;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.event:hover{transform:translateX(4px);box-shadow:0 20px 44px -34px var(--shadow)}
@media(max-width:760px){.event{grid-template-columns:auto 1fr;gap:16px}.event .btn{grid-column:1/-1;justify-self:start}}
.ev-date{text-align:center;flex:none;min-width:62px}
.ev-d{font-family:var(--ed);font-size:30px;color:var(--c,var(--green));line-height:1}
.ev-m{font-size:10.4px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:4px}
.ev-body h3{font-size:17px;margin-bottom:7px}
.ev-body p{font-size:13.4px;line-height:1.62}
.ev-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:11px}
.ev-meta span{display:inline-flex;align-items:center;gap:6px;font-size:11.4px;color:var(--dim)}
.ev-meta svg{width:12.5px;height:12.5px;color:var(--c,var(--green))}

/* ══════════════════ SIGNES D'ALERTE / FICHES SUBSTANCES ══════════════════ */
.sign{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 24px;
  border-top:3px solid var(--c,var(--alert))}
.sign h4{color:var(--ink);margin-bottom:12px;display:flex;align-items:center;gap:10px;font-size:14.6px}
.sign h4 svg{width:17px;height:17px;color:var(--c,var(--alert));flex:none}
.sign li{font-size:13.2px;line-height:1.6;padding:6px 0 6px 16px;position:relative;color:var(--ink-soft)}
.sign li::before{content:"";position:absolute;left:0;top:13px;width:5px;height:5px;border-radius:50%;background:var(--c,var(--alert))}

.subst{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--card)}
.subst-h{display:flex;align-items:center;gap:14px;padding:18px 22px;background:var(--paper-2);border-bottom:1px solid var(--line)}
.subst-h b{font-family:var(--ed);font-weight:400;font-size:19px;color:var(--ink)}
.subst-h .pill{margin-left:auto;font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  padding:5px 11px;border-radius:999px;background:color-mix(in srgb,var(--c,var(--alert)) 14%,transparent);color:var(--c,var(--alert))}
.subst-b{padding:20px 22px}
.subst-b p{font-size:13.6px;line-height:1.7}
.subst-b dl{margin-top:16px;display:grid;grid-template-columns:auto 1fr;gap:9px 16px;font-size:13px}
.subst-b dt{font-weight:600;color:var(--ink);white-space:nowrap}
.subst-b dd{color:var(--ink-soft);line-height:1.55}

/* mythe / réalité */
.myth{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-bottom:14px}
@media(max-width:700px){.myth{grid-template-columns:1fr}}
.myth-a,.myth-b{padding:22px 24px}
.myth-a{background:color-mix(in srgb,var(--alert) 7%,var(--card));border-right:1px solid var(--line)}
.myth-b{background:var(--card)}
@media(max-width:700px){.myth-a{border-right:0;border-bottom:1px solid var(--line)}}
.myth-lbl{display:inline-flex;align-items:center;gap:7px;font-size:9.8px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:11px}
.myth-a .myth-lbl{color:var(--alert)}
.myth-b .myth-lbl{color:var(--green)}
.myth-lbl svg{width:13px;height:13px}
.myth p{font-size:13.8px;line-height:1.7}
.myth-a p{font-family:var(--ed);font-style:italic;font-size:15.5px;color:var(--ink)}

/* ══════════════════ FAQ ══════════════════ */
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;display:flex;align-items:center;gap:18px;padding:20px 0;text-align:left;
  font-family:var(--ed);font-size:clamp(16px,1.4vw,19px);color:var(--ink);line-height:1.4}
.faq-q svg{width:17px;height:17px;color:var(--green);flex:none;margin-left:auto;transition:transform .35s var(--ease)}
.faq-item.open .faq-q svg{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .45s var(--ease)}
.faq-a-in{padding:0 0 22px;font-size:14px;line-height:1.78;max-width:76ch}

/* ══════════════════ CONTACT ══════════════════ */
.contact-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(26px,3.4vw,52px);align-items:flex-start}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr}}
.form{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(24px,2.8vw,38px)}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:560px){.f-row{grid-template-columns:1fr}}
.field{margin-bottom:16px}
.field label{display:block;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-soft);margin-bottom:8px}
.field label .req{color:var(--orange)}
.field input,.field select,.field textarea{width:100%;padding:12px 15px;background:var(--paper);border:1px solid var(--line-2);
  border-radius:var(--r);font-size:14px;color:var(--ink);transition:border-color .3s,box-shadow .3s}
.field textarea{min-height:132px;resize:vertical;line-height:1.6}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 14%,transparent)}
.field input::placeholder,.field textarea::placeholder{color:var(--dim)}
.form-consent{display:flex;gap:11px;align-items:flex-start;margin:6px 0 20px}
.form-consent input{width:auto;margin-top:3px;accent-color:var(--green);flex:none}
.form-consent label{text-transform:none;letter-spacing:0;font-size:12.4px;font-weight:400;line-height:1.6;margin:0}
.form-sent{display:none;margin-top:16px;padding:14px 17px;background:color-mix(in srgb,var(--green) 10%,transparent);
  border-left:3px solid var(--green);border-radius:var(--r);font-size:13.4px;line-height:1.6}
.form-sent a{color:var(--green);font-weight:600;text-decoration:underline}
.form button[type="submit"]:disabled{opacity:.6;cursor:progress;transform:none}

/* champ rempli automatiquement depuis un lien (fiche formation, CTA…) */
.field select.is-preset,.field input.is-preset{border-color:var(--green);background:color-mix(in srgb,var(--green) 6%,var(--paper))}
.preset-note{display:flex;align-items:flex-start;gap:7px;margin-top:8px;font-size:11.8px;line-height:1.5;color:var(--green);
  text-transform:none;letter-spacing:0;font-weight:500}
.preset-note svg{width:13px;height:13px;flex:none;margin-top:2px}

.info-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 28px;margin-bottom:14px}
.info-card h4{font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--green);margin-bottom:16px}
.info-row{display:flex;gap:13px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--line)}
.info-row:last-child{border-bottom:0;padding-bottom:0}
.info-row svg{width:16px;height:16px;color:var(--green);flex:none;margin-top:3px}
.info-row b{display:block;font-family:var(--f);font-size:13.4px;font-weight:600;color:var(--ink);margin-bottom:2px}
.info-row span,.info-row a{display:block;font-size:13px;line-height:1.6;color:var(--ink-soft)}
.info-row a:hover{color:var(--green)}

.urgent{background:color-mix(in srgb,var(--alert) 9%,var(--card));border:1px solid color-mix(in srgb,var(--alert) 28%,transparent);
  border-radius:var(--r-lg);padding:26px 28px}
.urgent h4{color:var(--alert);display:flex;align-items:center;gap:9px}
.urgent h4 svg{width:16px;height:16px}
.urgent p{font-size:13.4px;line-height:1.7;margin:12px 0 18px}

.map{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/9;background:var(--paper-2)}
.map iframe{width:100%;height:100%;border:0;filter:grayscale(.25)}

/* ══════════════════ BANDE CTA ══════════════════ */
.cta-band{position:relative;background:var(--deep);overflow:hidden;padding:clamp(56px,6.4vw,96px) 0}
.cta-band::after{content:"";position:absolute;left:-6%;top:-40%;width:min(48vw,560px);aspect-ratio:1;
  background:radial-gradient(circle,rgba(245,124,31,.2),transparent 66%);pointer-events:none}
.cta-band-in{position:relative;z-index:1;max-width:860px}
.cta-band h2{color:#fff}
.cta-band .lead{color:rgba(255,255,255,.75);margin-top:16px}
.cta-band .hero-ctas{margin-top:30px}

/* CTA en 3 colonnes */
.cta-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px)}
@media(max-width:900px){.cta-cards{grid-template-columns:1fr}}
.cta-c{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-lg);
  padding:clamp(22px,2.4vw,30px);display:flex;flex-direction:column;transition:background .35s,border-color .35s,transform .35s var(--ease)}
.cta-c:hover{background:rgba(255,255,255,.1);border-color:var(--c,var(--green));transform:translateY(-4px)}
.cta-c .card-ic{background:color-mix(in srgb,var(--c,var(--green)) 22%,transparent);color:#fff}
.cta-c h3{color:#fff;margin-bottom:9px}
.cta-c p{font-size:13.4px;line-height:1.68;color:rgba(255,255,255,.66)}
.cta-c .arrow-link{margin-top:20px;align-self:flex-start;color:var(--green-lt)}

/* ══════════════════ LOGOS PARTENAIRES ══════════════════ */
.partners{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
@media(max-width:900px){.partners{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.partners{grid-template-columns:repeat(2,1fr)}}
.partner{background:var(--paper);display:grid;place-items:center;padding:26px 18px;text-align:center;
  font-family:var(--ed);font-size:14px;color:var(--dim);line-height:1.35;min-height:104px;transition:color .3s,background .3s}
.alt .partner{background:var(--paper-2)}
.partner:hover{color:var(--green)}

/* ══════════════════ APPEL À TÉMOIN / ENCART ══════════════════ */
.note{background:color-mix(in srgb,var(--green) 7%,var(--card));border-left:3px solid var(--green);
  border-radius:var(--r);padding:20px 24px;font-size:13.8px;line-height:1.72;display:flex;gap:14px;align-items:flex-start}
.note svg{width:18px;height:18px;color:var(--green);flex:none;margin-top:3px}
.note.o{background:color-mix(in srgb,var(--orange) 8%,var(--card));border-color:var(--orange)}
.note.o svg{color:var(--orange)}
.note.a{background:color-mix(in srgb,var(--alert) 8%,var(--card));border-color:var(--alert)}
.note.a svg{color:var(--alert)}
.dark-sec .note{background:rgba(255,255,255,.06)}

/* ══════════════════ PROSE (pages de contenu) ══════════════════ */
.prose h2{margin:clamp(34px,3.4vw,50px) 0 16px}
.prose h3{margin:28px 0 12px}
.prose p{margin-bottom:16px;font-size:15px;line-height:1.82}
.prose ul{margin:0 0 20px}
.prose ul li{position:relative;padding:5px 0 5px 22px;font-size:14.6px;line-height:1.7}
.prose ul li::before{content:"";position:absolute;left:0;top:14px;width:6px;height:6px;border-radius:50%;background:var(--green)}
.prose blockquote{font-family:var(--ed);font-style:italic;font-size:clamp(17px,1.7vw,21px);line-height:1.55;
  color:var(--ink);border-left:2px solid var(--orange);padding-left:24px;margin:30px 0}

/* =====================================================================
   LISIBILITE DES ACCENTS  (correctif de contraste)
   `--c` sert a la fois d'aplat et de couleur de texte. L'orange de marque
   ne passe ni en texte sur papier (2,7:1) ni sous du texte blanc (2,2:1).
   On derive donc deux variables a partir de l'accent :
     --c-ink : texte pose SUR le papier
     --c-on  : texte pose SUR l'aplat de l'accent
   Les deux ecritures de l'attribut sont ciblees : le HTML ecrit
   `--c:var(--orange)` mais des que JS touche au style (delai d'animation),
   le navigateur normalise en `--c: var(--orange)` avec une espace.
   ===================================================================== */
[style*="--c:var(--orange)"],[style*="--c: var(--orange)"]{--c-ink:var(--orange-dk);--c-on:var(--on-orange)}
[style*="--c:var(--green)"], [style*="--c: var(--green)"] {--c-ink:var(--green-ink);--c-on:var(--on-orange)}
[style*="--c:var(--alert)"], [style*="--c: var(--alert)"] {--c-ink:var(--alert-dk);--c-on:#fff}

/* Pastilles pleines : encre lisible au lieu du blanc systematique. */
.pillar .pillar-tag,.course .course-lvl{color:var(--c-on,#fff);font-weight:700}
.step:hover .step-n{color:var(--c-on,#fff)}

/* Boutons pleins : la specificite doublee evite qu'une regle de contexte
   (menu mobile, bandeau sombre) ne remette du blanc illisible. */
.btn.btn-orange{color:var(--on-orange)}
.btn.btn-orange:hover{color:#fff}
.btn.btn-green{background:var(--green-dk);border-color:var(--green-dk);color:#fff}

/* Texte et liens colores poses sur le papier. */
.pillar-body .arrow-link,.card .arrow-link{color:var(--c-ink,var(--green-ink))}
.hl-g,.member .role,.module-h b,.info-card h4,.myth-b .myth-lbl,
.form-sent a{color:var(--green-ink)}

/* Pastille chiffre posee sur l'orange : les enfants portaient leur propre
   couleur claire, le blanc restait donc sur l'aplat orange. */
.media-badge.o,.media-badge.o b,.media-badge.o span{color:var(--on-orange)}
/* Surtitres : le vert de marque sur papier reste sous le seuil en 10 px. */
.kicker{color:var(--green-ink)}
.kicker.on-dark,.dark-sec .kicker{color:var(--green-lt)}
/* Encart d'avertissement : texte en encre pleine, le gris doux passait
   sous le seuil sur le fond teinte de l'encart. */
.note,.note p,.note span{color:var(--ink)}
/* Pastille chiffre verte : en theme sombre le vert s'eclaircit, le blanc
   des enfants n'y tenait plus (2,4:1). Fond assombri, texte blanc conserve. */
.media-badge{background:var(--green-dk)}
.media-badge b,.media-badge span{color:#fff}
.media-badge.o{background:var(--orange)}
.media-badge.o b,.media-badge.o span{color:var(--on-orange)}
/* Filtre actif : vert plein + blanc tombe a 2,7:1 en theme sombre. */
.filter.on{background:var(--green-dk);border-color:var(--green-dk);color:#fff}

/* Bloc de reponse apres envoi d'un formulaire */
.form-acts{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 4px}
.form-acts .btn{font-size:11px;padding:11px 18px}
.form-sent small{display:block;margin-top:8px;font-size:12.5px;color:var(--ink-soft)}
.form-sent.is-error{border-left-color:var(--alert-dk)}