/* etudesolg2.fr — famille V1-chantier habillée (fiche _habillages/etudesolg2.fr.md, lot 43).
   Teinte réservée 85 (argile, marne, carotte de sondage). Titres Vazirmatn (contraste 200/800),
   corps Ruluko. Filets 1px, aucune ombre, aucun rayon. Préfixes du site : esg- (coque),
   snd- (sondage : colonne, strates, profondeurs), kry- (composants de conversion). */

@font-face{font-family:"Vazirmatn";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("/fonts/vazirmatn-variable.woff2") format("woff2");}
@font-face{font-family:"Ruluko";font-style:normal;font-weight:400;font-display:swap;
  src:url("/fonts/ruluko-400.woff2") format("woff2");}

:root{
  /* palette réservée (fiche d'habillage, recopiée telle quelle) */
  --ink:oklch(15% 0.028 85);
  --paper:oklch(96% 0.008 85);
  --surface:oklch(90% 0.020 85);
  --accent:oklch(60% 0.150 85);
  --accent-ink:oklch(13% 0.030 85);
  --line:oklch(78% 0.024 85);
  --field-line:oklch(42% 0.070 85);
  /* dérivés de la même teinte (rôles de la famille V1) */
  --ink-2:oklch(11% 0.024 85);
  --deck:oklch(20% 0.030 85);
  --paper-dim:oklch(82% 0.020 85);
  --ink-dim:oklch(38% 0.030 85);
  --accent-deep:oklch(46% 0.110 85);
  --line-d:oklch(96% 0.008 85 / .18);
  --line-d2:oklch(96% 0.008 85 / .34);
  /* strates de la colonne (argile, marne, grave, limon) */
  --st-1:oklch(34% 0.045 60);
  --st-2:oklch(52% 0.060 80);
  --st-3:oklch(62% 0.030 95);
  --st-4:oklch(72% 0.050 88);
  --st-5:oklch(45% 0.020 70);
  --f-title:"Vazirmatn",ui-sans-serif,system-ui,sans-serif;
  --f-body:"Ruluko","Palatino Linotype",Georgia,serif;
  --mod:clamp(12px,1.4vw,20px);
  --wrap:1240px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--f-body);font-size:18px;line-height:1.62}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
input[type=range],input[type=checkbox],input[type=radio],progress{accent-color:var(--accent)}
::selection{background:var(--accent);color:var(--accent-ink)}
h1,h2,h3,.esg-title{font-family:var(--f-title);line-height:1.08;letter-spacing:-.01em;margin:0 0 .5em;hyphens:manual;overflow-wrap:break-word}
h1{font-size:clamp(2rem,4.2vw,3.5rem);font-weight:800}
h2{font-size:clamp(1.6rem,3vw,2.5rem);font-weight:800}
h3{font-size:1.15rem;font-weight:700;letter-spacing:0}
h1 .esg-thin,h2 .esg-thin{font-weight:200}
p{margin:0 0 1em}
strong{font-family:var(--f-title);font-weight:650}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.esg-skip{position:absolute;left:-999px;top:0;background:var(--accent);color:var(--accent-ink);padding:10px 16px;z-index:99}
.esg-skip:focus{left:12px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* ── grille : 12 modules, texte décalé de deux modules (rupture 3) ── */
.esg-wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 clamp(20px,3.5vw,44px)}
.esg-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--mod)}
.esg-off{grid-column:3 / span 8}
.esg-off-wide{grid-column:3 / span 10}
.esg-full{grid-column:1 / -1}
@media(max-width:980px){.esg-off,.esg-off-wide{grid-column:1 / -1}}

