
/* Polices hébergées sur le site (aucun appel à Google) */
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/poppins-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/poppins-latin-400-italic.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/poppins-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:italic;font-weight:600;font-display:swap;src:url("fonts/poppins-latin-600-italic.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/poppins-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:italic;font-weight:700;font-display:swap;src:url("fonts/poppins-latin-700-italic.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:italic;font-weight:800;font-display:swap;src:url("fonts/poppins-latin-800-italic.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:900;font-display:swap;src:url("fonts/poppins-latin-900-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:italic;font-weight:900;font-display:swap;src:url("fonts/poppins-latin-900-italic.woff2") format("woff2")}

/* Site Wise & Wild. Mise en page : colonne de 1120 px, sections alternant fond blanc et aplats de marque, fiches à bord noir et ombre décalée. */
:root{
  --ink:#1a1a1a; --body:#3f4443; --paper:#ffffff; --grey:#f4f6f6;
  --teal:#3ecfc0; --teal-ink:#0a7a6f; --teal-pale:#e2f7f4;
  --yellow:#fbe972; --yellow-pale:#fff9d9; --pink:#eeada8; --pink-pale:#fcecea;
  --black:#000;
  --font:"Avenir Next","Poppins","Segoe UI",system-ui,sans-serif;
  --step-0:clamp(16px,1.05vw + 12px,17.5px);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--paper);color:var(--body);font-family:var(--font);font-size:var(--step-0);line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{color:var(--teal-ink);text-underline-offset:3px}
:focus-visible{outline:3px solid var(--teal-ink);outline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;background:var(--black);color:#fff;padding:10px 16px;z-index:50;font-weight:600}
.skip:focus{top:12px}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px}
h1,h2,h3{color:var(--ink);font-style:italic;font-weight:800;line-height:1.12;margin:0;text-wrap:balance}
h1{font-size:clamp(38px,6.4vw,68px);font-weight:900;letter-spacing:-.015em}
h2{font-size:clamp(28px,3.8vw,42px)}
h3{font-size:clamp(19px,1.6vw,22px)}
p{margin:0;max-width:66ch}
mark{background:var(--black);color:#fff;padding:0 .16em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.label{display:inline-block;align-self:flex-start;font-size:12.5px;font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:.08em;background:var(--teal);color:#000;padding:3px 10px}
.label.y{background:var(--yellow)} .label.p{background:var(--pink)} .label.k{background:#000;color:#fff}
.lead{font-size:clamp(17px,1.4vw,20px);color:var(--body)}
.btn{display:inline-flex;align-items:center;gap:10px;border:2.5px solid var(--black);background:var(--black);color:#fff;padding:12px 22px;font-weight:700;font-style:italic;text-decoration:none;box-shadow:5px 5px 0 var(--teal);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--teal)}
.btn.ghost{background:#fff;color:#000;box-shadow:5px 5px 0 var(--yellow)}
.btn.ghost:hover{box-shadow:7px 7px 0 var(--yellow)}
.btn.small{padding:8px 16px;font-size:15px;box-shadow:4px 4px 0 var(--teal)}
.row{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
section{padding-block:clamp(56px,8vw,96px)}
.sec-head{display:flex;flex-direction:column;gap:12px;margin-bottom:34px}
.note{font-size:13.5px;color:#5c6261}

/* En-tête */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:#fff;border-bottom:3px solid var(--black)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:10px}
.brand img{width:168px}
.menu{display:flex;align-items:center;gap:22px}
.menu ul{display:flex;gap:20px;list-style:none;margin:0;padding:0;font-size:15px;font-weight:600}
.menu ul a{color:var(--ink);text-decoration:none;padding-block:4px;border-bottom:2px solid transparent}
.menu ul a:hover{border-bottom-color:var(--teal)}
.burger{display:none}
@media (max-width:980px){
  .menu ul{display:none}
  .burger{display:block;position:relative}
  .burger summary{list-style:none;cursor:pointer;border:2.5px solid #000;padding:6px 12px;font-weight:700;font-style:italic}
  .burger summary::-webkit-details-marker{display:none}
  .burger ul{display:flex;flex-direction:column;gap:2px;position:absolute;right:0;top:calc(100% + 10px);background:#fff;border:2.5px solid #000;box-shadow:6px 6px 0 var(--teal);padding:10px;min-width:240px}
  .burger ul a{display:block;padding:8px 10px;color:#000;text-decoration:none;font-weight:600}
}
@media (max-width:560px){.menu .btn.small{display:none}.brand img{width:140px}}

/* Accroche */
.hero{padding-block:clamp(36px,5vw,64px) 0;position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;align-items:end}
.hero .txt{display:flex;flex-direction:column;gap:24px;min-width:0;padding-bottom:30px;align-self:end}
.hero .visual{position:relative;justify-self:end;align-self:end;width:min(540px,100%);margin-right:-10px}
.hero .visual img.owl{position:relative;width:100%;display:block;margin-bottom:-1px}
.claws{position:absolute;pointer-events:none;background:url("griffes.webp") no-repeat center/contain;z-index:0;aspect-ratio:318/510}
.hero .claws{width:clamp(200px,22vw,320px);left:calc(50% + 20px);top:4%;transform:rotate(4deg)}
.stakes,.final,.auto,.page-hero{position:relative;overflow:hidden}
.stakes .claws{width:190px;right:3%;top:-40px;transform:rotate(-6deg)}
.final .claws{width:230px;left:40%;bottom:-70px;transform:rotate(8deg)}
.auto .claws{width:160px;right:3%;top:20px}
.stakes .wrap,.final .wrap,.auto .wrap,.hero .wrap,.page-hero .wrap{position:relative;z-index:1}
@media (max-width:820px){.hero .claws{left:auto;right:2%;top:1%;width:150px}.stakes .claws{width:110px}.final .claws{display:none}}
@media (max-width:820px){.hero .wrap{grid-template-columns:1fr;gap:0}.hero .txt{padding-bottom:28px}.hero .visual{width:min(360px,88%);justify-self:center;margin-right:0}}
/* Accroche sur fond turquoise de marque : texte noir uniquement */
.hero{background:var(--teal)}
.hero h1,.hero .lead,.hero .note{color:#000}
.hero .label{background:#000;color:#fff}
.hero .btn{box-shadow:5px 5px 0 #fff}
.hero .btn:hover{box-shadow:7px 7px 0 #fff}
.hero .btn.ghost{background:#fff;color:#000;box-shadow:5px 5px 0 #000}
.hero .btn.ghost:hover{box-shadow:7px 7px 0 #000}
.pillars{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,max-content));gap:10px 26px}
.pillars a{display:flex;flex-direction:column;gap:6px;color:#000;text-decoration:none}
.pillars b{align-self:flex-start;font-size:clamp(17px,1.9vw,24px);font-weight:900;font-style:italic;text-transform:uppercase;letter-spacing:.01em;line-height:1.1;padding:3px 8px;background:var(--pink)}
.pillars li:nth-child(2) b{background:var(--yellow)} .pillars li:nth-child(3) b{background:#fff}
.pillars span{font-size:14.5px;font-style:italic;font-weight:600;padding-left:8px}
.pillars a:hover b{box-shadow:3px 3px 0 #000}
@media (max-width:520px){.pillars{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.pillars b{font-size:15px;padding:3px 5px}.pillars span{font-size:12.5px;padding-left:5px}}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 20px}
.hero .btn.main,.hero .cta-row .btn.ghost{font-size:clamp(15px,1.15vw,16.5px);padding:13px 18px;white-space:nowrap}
@media (min-width:1000px){.hero .cta-row{flex-wrap:nowrap;gap:18px}.hero .btn.main,.hero .cta-row .btn.ghost{font-size:15px;padding:12px 16px}}
.hero .btn.main{box-shadow:6px 6px 0 #fff}
.hero .btn.main:hover{box-shadow:8px 8px 0 #fff}
.cta-note{font-size:13.5px;color:#000;margin-top:-8px}

/* Preuves */
.proof{background:#000;color:#fff;padding-block:34px}
.proof .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.proof div{display:flex;flex-direction:column;gap:2px;border-left:4px solid var(--teal);padding-left:14px}
.proof div:nth-child(2){border-color:var(--yellow)} .proof div:nth-child(3){border-color:var(--pink)}
.proof b{font-size:clamp(30px,3.6vw,44px);font-weight:900;font-style:italic;line-height:1.05;font-variant-numeric:tabular-nums;color:#fff}
.proof span{font-size:14.5px;color:#d7dddc}
@media (max-width:760px){.proof .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Logos */
.logos{padding-block:44px 56px;border-bottom:1px solid #e3e8e7}
.logos h2{font-size:clamp(20px,2vw,24px);margin-bottom:22px}
.logo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:12px;list-style:none;margin:0;padding:0}
.logo-grid li{background:#fff;border:1.5px solid #e3e8e7;height:76px;display:flex;align-items:center;justify-content:center;padding:10px}
.logo-grid img{max-height:54px;width:auto;object-fit:contain}

/* Pour qui */
.who-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.card{background:#fff;border:2.5px solid #000;padding:24px;display:flex;flex-direction:column;gap:12px;min-width:0}
.card.t{box-shadow:7px 7px 0 var(--teal)} .card.y{box-shadow:7px 7px 0 var(--yellow)} .card.p{box-shadow:7px 7px 0 var(--pink)}
.card .answer{margin-top:auto;padding-top:12px;border-top:1.5px dashed #c9d2d0;color:var(--ink)}
.card .answer strong{font-style:italic}
@media (max-width:900px){.who-grid{grid-template-columns:1fr}}

/* Enjeux 2027 */
.stakes{background:var(--teal)}
.stakes h2,.stakes .lead{color:#000}
.stake-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.stake{background:#fff;border:2.5px solid #000;padding:20px;display:flex;flex-direction:column;gap:10px;min-width:0}
.stake .big{font-size:30px;font-weight:900;font-style:italic;color:#000;line-height:1}
.stake a{margin-top:auto;font-weight:700;color:#000}
@media (max-width:980px){.stake-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.stake-grid{grid-template-columns:1fr}}
.stakes .note{color:#063e38;margin-top:18px}

/* Offre */
.offer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.offer{border:2.5px solid #000;display:flex;flex-direction:column;min-width:0;background:#fff}
.offer header{padding:18px 22px;border-bottom:2.5px solid #000;display:flex;align-items:baseline;gap:12px}
.offer header .n{font-size:40px;font-weight:900;font-style:italic;line-height:1;color:#000}
.offer:nth-child(1) header{background:var(--teal)} .offer:nth-child(2) header{background:var(--yellow)} .offer:nth-child(3) header{background:var(--pink)}
.offer .in{padding:20px 22px 24px;display:flex;flex-direction:column;gap:12px;flex:1}
.offer ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.offer .go{margin-top:auto;font-weight:700;color:#000}
@media (max-width:900px){.offer-grid{grid-template-columns:1fr}}

/* Sensibilisations */
.sensis{background:var(--yellow-pale);border-block:3px solid #000}
.sensis .top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:30px;align-items:end;margin-bottom:30px}
.price{background:#fff;border:2.5px solid #000;box-shadow:7px 7px 0 var(--teal);padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.price b{font-size:40px;font-weight:900;font-style:italic;color:#000;line-height:1}
.price ul{margin:0;padding-left:18px;font-size:15px}
@media (max-width:860px){.sensis .top{grid-template-columns:1fr}}
.kit-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;list-style:none;margin:0;padding:0}
.kit{background:#fff;border:2px solid #000;display:flex;flex-direction:column;min-width:0;transition:transform .15s,box-shadow .15s}
.kit:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 #000}
.kit img{aspect-ratio:3/4;object-fit:cover;width:100%;border-bottom:2px solid #000}
.kit div{padding:10px 12px 14px;display:flex;flex-direction:column;gap:4px}
.kit h3{font-size:15.5px}
.kit p{font-size:13.5px;line-height:1.45}
.kit .theme{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--teal-ink)}
@media (max-width:1000px){.kit-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.kit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Méthode */
.method{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:40px;align-items:start}
.thc{display:grid;gap:14px}
.thc div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;align-items:center;border:2.5px solid #000;padding:16px 18px;background:#fff}
.thc b{font-size:24px;font-weight:900;font-style:italic;color:#000}
.thc div:nth-child(1){box-shadow:6px 6px 0 var(--teal)} .thc div:nth-child(2){box-shadow:6px 6px 0 var(--pink)} .thc div:nth-child(3){box-shadow:6px 6px 0 var(--yellow)}
@media (max-width:860px){.method{grid-template-columns:1fr}.thc div{grid-template-columns:1fr;gap:4px}}

/* Auto-évaluations */
.auto{background:#000;color:#e8eceb}
.auto h2,.auto h3{color:#fff}
.auto mark{background:var(--teal);color:#000}
.auto .lead{color:#d7dddc}
.auto-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.auto .card{background:#fff;border-color:#fff;color:var(--body)}
.auto .card h3{color:#000}
.auto .card.t{box-shadow:7px 7px 0 var(--teal)} .auto .card.y{box-shadow:7px 7px 0 var(--yellow)}
.auto .chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.auto .chips li{font-size:13.5px;background:var(--grey);color:#000;padding:3px 10px}
.auto .btn{align-self:flex-start;margin-top:auto}
.auto .card.t .btn{box-shadow:5px 5px 0 var(--teal)} .auto .card.y .btn{box-shadow:5px 5px 0 var(--yellow)}
@media (max-width:820px){.auto-grid{grid-template-columns:1fr}}

/* Cas clients */
#cas{background:var(--grey)}
.method-sec{background:var(--teal-pale);border-top:3px solid #000}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.case .kpi{font-size:34px;font-weight:900;font-style:italic;color:#000;line-height:1}
.case .kpi small{display:block;font-size:14px;font-weight:600;font-style:normal;color:var(--body);margin-top:4px;line-height:1.35}
.case{border:2.5px solid #000;background:#fff;display:flex;flex-direction:column;min-width:0}
.case header{padding:18px 22px;border-bottom:2.5px solid #000;display:flex;flex-direction:column;gap:10px}
.case dl{margin:0;padding:18px 22px 22px;display:grid;gap:14px}
.case dt{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--teal-ink)}
.case dd{margin:2px 0 0}
.case .punch{background:var(--teal-pale);padding:14px 22px;font-weight:700;font-style:italic;color:#000;border-top:2.5px solid #000;margin-top:auto}
@media (max-width:980px){.case-grid{grid-template-columns:1fr}}

/* Témoignages */
.quotes{background:var(--pink-pale)}
.quote-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
figure.q{margin:0;background:#fff;border:2.5px solid #000;padding:24px;display:flex;flex-direction:column;gap:16px}
figure.q blockquote{margin:0;font-size:18px;font-style:italic;font-weight:600;color:#000;line-height:1.45}
figure.q blockquote::before{content:"«\00a0";color:var(--teal-ink);font-weight:900}
figure.q blockquote::after{content:"\00a0»";color:var(--teal-ink);font-weight:900}
figure.q figcaption{margin-top:auto;font-size:14.5px}
figure.q figcaption b{display:block;color:#000}
@media (max-width:900px){.quote-grid{grid-template-columns:1fr}}

/* Qui suis-je */
.me{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:44px;align-items:center}
.me .ph{position:relative;max-width:380px}
.me .ph::after{content:"";position:absolute;inset:14px -14px -14px 14px;background:var(--teal);z-index:-1;border:2.5px solid #000}
.me .ph img{border:2.5px solid #000;filter:grayscale(1);width:100%}
.me .txt{display:flex;flex-direction:column;gap:18px}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.facts div{border:2px solid #000;padding:12px 14px;background:#fff}
.facts b{display:block;font-size:24px;font-weight:900;font-style:italic;color:#000;line-height:1.1}
.facts span{font-size:13.5px}
@media (max-width:860px){.me{grid-template-columns:1fr}.me .ph{max-width:280px}.facts{grid-template-columns:1fr}}

/* FAQ */
.faq{display:flex;flex-direction:column;gap:12px;max-width:860px}
.faq details{border:2.5px solid #000;background:#fff}
.faq summary{cursor:pointer;padding:16px 20px;font-weight:700;color:#000;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:900;font-size:22px;line-height:1}
.faq details[open] summary::after{content:"\2212"}
.faq details[open] summary{border-bottom:1.5px solid #d7dfdd}
.faq .a{padding:14px 20px 18px}

/* Appel final */
.final{background:var(--teal);border-top:3px solid #000;position:relative;overflow:hidden}
.final .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:center}
.final h2{font-size:clamp(34px,5vw,58px);font-weight:900}
.final .box{background:#fff;border:2.5px solid #000;box-shadow:8px 8px 0 #000;padding:24px;display:flex;flex-direction:column;gap:14px}
.final .mail{font-weight:700;color:#000;font-size:18px;user-select:all}
@media (max-width:820px){.final .wrap{grid-template-columns:1fr}}

/* Pied de page */
.site-foot{background:#000;color:#cfd6d4;font-size:14.5px;padding-block:44px 30px}
.site-foot .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:28px}
.site-foot h2{color:#fff;font-size:15px;font-style:normal;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.site-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.site-foot a{color:#fff;text-decoration:none}
.site-foot a:hover{text-decoration:underline}
.site-foot .band{grid-column:1/-1;border-top:1px solid #333;padding-top:18px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:13px}
.site-foot .foot-logo{width:200px}
@media (max-width:860px){.site-foot .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.site-foot .wrap{grid-template-columns:1fr}}

/* Pages intérieures */
.page-hero{background:var(--teal);border-bottom:3px solid #000;padding-block:clamp(36px,5vw,64px)}
.page-hero .wrap{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);gap:32px;align-items:center}
.page-hero .txt{display:flex;flex-direction:column;gap:18px;min-width:0}
.page-hero h1{font-size:clamp(34px,5vw,56px);color:#000}
.page-hero .lead{color:#000}
.page-hero .label{background:#000;color:#fff}
.page-hero .btn{box-shadow:5px 5px 0 #fff}
.page-hero .btn.ghost{box-shadow:5px 5px 0 #000}
.page-hero .side{justify-self:end;width:min(320px,100%)}
.page-hero .side img{border:2.5px solid #000;box-shadow:8px 8px 0 #000;background:#fff}
.page-hero .claws{width:clamp(150px,16vw,230px);right:30%;top:-30px;transform:rotate(6deg)}
@media (max-width:820px){.page-hero .wrap{grid-template-columns:1fr}.page-hero .side{justify-self:start;width:min(240px,70%)}.page-hero .claws{right:4%;width:120px}}
.crumbs{font-size:13.5px;color:#000}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"/";margin-right:6px}
.crumbs a{color:#000}
.sec-alt{background:var(--grey)}
.sec-teal-pale{background:var(--teal-pale)}
.sec-yellow-pale{background:var(--yellow-pale)}
.sec-pink-pale{background:var(--pink-pale)}
.sec-black{background:#000;color:#e8eceb}
.sec-black h2,.sec-black h3{color:#fff}
.sec-black mark{background:var(--teal);color:#000}
.sec-black .lead{color:#d7dddc}
.prose{display:flex;flex-direction:column;gap:14px}
.prose h2{margin-top:18px;font-size:clamp(24px,3vw,32px)}
.prose h3{margin-top:8px}
.prose ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
@media (max-width:980px){.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.grid3{grid-template-columns:1fr}}
@media (max-width:760px){.grid2{grid-template-columns:1fr}}
@media (max-width:560px){.grid4{grid-template-columns:1fr}}
.card ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.card .petit{margin-top:auto;padding-top:12px;border-top:1.5px dashed #c9d2d0;color:#000}
.card .petit b{font-style:italic}
.meta-row{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.meta-row li{font-size:13.5px;background:var(--grey);color:#000;padding:3px 10px}
.meta-row li b{font-weight:700}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.steps li{border:2px solid #000;padding:12px 14px;background:#fff;display:flex;flex-direction:column;gap:4px;font-size:14.5px}
.steps li b{color:#000;font-style:italic}
.steps li span.n{font-weight:900;font-style:italic;font-size:22px;color:var(--teal-ink);line-height:1}
@media (max-width:620px){.steps{grid-template-columns:1fr}}
.process{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:st}
.process li{border:2.5px solid #000;background:#fff;padding:20px;display:flex;flex-direction:column;gap:8px;position:relative}
.process li .n{font-size:38px;font-weight:900;font-style:italic;color:#000;line-height:1}
.process li:nth-child(1){box-shadow:6px 6px 0 var(--teal)} .process li:nth-child(2){box-shadow:6px 6px 0 var(--yellow)} .process li:nth-child(3){box-shadow:6px 6px 0 var(--pink)} .process li:nth-child(4){box-shadow:6px 6px 0 var(--teal)}
@media (max-width:980px){.process{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.process{grid-template-columns:1fr}}
/* Fiches sensibilisations */
.kit-list{display:flex;flex-direction:column;gap:34px}
.kit-detail{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:28px;border:2.5px solid #000;background:#fff;padding:22px;scroll-margin-top:90px}
.kit-detail:nth-child(3n+1){box-shadow:8px 8px 0 var(--teal)} .kit-detail:nth-child(3n+2){box-shadow:8px 8px 0 var(--yellow)} .kit-detail:nth-child(3n){box-shadow:8px 8px 0 var(--pink)}
.kit-detail img{border:2px solid #000;width:100%}
.kit-detail .body{display:flex;flex-direction:column;gap:14px;min-width:0}
.kit-detail .theme{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--teal-ink)}
@media (max-width:760px){.kit-detail{grid-template-columns:1fr}.kit-detail img{max-width:260px}}
.kit-toc{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.kit-toc a{display:block;border:2px solid #000;padding:5px 12px;background:#fff;color:#000;text-decoration:none;font-weight:600;font-size:14.5px}
.kit-toc a:hover{background:var(--yellow)}
.star{color:var(--teal-ink);font-weight:900}
.asterisk-note{font-size:14px;color:#000}
/* Formations */
.formats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:900px){.formats{grid-template-columns:1fr}}
.formation{border:2.5px solid #000;background:#fff;display:flex;flex-direction:column;min-width:0;scroll-margin-top:90px}
.formation > header{padding:18px 22px;border-bottom:2.5px solid #000;display:flex;flex-direction:column;gap:8px;background:var(--teal-pale)}
.formation:nth-child(2) > header{background:var(--yellow-pale)} .formation:nth-child(3) > header{background:var(--pink-pale)}
.formation .in{padding:18px 22px 22px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.formation .in h4{margin:0 0 6px;font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--teal-ink)}
.formation .in ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px;font-size:15.5px}
.formation .petit{grid-column:1/-1;background:var(--grey);padding:12px 14px;color:#000}
@media (max-width:760px){.formation .in{grid-template-columns:1fr}}
.catalogue-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.catalogue-cols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.catalogue-cols li b{display:block;color:#000}
.catalogue-cols li span{font-size:14.5px}
@media (max-width:900px){.catalogue-cols{grid-template-columns:1fr}}
/* Formulaires */
.form{display:grid;gap:14px;background:#fff;border:2.5px solid #000;box-shadow:8px 8px 0 #000;padding:24px;color:var(--body)}
.form .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:560px){.form .two{grid-template-columns:1fr}}
.form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:15px;color:#000}
.form input[type=text],.form input[type=email],.form textarea,.form select{font:inherit;font-weight:400;border:2px solid #000;padding:10px 12px;background:#fff;color:#000;width:100%}
.form textarea{min-height:140px;resize:vertical}
.form .check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;font-size:14.5px}
.form .check input{margin-top:5px;width:18px;height:18px;flex:none;accent-color:#000}
.form .req{color:#b42318}
.form .hp{position:absolute;left:-9999px}
.form .btn{justify-self:start;cursor:pointer;font:inherit;font-weight:700;font-style:italic}
.form-ok{border:2.5px solid #000;background:var(--teal-pale);padding:20px;display:flex;flex-direction:column;gap:12px}
.form-err{color:#b42318;font-weight:600}
/* Références */
.client-names{columns:3 200px;column-gap:28px;margin:0;padding:0;list-style:none}
.client-names li{break-inside:avoid;padding:6px 0;border-bottom:1px solid #d7dfdd;color:#000;font-weight:600}
.filters{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 26px;padding:0}
.filters a{display:block;border:2px solid #000;padding:5px 12px;color:#000;text-decoration:none;font-weight:600;font-size:14.5px;background:#fff}
.filters a:hover{background:var(--teal)}
.case-cat{scroll-margin-top:90px;display:flex;flex-direction:column;gap:20px}
.case-cat + .case-cat{margin-top:48px}
.case-cat h2{font-size:clamp(24px,3vw,32px)}
/* Qui suis-je */
.timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;border-left:4px solid #000;padding-left:22px}
.timeline li{position:relative}
.timeline li::before{content:"";position:absolute;left:-31px;top:7px;width:14px;height:14px;background:var(--teal);border:2.5px solid #000}
.timeline b{color:#000}
.wisewild{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.wisewild ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.wisewild li b{display:block;color:#000;font-style:italic}
@media (max-width:760px){.wisewild{grid-template-columns:1fr}}
/* Pages légales */
.legal{max-width:820px}
.legal h2{font-size:24px;margin-top:26px}
.legal p,.legal li{max-width:none}
.fill{background:var(--yellow);color:#000;padding:0 6px;font-weight:700}
.big404{font-size:clamp(80px,14vw,160px);font-weight:900;font-style:italic;color:#000;line-height:1}
/* Utilitaires accessibilité */
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.menu ul a[aria-current="page"]{border-bottom-color:#000}
.stake ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:15.5px}
.stake p a{color:#000}
.hero h1 .label{font-size:12.5px;letter-spacing:.08em;line-height:1.4;font-weight:700}
.page-hero .side .price b{font-size:40px}
[hidden]{display:none!important}
.hero .lead{max-width:31em}
.btn small{display:block;font-size:12px;font-weight:600;font-style:normal;letter-spacing:.01em;opacity:.85;line-height:1.2}
.btn:has(small){flex-direction:column;align-items:flex-start;gap:2px}
.stakes .sec-head .lead{max-width:none}
.stakes a:not(.btn),.page-hero a:not(.btn),.final a:not(.btn){color:#000}
.hero .claws{left:calc(50% + 90px)}
.stakes .claws{top:-150px}
@media (max-width:820px){.hero .claws{left:auto}}