/* ── kickers à filet, étiquettes petites capitales (invariant V1) ── */
.esg-kicker{display:flex;align-items:center;gap:12px;font-family:var(--f-title);font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.esg-kicker::before{content:"";width:36px;height:1px;background:currentColor}
.esg-light .esg-kicker{color:var(--accent-deep)}
.esg-lede{font-size:1.14rem;color:var(--paper-dim);max-width:62ch}
.esg-light .esg-lede{color:var(--ink-dim)}

/* ── bandeau contact + en-tête ── */
.esg-band{background:var(--ink-2);border-bottom:1px solid var(--line-d);font-family:var(--f-title);font-size:13px;color:var(--paper-dim)}
.esg-band .esg-wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:7px;padding-bottom:7px}
.esg-band a{color:var(--paper)}
.esg-hdr{position:sticky;top:0;z-index:40;background:var(--deck);border-bottom:1px solid var(--line-d)}
.esg-hdr .esg-wrap{display:flex;align-items:center;gap:24px;min-height:64px}
.esg-mark{display:flex;align-items:baseline;gap:10px;text-decoration:none;margin-right:auto}
.esg-mark b{font-family:var(--f-title);font-size:1.3rem;font-weight:800;letter-spacing:-.02em}
.esg-mark b i{font-style:normal;font-weight:200}
.esg-mark span{font-family:var(--f-title);font-size:12px;color:var(--paper-dim);letter-spacing:.04em}
.esg-nav>ul{display:flex;gap:4px;list-style:none;margin:0;padding:0;align-items:center}
.esg-nav details{position:relative}
.esg-nav summary{list-style:none;cursor:pointer;font-family:var(--f-title);font-size:15px;font-weight:600;padding:10px 12px;border:1px solid transparent}
.esg-nav summary::-webkit-details-marker{display:none}
.esg-nav summary::after{content:" +";color:var(--accent)}
.esg-nav details[open] summary{border-color:var(--line-d)}
.esg-nav .esg-panel{position:absolute;top:100%;left:0;min-width:330px;background:var(--deck);border:1px solid var(--line-d2);padding:8px;z-index:50}
.esg-nav .esg-panel a{display:block;padding:10px 12px;text-decoration:none;font-family:var(--f-title);font-weight:600;font-size:15px;border-bottom:1px solid var(--line-d)}
.esg-nav .esg-panel a:last-child{border-bottom:0}
.esg-nav .esg-panel a small{display:block;font-weight:400;font-size:13px;color:var(--paper-dim);margin-top:2px}
.esg-nav .esg-panel a:hover{background:var(--ink)}
.esg-cta-hdr{font-family:var(--f-title);font-weight:700;font-size:15px;background:var(--accent);color:var(--accent-ink);text-decoration:none;padding:11px 16px;border:1px solid var(--accent)}
@media (min-width:421px){.esg-cta-hdr{white-space:nowrap}}
.esg-cta-hdr:hover{background:var(--paper);border-color:var(--paper)}
.esg-burger{display:none;font-family:var(--f-title);font-weight:700;background:none;color:var(--paper);border:1px solid var(--line-d2);padding:9px 14px;cursor:pointer}
@media(max-width:980px){
  .esg-cta-hdr{padding:9px 12px;font-size:14px}
}

/* ── sections : alternance stricte sombre / clair ── */
.esg-sec{padding:clamp(56px,7vw,96px) 0;position:relative}
.esg-light{background:var(--paper);color:var(--ink)}
.esg-light2{background:var(--surface);color:var(--ink)}
.esg-dark2{background:var(--ink-2)}
.esg-sec + .esg-sec{border-top:1px solid var(--line-d)}
.esg-light a,.esg-light2 a{color:var(--ink)}

/* ── fil d'Ariane, fraîcheur ── */
.esg-crumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:18px 0 0;font-family:var(--f-title);font-size:13px;color:var(--paper-dim)}
.esg-crumb li+li::before{content:"/";margin-right:6px;color:var(--accent)}
.esg-crumb a{color:var(--paper-dim)}
.esg-maj{font-family:var(--f-title);font-size:13px;color:var(--paper-dim);margin-top:28px;padding-top:12px;border-top:1px solid var(--line-d)}
.esg-light .esg-maj,.esg-light2 .esg-maj{color:var(--ink-dim);border-color:var(--line)}

/* ── HERO « carotte de sondage » : colonne stratigraphique à gauche, titre, formulaire ── */
.snd-hero{position:relative;background:var(--ink-2);overflow:hidden;border-bottom:1px solid var(--line-d)}
.snd-hero-photo{position:absolute;inset:0}
.snd-hero-photo img{width:100%;height:100%;object-fit:cover;opacity:.34;filter:saturate(.8)}
.snd-hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink-2) 8%,oklch(11% 0.024 85 / .72) 45%,oklch(11% 0.024 85 / .45))}
.snd-hero-in{position:relative;display:grid;grid-template-columns:92px minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,3.5vw,48px);align-items:start;padding-top:clamp(28px,4vw,56px);padding-bottom:clamp(40px,5vw,72px)}
.snd-hero-in>.kry-herocard{grid-column:3;grid-row:1}
.snd-hero-in>.snd-core{grid-column:1;grid-row:1;align-self:stretch}
.snd-hero-in>.snd-hero-txt{grid-column:2;grid-row:1;padding-top:12px}
.snd-hero-txt .esg-lede{color:var(--paper)}
.snd-hero-reassure{font-family:var(--f-title);font-size:14px;color:var(--paper-dim);margin-top:18px}
.snd-hero-compact .snd-hero-in{grid-template-columns:64px minmax(0,1.2fr) minmax(0,.8fr)}
/* la carotte dessinée : strates + graduations de profondeur */
.snd-core{position:relative;min-height:340px;border:1px solid var(--line-d2);background:linear-gradient(180deg,var(--st-1) 0 9%,var(--st-4) 9% 24%,var(--st-2) 24% 46%,var(--st-3) 46% 63%,var(--st-2) 63% 78%,var(--st-5) 78% 100%)}
.snd-core::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,transparent 0 23px,oklch(96% 0.008 85 / .35) 23px 24px);mix-blend-mode:overlay}
.snd-core ol{list-style:none;margin:0;padding:0;position:absolute;inset:0}
.snd-core li{position:absolute;right:-1px;transform:translate(100%,-50%);font-family:var(--f-title);font-size:12px;font-weight:600;color:var(--paper-dim);padding-left:6px}
@media (min-width:981px){.snd-core li{white-space:nowrap}}
.snd-core li::before{content:"";position:absolute;left:-10px;top:50%;width:10px;height:1px;background:var(--paper-dim)}
.snd-core li.snd-mark{color:var(--accent)}
.snd-core li.snd-mark::before{background:var(--accent);width:18px;left:-18px}
@media(max-width:980px){
  .snd-hero-in,.snd-hero-compact .snd-hero-in{grid-template-columns:1fr;gap:22px;padding-top:18px}
  .snd-hero-in>.kry-herocard,.snd-hero-in>.snd-hero-txt{grid-column:1;grid-row:auto}
  .snd-hero-in>.snd-core{display:none}
}

/* ── rail stratigraphique le long de l'accueil (rupture 1 : marge gauche, toute la hauteur) ── */
.snd-rail{position:absolute;left:max(6px,calc((100vw - var(--wrap)) / 2 - 34px));top:0;bottom:0;width:10px;pointer-events:none;z-index:3;
  background:repeating-linear-gradient(180deg,var(--st-1) 0 140px,var(--st-4) 140px 230px,var(--st-2) 230px 420px,var(--st-3) 420px 560px,var(--st-5) 560px 700px);opacity:.9}
.snd-rail::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,transparent 0 69px,oklch(96% 0.008 85 / .8) 69px 70px)}
.esg-main-home{position:relative}
@media(max-width:1180px){.snd-rail{display:none}}

/* ── formulaires ── */
.kry-herocard{background:var(--paper);color:var(--ink);border:1px solid var(--line);padding:clamp(18px,2.2vw,28px)}
.kry-herocard .kry-ftitle{font-family:var(--f-title);font-weight:800;font-size:1.25rem;line-height:1.2;margin:0 0 4px}
.kry-herocard .kry-fsub{font-size:15px;color:var(--ink-dim);margin:0 0 14px}
.kry-f{display:grid;gap:12px}
.kry-f2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.kry-f2{grid-template-columns:1fr}}
.kry-f label{display:block;font-family:var(--f-title);font-size:13px;font-weight:600;letter-spacing:.02em;margin-bottom:4px}
.kry-f .kry-req{color:var(--accent-deep)}
.kry-f input,.kry-f select,.kry-f textarea{width:100%;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--field-line);border-radius:0;padding:11px 12px;min-height:46px}
.kry-f textarea{min-height:92px;resize:vertical}
.kry-f input:focus,.kry-f select:focus,.kry-f textarea:focus{outline:2px solid var(--accent-deep);outline-offset:0}
.kry-consent{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:14px;line-height:1.45;color:var(--ink-dim)}
.kry-consent input{width:20px;height:20px;min-height:0;margin:2px 0 0}
.kry-consent label{font-family:var(--f-body);font-weight:400;font-size:14px;letter-spacing:0;margin:0}
.kry-hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.kry-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--f-title);font-weight:700;font-size:16px;background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);padding:14px 20px;cursor:pointer;text-decoration:none;min-height:48px}
.kry-btn:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.kry-btn-ghost{background:transparent;color:var(--paper);border-color:var(--paper-dim)}
.kry-btn-ghost:hover{background:var(--paper);color:var(--ink)}
.esg-light .kry-btn-ghost,.esg-light2 .kry-btn-ghost{color:var(--ink);border-color:var(--field-line)}
.kry-reassure{font-size:14px;color:var(--ink-dim);margin:2px 0 0;line-height:1.45}
.kry-endform{background:var(--paper);color:var(--ink);border:1px solid var(--line);padding:clamp(20px,3vw,36px)}
.kry-endform h2{font-size:clamp(1.4rem,2.4vw,2rem)}

/* ── volet latéral (formulaire long) ── */
.kry-scrim{position:fixed;inset:0;background:oklch(11% 0.024 85 / .66);z-index:80}
.kry-drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);background:var(--paper);color:var(--ink);z-index:90;overflow:auto;padding:24px clamp(18px,3vw,32px) 40px;border-left:1px solid var(--line);transform:translateX(102%);transition:transform .28s ease;visibility:hidden}
.kry-drawer[aria-hidden="false"],.kry-drawer.esg-is-open{transform:none;visibility:visible}
.kry-scrim{opacity:0;pointer-events:none;transition:opacity .22s ease}
body:has(.kry-drawer.esg-is-open) .kry-scrim{opacity:1;pointer-events:auto}
[data-hdr].esg-is-solid{border-bottom-color:var(--line-d2)}
.kry-drawer-close{float:right;font-family:var(--f-title);font-weight:700;background:none;border:1px solid var(--field-line);padding:11px 16px;min-height:44px;cursor:pointer;color:var(--ink)}
.kry-tab{position:fixed;right:0;top:42%;z-index:60;writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--f-title);font-weight:700;font-size:14px;letter-spacing:.08em;background:var(--accent);color:var(--accent-ink);border:0;padding:16px 10px;cursor:pointer}
@media(max-width:980px){.kry-tab{display:none}}

/* ── bloc « obligatoire ou pas » + chiffres géants en marge (rupture 2 : profondeurs) ── */
.snd-oblig{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(170px,260px);gap:clamp(24px,4vw,64px);align-items:start}
.snd-depths{display:flex;flex-direction:column;gap:18px;border-left:1px solid var(--line-d2);padding-left:clamp(16px,2.5vw,36px)}
.snd-depth b{display:block;font-family:var(--f-title);font-weight:200;font-size:clamp(2.6rem,5vw,4.6rem);line-height:.9;letter-spacing:-.04em;color:var(--accent)}
.snd-depth span{display:block;font-family:var(--f-title);font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--paper-dim);max-width:24ch}
.esg-light .snd-depth span{color:var(--ink-dim)}
.esg-light .snd-depth b{color:var(--accent-deep)}
@media(max-width:760px){.snd-oblig{grid-template-columns:1fr}.snd-depths{border-left:0;border-top:1px solid var(--line-d2);padding:18px 0 0;flex-direction:row;flex-wrap:wrap;gap:28px}}
.snd-branches{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line-d2);margin-top:22px}
.snd-branches>div{padding:18px 18px 18px 0;border-bottom:1px solid var(--line-d2)}
.snd-branches>div+div{padding-left:18px;border-left:1px solid var(--line-d2)}
.esg-light .snd-branches,.esg-light .snd-branches>div{border-color:var(--line)}
@media(max-width:640px){.snd-branches{grid-template-columns:1fr}.snd-branches>div+div{padding-left:0;border-left:0}}

/* ── LA COLONNE DE SONDAGE (module signature) ── */
.snd-col{display:grid;grid-template-columns:minmax(0,.95fr) 150px minmax(0,1.1fr);gap:clamp(20px,3vw,44px);align-items:stretch}
.snd-q fieldset{border:0;margin:0 0 18px;padding:0}
.snd-q legend{font-family:var(--f-title);font-weight:700;font-size:15px;margin-bottom:8px}
.snd-q label{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--line-d);cursor:pointer;font-size:16px;line-height:1.35}
.snd-q input{margin-top:3px}
.snd-shaft{position:relative;border:1px solid var(--line-d2);background:var(--ink-2);min-height:420px}
.snd-layer{position:absolute;left:0;right:0}
.snd-layer::after{content:"";position:absolute;inset:0;background:var(--ink-2);opacity:.72;transition:opacity .35s ease}
.snd-layer[data-on="1"]::after{opacity:0}
.snd-layer i{position:absolute;z-index:2;left:6px;top:6px;font-style:normal;font-family:var(--f-title);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--paper);background:var(--ink-2);padding:2px 6px}
.snd-l1{top:0;height:12%;background:var(--st-4)}
.snd-l2{top:12%;height:22%;background:var(--st-2)}
.snd-l3{top:34%;height:30%;background:var(--st-3)}
.snd-l4{top:64%;height:36%;background:var(--st-5)}

.snd-gauge{position:absolute;left:-1px;right:-1px;height:0;border-top:2px dashed var(--accent);opacity:0;transition:opacity .3s,top .35s}
.snd-gauge[data-on="1"]{opacity:1}
.snd-gauge span{position:absolute;right:4px;top:-22px;font-family:var(--f-title);font-weight:800;font-size:15px;color:var(--accent);background:var(--ink-2);padding:0 4px}
.snd-out{border-top:1px solid var(--line-d2);padding-top:14px}
.snd-out h3{font-size:1.3rem}
.snd-out p{color:var(--paper-dim)}
.snd-out p strong{color:var(--paper)}
@media(max-width:980px){.snd-col{grid-template-columns:1fr 110px}.snd-out{grid-column:1 / -1}.snd-shaft{min-height:360px}}
@media(max-width:560px){.snd-col{grid-template-columns:1fr}.snd-shaft{min-height:180px}}

/* ── tableau des missions G1 à G5 ── */
.esg-tw{overflow-x:auto;border:1px solid var(--line-d2)}
.esg-light .esg-tw,.esg-light2 .esg-tw{border-color:var(--line)}
table{border-collapse:collapse;width:100%;font-size:16px;min-width:620px}
caption{text-align:left;font-family:var(--f-title);font-size:13px;letter-spacing:.06em;padding:10px 14px;color:var(--paper-dim)}
.esg-light caption,.esg-light2 caption{color:var(--ink-dim)}
th,td{text-align:left;vertical-align:top;padding:12px 14px;border-top:1px solid var(--line-d)}
.esg-light th,.esg-light td,.esg-light2 th,.esg-light2 td{border-color:var(--line)}
th{font-family:var(--f-title);font-size:13px;letter-spacing:.08em;text-transform:uppercase}
tr.snd-hl td{background:oklch(60% 0.150 85 / .14)}
tr.snd-hl td:first-child{box-shadow:inset 3px 0 0 var(--accent)}

/* ── cartes de pages (maillage), étapes, listes ── */
.esg-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));border-top:1px solid var(--line-d2);border-left:1px solid var(--line-d2)}
.esg-cards a{display:flex;flex-direction:column;gap:6px;padding:22px 22px 26px;border-right:1px solid var(--line-d2);border-bottom:1px solid var(--line-d2);text-decoration:none}
.esg-cards a strong{font-size:1.15rem}
.esg-cards a span{color:var(--paper-dim);font-size:16px}
.esg-cards a:hover{background:var(--deck)}
.esg-cards a em{font-style:normal;font-family:var(--f-title);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.esg-light .esg-cards,.esg-light .esg-cards a,.esg-light2 .esg-cards,.esg-light2 .esg-cards a{border-color:var(--line)}
.esg-light .esg-cards a span,.esg-light2 .esg-cards a span{color:var(--ink-dim)}
.esg-light .esg-cards a:hover,.esg-light2 .esg-cards a:hover{background:var(--surface)}
.esg-light .esg-cards a em{color:var(--accent-deep)}
.esg-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:0;border-top:1px solid var(--line-d2)}
.esg-steps>div{padding:20px 20px 20px 0;border-bottom:1px solid var(--line-d2)}
.esg-steps b{display:block;font-family:var(--f-title);font-weight:200;font-size:2.6rem;line-height:1;color:var(--accent)}
.esg-light .esg-steps,.esg-light .esg-steps>div,.esg-light2 .esg-steps,.esg-light2 .esg-steps>div{border-color:var(--line)}
.esg-light .esg-steps b,.esg-light2 .esg-steps b{color:var(--accent-deep)}
.esg-list{padding-left:0;list-style:none;margin:0 0 1.2em}
.esg-list li{padding:10px 0 10px 26px;border-bottom:1px solid var(--line-d);position:relative}
.esg-list li::before{content:"";position:absolute;left:0;top:21px;width:14px;height:1px;background:var(--accent)}
.esg-light .esg-list li,.esg-light2 .esg-list li{border-color:var(--line)}
.esg-light .esg-list li::before,.esg-light2 .esg-list li::before{background:var(--accent-deep)}
.esg-loi{border:1px solid var(--line-d2);border-left:3px solid var(--accent);padding:16px 18px;margin:0 0 1.4em}
.esg-light .esg-loi,.esg-light2 .esg-loi{border-color:var(--line);border-left-color:var(--accent-deep)}
.esg-loi h3{margin-bottom:6px}
.esg-objection{border-top:1px solid var(--line-d2);border-bottom:1px solid var(--line-d2);padding:18px 0;margin:6px 0 1.4em}
.esg-light .esg-objection,.esg-light2 .esg-objection{border-color:var(--line)}
.esg-objection p:first-child{font-family:var(--f-title);font-weight:700;font-size:1.05rem}
.esg-fig{margin:0 0 1.4em;border:1px solid var(--line-d2)}
.esg-fig img{width:100%;aspect-ratio:3/2;object-fit:cover}
.esg-fig figcaption{font-family:var(--f-title);font-size:13px;padding:8px 12px;color:var(--paper-dim)}
.esg-light .esg-fig,.esg-light2 .esg-fig{border-color:var(--line)}
.esg-light .esg-fig figcaption,.esg-light2 .esg-fig figcaption{color:var(--ink-dim)}
.esg-split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
@media(max-width:860px){.esg-split{grid-template-columns:1fr}}

/* ── reprises de conversion (couple phrase + bouton) ── */
.kry-reprise{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line-d2);border-bottom:1px solid var(--line-d2);padding:20px 0;margin:0}
.kry-reprise p{margin:0;max-width:60ch;font-family:var(--f-title);font-weight:600;font-size:1.05rem}
.esg-light .kry-reprise,.esg-light2 .kry-reprise{border-color:var(--line)}

/* ── avis ── */
.kry-avis-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.kry-avis-moy{font-family:var(--f-title);font-weight:800;font-size:1.4rem}
.kry-avis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.kry-avis-grid article{padding:20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.kry-stars{color:var(--accent-deep);letter-spacing:.12em;font-size:15px}
.kry-avis-aut{font-family:var(--f-title);font-size:14px;font-weight:600;color:var(--ink-dim);margin:0}
.kry-avis-more summary{cursor:pointer;font-family:var(--f-title);font-weight:700;padding:14px 0}

/* ── FAQ ── */
.esg-faq details{border-bottom:1px solid var(--line-d2)}
.esg-light .esg-faq details,.esg-light2 .esg-faq details{border-color:var(--line)}
.esg-faq summary{cursor:pointer;list-style:none;font-family:var(--f-title);font-weight:700;font-size:1.08rem;padding:18px 36px 18px 0;position:relative}
.esg-faq summary::-webkit-details-marker{display:none}
.esg-faq summary::after{content:"+";position:absolute;right:4px;top:14px;font-size:1.5rem;font-weight:200;color:var(--accent)}
.esg-faq details[open] summary::after{content:"−"}
.esg-faq .esg-a{padding:0 0 18px}

/* ── blog ── */
.esg-blog-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));border-top:1px solid var(--line-d2);border-left:1px solid var(--line-d2)}
.esg-blog-list a{display:flex;flex-direction:column;text-decoration:none;border-right:1px solid var(--line-d2);border-bottom:1px solid var(--line-d2)}
.esg-blog-list img{aspect-ratio:3/2;object-fit:cover;width:100%}
.esg-blog-list a div{padding:16px 18px 22px}
.esg-blog-list strong{display:block;font-size:1.1rem;margin-bottom:6px}
.esg-blog-list span{color:var(--paper-dim);font-size:16px}
.esg-art{max-width:72ch}
.esg-art h2{font-size:clamp(1.4rem,2.4vw,2rem);margin-top:1.4em}

/* ── pied de page (un seul étage) ── */
.esg-ft{background:var(--deck);border-top:1px solid var(--line-d2);padding:48px 0 28px;font-size:15px}
.esg-ft-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.esg-ft h3{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.esg-ft ul{list-style:none;margin:0;padding:0}
.esg-ft li{margin:0 0 6px}
.esg-ft a{color:var(--paper-dim);text-decoration:none}
.esg-ft a:hover{color:var(--paper);text-decoration:underline}
.esg-foot-sources{margin-top:32px;padding-top:14px;border-top:1px solid var(--line-d);font-size:13px;color:var(--paper-dim)}
.esg-foot-sources a{color:var(--paper-dim);text-decoration:underline}
.esg-ft-end{font-size:13px;color:var(--paper-dim);margin-top:10px}
@media(max-width:860px){.esg-ft-cols{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.esg-ft-cols{grid-template-columns:1fr}}

/* ── pages légales, merci, 404 ── */
.esg-plain{max-width:74ch}

/* positions des graduations de la carotte (sans style en ligne : CSP style-src 'self') */
.snd-p0{top:0}.snd-p1{top:26.7%}.snd-p2{top:40%}.snd-p3{top:66.7%}.snd-p4{top:100%}
.esg-sec-reprise{padding:0 0 40px}.esg-sec-top{padding-top:32px}.esg-sec-bottom{padding-bottom:40px}

/* contrastes sur fond clair secondaire (G46) : mêmes règles que .esg-light */
.esg-light2 .esg-kicker{color:var(--accent-deep)}
.esg-light2 .esg-lede,.esg-light2 .esg-fig figcaption,.esg-light2 .esg-cards a span,.esg-light2 .snd-depth span{color:var(--ink-dim)}
.esg-light2 .snd-depth b,.esg-light2 .esg-steps b{color:var(--accent-deep)}
.esg-light2 .kry-reprise p,.esg-light2 h2,.esg-light2 h3,.esg-light2 p{color:var(--ink)}
/* en-tête : menu compact dès 1080 px (l'en-tête débordait de 5 px à 1024) */
@media (max-width:1080px){
  .esg-burger{display:block}
  .esg-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--deck);border-bottom:1px solid var(--line-d2);padding:8px 20px 16px;max-height:80vh;overflow:auto}
  .esg-hdr[data-nav="1"] .esg-nav{display:block}
  .esg-nav>ul{flex-direction:column;align-items:stretch}
  .esg-nav .esg-panel{position:static;min-width:0;border:0;padding:0 0 0 12px}
  .esg-mark span{display:none}
}

/* index du blog : vignettes plus basses (plafond de 4 écrans par section) et texte lisible sur fond clair */
.esg-blog-list img{aspect-ratio:16/9}
.esg-light .esg-blog-list span,.esg-light2 .esg-blog-list span{color:var(--ink-dim)}
.esg-light .esg-blog-list a,.esg-light2 .esg-blog-list a{border-color:var(--line)}
.esg-light .esg-blog-list,.esg-light2 .esg-blog-list{border-color:var(--line)}

/* index du blog : cartes plus denses (plafond de 4 écrans par section) */
.esg-blog-list a div{padding:12px 14px 16px}
.esg-blog-list strong{font-size:1.05rem;margin-bottom:4px}
.esg-blog-list span{font-size:15px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* fil d'Ariane sur fond clair (contraste) */
.esg-light .esg-crumb ol,.esg-light2 .esg-crumb ol,.esg-light .esg-crumb a,.esg-light2 .esg-crumb a{color:var(--ink-dim)}

/* l'index du blog est une vraie liste (exemption « sommaire » du plafond de section) */
.esg-blog-list{list-style:none;margin:0;padding:0}
.esg-blog-list li{display:flex}
.esg-blog-list li>a{flex:1}

/* kit de comportements (gen_kit_components.py, graine = domaine) */
/* Bloc CSS minimal à coller dans theme.css du site — généré par gen_kit_components.py.
   esg est déjà substitué par le préfixe du site dans le fichier livré ; ce gabarit
   reste en clair ici pour qu'on sache ce qui a été injecté. */

/* --- en-tête (data-hdr) --- */
/* .esg-is-solid est ajoutée quand la page a défilé au-delà du seuil — l'état est
   TOUJOURS correct dès le premier rendu (les 3 variantes du générateur synchronisent
   immédiatement, jamais seulement au prochain scroll). Adapter le rendu visuel à la
   direction du site : */
[data-hdr] { transition: background-color .2s ease, box-shadow .2s ease; }
[data-hdr].esg-is-solid { /* ex. background:var(--paper); box-shadow:0 1px 0 var(--line); */ }

/* --- callbar mobile (data-mbar) --- */
:root { --esg-callbar-h: 64px; } /* repli no-JS, écrasé en direct par le générateur */
[data-mbar] { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; }
/* Exemple d'usage — à poser sur le bouton d'envoi du hero pour ne jamais être recouvert :
   .hero-submit { margin-bottom: var(--esg-callbar-h); } */

/* --- volet latéral (data-drawer) --- */
[data-drawer] {
  position: fixed; inset: 0 0 0 auto; width: min(468px, 100vw); z-index: 90;
  transform: translateX(101%); transition: transform .28s ease; overflow-y: auto;
}
[data-drawer].esg-is-open { transform: translateX(0); }
[data-drawer-scrim] {
  position: fixed; inset: 0; z-index: 85; opacity: 0; pointer-events: none;
  transition: opacity .22s ease; background: oklch(0.22 0.03 250 / .5);
}
/* :has() plutôt qu'une classe posée en plus par le JS sur le scrim — un point de moins à
   maintenir en cohérence entre script et CSS. */
body:has([data-drawer].esg-is-open) [data-drawer-scrim] { opacity: 1; pointer-events: auto; }

/* verrouillage du scroll body pendant que le volet est ouvert */
html.esg-scroll-locked { overflow: hidden; }
html.esg-scroll-locked body { position: fixed; left: 0; right: 0; width: 100%; }

/* --- simulateur (data-sim) --- */
[data-sim-result] { font-variant-numeric: tabular-nums; }