/* ==========================================================================
   CyberSEN — feuille de style unique (production).
   Système issu de la démo validée : fond nuit, champ de particules 3 couches, verre dépoli, goutte de mercure,
   lumière fluide sur les boutons. Deux chartes de marché : Sénégal (terracotta #A17E6E) et France (bleu-gris #6E91A1).
   Thème à trois positions (Sombre · Auto · Clair). Polices auto-hébergées (aucun appel à un service tiers).
   ========================================================================== */
@font-face{font-family:"DM Sans";font-style:normal;font-weight:100 1000;font-display:swap;src:url("/assets/fonts/dm-sans-latin-opsz-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:100 1000;font-display:swap;src:url("/assets/fonts/dm-sans-latin-ext-opsz-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/dm-mono-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"DM Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/dm-mono-latin-500-normal.woff2") format("woff2")}
:root{
  color-scheme:dark;
  --f:"DM Sans","Helvetica Neue",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"DM Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
  --spring:cubic-bezier(.34,1.4,.5,1);
  --gutter:clamp(16px,4vw,40px);
  --r-lg:26px;--r-md:18px;--r-sm:12px;

  /* ---- Marché Sénégal (défaut) ---- */
  --m-brand:#A17E6E;--m-btn:#8E6553;--m-btn-hi:#A77A66;
  --m-acc-d:#D6A993;--m-acc-l:#86574A;--m-accrgb-d:214,169,147;--m-accrgb-l:134,87,74;
  --m-glow:199,138,110;--m-glow2:150,110,150;
  --m-n0:#110E0D;--m-n1:#1A1513;--m-n2:#231D1A;--m-tvd:17,14,13;
  --m-tx:#F3EBE6;--m-tx2:#B8A9A0;--m-tx3:#83766E;--m-pd:247,233,224;
  --m-p0:#F4EDE8;--m-p1:#FFFFFF;--m-p2:#ECE2DB;--m-tvl:244,237,232;
  --m-tl:#241B17;--m-tl2:#5E4F48;--m-tl3:#8A7C74;--m-pl:110,72,58;
  --m-foot:#5F4438;

  --m-thr-d:224,116,80;--m-thr-l:168,78,50; /* SN : terracotta vif, variante de #A17E6E */
  --threat:var(--m-thr-d);
  --m-leg-l:166,146,136; /* messages légitimes en thème clair : neutre chaud, bien distinct de la menace */
  --legit:var(--m-pd);

  /* ---- Thème sombre (défaut) ---- */
  --bg:var(--m-n0);--card:var(--m-n1);--card-2:var(--m-n2);--tv:var(--m-tvd);
  --text:var(--m-tx);--text-2:var(--m-tx2);--text-3:var(--m-tx3);
  --line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.16);--chip:rgba(255,255,255,.06);
  --acc:var(--m-acc-d);--acc-rgb:var(--m-accrgb-d);--particle:var(--m-pd);--glow:var(--m-glow);--glow2:var(--m-glow2);
  --btn:var(--m-btn);--btn-hi:var(--m-btn-hi);--btn-ink:#FFFFFF;
  --rim:255,255,255;--rim-a:.10;--hl-a:.08;--glass-a:.6;
  --shadow:0 40px 80px -40px rgba(0,0,0,.85);
  --merc-1:#8E8A88;--merc-2:#F4EFEC;--merc-3:#6F6A67;
  --foot:transparent;
}
/* ---- Marché France : bleu-gris, neutres légèrement froids ---- */
:root[data-market="fr"]{
  --m-brand:#6E91A1;--m-btn:#4D7385;--m-btn-hi:#5F8698;
  --m-acc-d:#96C1D4;--m-acc-l:#3D6476;--m-accrgb-d:150,193,212;--m-accrgb-l:61,100,118;
  --m-glow:96,150,178;--m-glow2:120,120,190;
  --m-n0:#0C1114;--m-n1:#131B20;--m-n2:#1A242A;--m-tvd:12,17,20;
  --m-tx:#E9EFF2;--m-tx2:#A2B1B9;--m-tx3:#6E7D85;--m-pd:228,240,246;
  --m-p0:#EDF2F4;--m-p1:#FFFFFF;--m-p2:#E0E8EC;--m-tvl:237,242,244;
  --m-tl:#141F25;--m-tl2:#495B64;--m-tl3:#7A8B93;--m-pl:40,70,86;
  --m-foot:#1B2529;
  --m-thr-d:78,160,212;--m-thr-l:24,108,168; /* FR : bleu acier vif, variante de #6E91A1 */
  --m-leg-l:140,156,164;
}
/* ---- Thème clair (système sans choix explicite, ou choix explicite) ---- */
@media (prefers-color-scheme:light){
  :root:not([data-theme="dark"]){
    color-scheme:light;
    --bg:var(--m-p0);--card:var(--m-p1);--card-2:var(--m-p2);--tv:var(--m-tvl);
    --text:var(--m-tl);--text-2:var(--m-tl2);--text-3:var(--m-tl3);
    --line:rgba(20,16,14,.09);--line-2:rgba(20,16,14,.18);--chip:rgba(20,16,14,.05);
    --acc:var(--m-acc-l);--acc-rgb:var(--m-accrgb-l);--particle:var(--m-pl);
    --rim:20,16,14;--rim-a:.10;--hl-a:.9;--glass-a:.7;
    --shadow:0 30px 60px -30px rgba(30,20,16,.25);
    --merc-1:#5E5A58;--merc-2:#B9B3AF;--merc-3:#2E2A28;
    --foot:var(--m-foot);
    --threat:var(--m-thr-l);
    --legit:var(--m-leg-l);
  }
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:var(--m-p0);--card:var(--m-p1);--card-2:var(--m-p2);--tv:var(--m-tvl);
  --text:var(--m-tl);--text-2:var(--m-tl2);--text-3:var(--m-tl3);
  --line:rgba(20,16,14,.09);--line-2:rgba(20,16,14,.18);--chip:rgba(20,16,14,.05);
  --acc:var(--m-acc-l);--acc-rgb:var(--m-accrgb-l);--particle:var(--m-pl);
  --rim:20,16,14;--rim-a:.10;--hl-a:.9;--glass-a:.7;
  --shadow:0 30px 60px -30px rgba(30,20,16,.25);
  --merc-1:#5E5A58;--merc-2:#B9B3AF;--merc-3:#2E2A28;
  --foot:var(--m-foot);
  --threat:var(--m-thr-l);
  --legit:var(--m-leg-l);
}
:root[data-theme="dark"]{color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--f);font-size:16px;line-height:1.58;font-optical-sizing:auto;-webkit-font-smoothing:antialiased;overflow-x:clip;transition:background-color .7s var(--ease),color .5s}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0}
input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3,h4{font-weight:440;letter-spacing:-.005em;line-height:1.12;text-wrap:balance}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1220px;margin-inline:auto;padding-inline:var(--gutter);position:relative}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);display:inline-flex;align-items:center;gap:10px}
.h1{font-size:clamp(40px,6vw,76px);line-height:1.02;font-weight:420;letter-spacing:-.022em}
.h2{font-size:clamp(30px,3.6vw,48px);letter-spacing:-.015em}
.h3{font-size:clamp(21px,2vw,26px)}
.lede{color:var(--text-2);font-size:clamp(16.5px,1.35vw,19px);line-height:1.6;max-width:58ch}
.muted{color:var(--text-2)}
.mono{font-family:var(--mono)}
.num{font-variant-numeric:tabular-nums}

/* ---------- champ de particules (fond fixe, 3 couches) ---------- */
.field{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(70% 55% at 78% 8%,rgba(var(--glow),.16),transparent 70%),radial-gradient(55% 45% at 5% 40%,rgba(var(--glow2),.09),transparent 70%),var(--bg);transition:background .7s}
.field canvas{position:absolute;inset:0;width:100%;height:100%}
/* écran de veille (field.js) : le contenu s'efface en fondu, seul le champ de particules reste ; le voile absorbe le clic de réveil */
html.is-idle body > :not(.field):not(.idle-veil){opacity:0!important;pointer-events:none!important;transition:opacity 1.2s var(--ease)!important}
html.is-waking body > :not(.field):not(.idle-veil){transition:opacity .5s var(--ease)!important}
.idle-veil{position:fixed;inset:0;z-index:9999;cursor:none;background:transparent}
.idle-trigger{-webkit-user-select:none;user-select:none}
.main,.site-footer{position:relative;z-index:1}

/* ---------- voiles de lisibilité (texte au-dessus des particules) ---------- */
.veil{position:relative;isolation:isolate;--vx:80px;--vy:56px}
.veil::before{content:"";position:absolute;z-index:-1;pointer-events:none;inset:calc(-1*var(--vy)) calc(-1*var(--vx));border-radius:40px;background:rgba(var(--tv),.66);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--vx),#000 calc(100% - var(--vx)),transparent),linear-gradient(180deg,transparent,#000 var(--vy),#000 calc(100% - var(--vy)),transparent);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 var(--vx),#000 calc(100% - var(--vx)),transparent),linear-gradient(180deg,transparent,#000 var(--vy),#000 calc(100% - var(--vy)),transparent);mask-composite:intersect}
.veil :is(h1,h2,.lede,.eyebrow){text-shadow:0 0 1px rgba(var(--tv),.9),0 0 16px rgba(var(--tv),.85)}
@media (max-width:700px){.veil{--vx:var(--gutter);--vy:40px}}

/* ---------- boutons (lueur qui suit le pointeur + lumière fluide) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 22px;border-radius:40px;font-size:15px;font-weight:460;white-space:nowrap;border:1px solid transparent;position:relative;isolation:isolate;overflow:hidden;transition:background .3s,border-color .3s,transform .3s var(--ease),color .3s}
.btn>*{position:relative;z-index:1}
.btn::before{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;background:radial-gradient(150px 80px at var(--mx,50%) var(--my,50%),rgba(255,255,255,.22),transparent 70%);opacity:0;transition:opacity .3s;pointer-events:none}
.btn:hover::before{opacity:1}
.btn-sm{height:38px;padding:0 16px;font-size:14px}
.btn-lg{height:54px;padding:0 28px;font-size:16px}
.btn-primary{background:var(--btn);color:var(--btn-ink);box-shadow:0 14px 34px -16px rgba(var(--glow),.9)}
.btn-primary:hover{background:var(--btn-hi)}
.btn-primary:active{transform:scale(.985)}
.btn-ghost{border-color:var(--line-2);color:var(--text);background:rgba(var(--tv),.25)}
.btn-ghost:hover{background:var(--chip)}
.btn-ghost::before{background:radial-gradient(140px 70px at var(--mx,50%) var(--my,50%),rgba(var(--acc-rgb),.18),transparent 70%)}
.btn-fluid{position:absolute;left:-2px;top:-2px;width:calc(100% + 4px);height:calc(100% + 4px);z-index:0!important;pointer-events:none;mix-blend-mode:screen;filter:blur(2px);opacity:.95;border-radius:inherit}
.btn svg{width:15px;height:15px}
.link{display:inline-flex;align-items:center;gap:6px;color:var(--acc);font-weight:460}
.link svg{width:14px;height:14px;transition:transform .25s var(--ease)}
.link:hover svg{transform:translateX(3px)}

/* ---------- en-tête « Bouclier » : îlot de verre, goutte de mercure, capsule ---------- */
.hdr{position:relative;z-index:50;height:76px;--p:0;--read:0}
.bar{position:fixed;z-index:3;top:calc(var(--p)*12px + env(safe-area-inset-top,0px));left:calc(var(--p)*max(16px,(100% - 1180px)/2));right:calc(var(--p)*max(16px,(100% - 1180px)/2));height:calc(76px - var(--p)*14px);border-radius:calc(var(--p)*31px);
  transition:opacity .35s var(--ease),transform .5s var(--ease),visibility 0s}
.glass{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;
  background-color:rgba(var(--tv),calc(var(--p)*var(--glass-a)));
  -webkit-backdrop-filter:blur(calc(var(--p)*22px)) saturate(calc(1 + var(--p)*.6));backdrop-filter:blur(calc(var(--p)*22px)) saturate(calc(1 + var(--p)*.6));
  box-shadow:inset 0 0 0 1px rgba(var(--rim),calc(var(--p)*var(--rim-a))),inset 0 1px 0 rgba(255,255,255,calc(var(--p)*var(--hl-a))),0 18px 44px -24px rgba(0,0,0,calc(var(--p)*.7))}
.glass i{position:absolute;inset:0;border-radius:inherit;opacity:0;transition:opacity .45s}
.glass .rim{padding:1px;background:radial-gradient(180px 80px at var(--gx,50%) var(--gy,0%),rgba(var(--rim),.55),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.glass .sheen{background:radial-gradient(260px 110px at var(--gx,50%) 0%,rgba(255,255,255,.08),transparent 70%)}
@media (hover:hover){.bar:hover .glass .rim{opacity:calc(var(--p)*.9)}.bar:hover .glass .sheen{opacity:var(--p)}}
.glass .prog{inset:auto 0 0 0;height:2px;opacity:1}
.glass .prog b{position:absolute;left:0;top:0;bottom:0;width:calc(var(--read)*100%);background:linear-gradient(90deg,transparent,rgba(var(--acc-rgb),.6) 50%,var(--acc));opacity:var(--p)}
.bar-in{position:relative;z-index:1;height:100%;max-width:1220px;margin-inline:auto;display:flex;align-items:center;gap:18px;padding-inline:calc(var(--gutter) - var(--p)*(var(--gutter) - 14px))}
.brand{display:inline-flex;align-items:center;gap:10px;flex:none;border-radius:12px}
.brand .lion{width:36px;height:36px;flex:none;filter:drop-shadow(0 4px 12px rgba(214,110,60,.25))}
.brand .wm{height:31px;width:auto;flex:none}
.brand .wm-l{display:none}
.lg{display:inline-flex;align-items:center;gap:10px}
.lg-fr,.m-fr{display:none!important}
:root[data-market="fr"] .lg-sn,:root[data-market="fr"] .m-sn{display:none!important}
:root[data-market="fr"] .lg-fr{display:inline-flex!important}:root[data-market="fr"] .m-fr{display:block!important}
.brand .lion{filter:drop-shadow(0 4px 12px rgba(var(--glow),.3))}
:root[data-theme="light"] .hdr .brand .wm-d{display:none}:root[data-theme="light"] .hdr .brand .wm-l{display:block}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .hdr .brand .wm-d{display:none}:root:not([data-theme="dark"]) .hdr .brand .wm-l{display:block}}
.f-logo{width:170px;height:auto;display:block;margin-left:-10px}
/* logo statique (lion + mot-symbole) légèrement translucide partout où il apparaît : en-tête, capsule, pied de page, page de choix */
:root{--logo-a:.6}
.brand .lg img,.f-logo,.cap-seal img,.choice-logo img{opacity:var(--logo-a)}
.nav{position:relative;display:flex;align-items:center;gap:2px;margin-inline:auto}
.nav-l{position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:40px;font-size:15px;color:var(--text);white-space:nowrap;transition:color .2s}
.nav-l svg{width:12px;height:12px;transition:transform .3s var(--ease)}
.nav-l[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav-l.is-cur{color:var(--acc)}
.drop{position:absolute;left:0;top:0;height:38px;width:0;border-radius:40px;opacity:0;pointer-events:none;will-change:transform,width;
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 55%,rgba(255,255,255,.08));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 1px rgba(0,0,0,.25),0 6px 16px -8px rgba(0,0,0,.6);transition:opacity .3s}
:root[data-theme="light"] .drop{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.6));box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(20,16,14,.07),0 6px 16px -8px rgba(30,20,16,.3)}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .drop{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.6));box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(20,16,14,.07),0 6px 16px -8px rgba(30,20,16,.3)}}
.mega{position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-38%);width:min(720px,92vw);display:grid;grid-template-columns:1.35fr 1fr;gap:6px;padding:10px;border-radius:22px;
  background:rgba(var(--tv),.88);-webkit-backdrop-filter:blur(26px) saturate(1.5);backdrop-filter:blur(26px) saturate(1.5);
  box-shadow:inset 0 0 0 1px rgba(var(--rim),var(--rim-a)),inset 0 1px 0 rgba(255,255,255,var(--hl-a)),var(--shadow);animation:pop .28s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateX(-38%) translateY(-6px)}to{opacity:1;transform:translateX(-38%)}}
.mega-list{display:grid;gap:2px}
.mega-list a{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start;padding:10px 12px;border-radius:14px;transition:background .2s}
.mega-list a:hover,.mega-list a:focus-visible{background:var(--chip)}
.mega-list .ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(var(--acc-rgb),.14);color:var(--acc)}
.mega-list .ic svg{width:18px;height:18px}
.mega-list b{display:block;font-weight:480;font-size:15px}
.mega-list span{display:block;font-size:13px;color:var(--text-2);line-height:1.4}
.mega-side{border-radius:16px;padding:18px;background:linear-gradient(160deg,rgba(var(--acc-rgb),.16),rgba(var(--acc-rgb),.03));display:flex;flex-direction:column;gap:12px;justify-content:space-between}
.mega-side p{font-size:14px;color:var(--text-2)}
.mega-side .cyc{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.mega-side .cyc span{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:7px 9px;border-radius:9px;background:rgba(var(--tv),.5);color:var(--text)}
.acts{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none}
/* Thème à trois positions, comme sur CT Conseil : Sombre · Auto (au milieu, par défaut) · Clair — une pastille glisse sous l'icône choisie */
.theme-switch{position:relative;display:inline-grid;grid-template-columns:repeat(3,30px);align-items:center;padding:3px;border-radius:40px;border:1px solid var(--line-2);flex:none}
.theme-switch button{position:relative;z-index:1;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;color:var(--text-2);transition:color .25s}
.theme-switch button:hover{color:var(--text)}
.theme-switch button[aria-checked="true"]{color:var(--bg)}
.theme-switch button:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.theme-switch svg{width:14px;height:14px}
.theme-knob{position:absolute;top:3px;left:3px;width:30px;height:30px;border-radius:50%;background:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 12px -4px rgba(0,0,0,.5);transition:transform .5s var(--spring),background .5s}
.theme-switch[data-mode="auto"] .theme-knob{transform:translateX(30px)}
.theme-switch[data-mode="light"] .theme-knob{transform:translateX(60px)}
.theme-switch.is-moving .theme-knob{animation:goo2 .5s var(--ease)}
@keyframes goo2{40%{width:40px}100%{width:30px}}
.burger{display:none;position:relative;width:42px;height:42px;border-radius:50%;flex-direction:column;align-items:center;justify-content:center;gap:5px;flex:none}
.burger>span{display:block;width:18px;height:1.6px;border-radius:2px;background:var(--text);transition:transform .35s var(--ease)}
.burger[aria-expanded="true"]>span:first-of-type{transform:translateY(3.3px) rotate(45deg)}
.burger[aria-expanded="true"]>span:last-of-type{transform:translateY(-3.3px) rotate(-45deg)}
.ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);pointer-events:none}
.ring circle{fill:none;stroke-width:1.5}
.ring .tr{stroke:var(--line-2)}
.ring .pg{stroke:var(--acc);stroke-linecap:round;stroke-dasharray:var(--c);stroke-dashoffset:calc(var(--c)*(1 - var(--read)))}

/* capsule (lecture) : sceau bouclier + anneau de progression + section en cours */
.cap{position:fixed;z-index:4;top:calc(12px + env(safe-area-inset-top,0px));left:max(16px,(100% - 1180px)/2);display:flex;align-items:center;height:52px;padding:2px;border-radius:30px;
  background:rgba(var(--tv),.8);-webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);
  box-shadow:inset 0 0 0 1px rgba(var(--rim),calc(var(--rim-a) + .04)),inset 0 1px 0 rgba(255,255,255,var(--hl-a)),0 14px 34px -14px rgba(0,0,0,.6);
  opacity:0;visibility:hidden;transform:translateY(-10px) scale(.92);transform-origin:left center;transition:opacity .2s,transform .4s var(--ease),visibility 0s .4s}
.cap-seal{position:relative;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--acc);--c:144.5}
.cap-seal>img{width:28px;height:28px}
.cap-ctx{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 16px 0 6px;font-size:15px;white-space:nowrap;border-radius:0 26px 26px 0}
.cap-ctx .roll{display:inline-grid;overflow:hidden;height:22px;line-height:22px;max-width:46vw}
.cap-ctx .roll span{grid-area:1/1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cap-ctx .roll .in{animation:rin .5s var(--ease) both}.cap-ctx .roll .out{animation:rout .4s var(--ease) both}
@keyframes rin{from{transform:translateY(100%);opacity:0}to{transform:none;opacity:1}}
@keyframes rout{to{transform:translateY(-100%);opacity:0}}
.cap-ctx svg{width:12px;height:12px;color:var(--text-2);transition:transform .3s var(--ease)}
.hdr.is-outline .cap-ctx svg{transform:rotate(180deg)}
.cap-cta{position:fixed;z-index:4;top:calc(19px + env(safe-area-inset-top,0px));right:max(16px,(100% - 1180px)/2);opacity:0;visibility:hidden;transform:scale(.9);transition:opacity .2s,transform .4s var(--ease),visibility 0s .4s}
.hdr.is-folded .bar{opacity:0;visibility:hidden;transform:translateY(-14px) scale(.985);transition:opacity .25s,transform .45s var(--ease),visibility 0s .45s}
.hdr.is-folded .cap{opacity:1;visibility:visible;transform:none;transition:opacity .35s .12s,transform .6s .1s var(--spring),visibility 0s}
.hdr.is-folded .cap-cta{opacity:1;visibility:visible;transform:none;transition:opacity .3s .18s,transform .55s .15s var(--spring),visibility 0s}
.outline{position:fixed;z-index:5;top:calc(74px + env(safe-area-inset-top,0px));left:max(16px,(100% - 1180px)/2);width:min(600px,calc(100% - 32px));max-height:calc(100vh - 110px);overflow:auto;overscroll-behavior:contain;
  display:grid;grid-template-columns:1.2fr 1fr;gap:4px;padding:10px;border-radius:22px;background:rgba(var(--tv),.9);-webkit-backdrop-filter:blur(26px) saturate(1.5);backdrop-filter:blur(26px) saturate(1.5);
  box-shadow:inset 0 0 0 1px rgba(var(--rim),var(--rim-a)),var(--shadow);animation:pop2 .3s var(--ease)}
@keyframes pop2{from{opacity:0;transform:translateY(-8px) scale(.985)}to{opacity:1;transform:none}}
.outline .col{display:grid;gap:2px;align-content:start;padding:6px}
.outline .col+.col{border-left:1px solid var(--line)}
.o-h{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);padding:6px 10px 8px}
.outline a,.outline button{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:6px;padding:9px 10px;border-radius:12px;font-size:15px;text-align:left;width:100%;transition:background .2s}
.outline .col:last-child a{grid-template-columns:1fr auto}
.outline a:hover,.outline button:hover,.outline .is-cur{background:var(--chip)}
.outline .n{font-family:var(--mono);font-size:11px;color:var(--text-3)}
.outline .here{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--acc);opacity:0}
.outline .is-cur .here{opacity:1}
/* menu mobile : portail circulaire */
.sheet{position:fixed;z-index:2;inset:0;visibility:hidden;pointer-events:none;overflow-y:auto;overscroll-behavior:contain;padding:calc(92px + env(safe-area-inset-top,0px)) 22px calc(28px + env(safe-area-inset-bottom,0px));
  background:rgba(var(--tv),.9);-webkit-backdrop-filter:blur(28px) saturate(1.5);backdrop-filter:blur(28px) saturate(1.5);
  clip-path:circle(0px at var(--ox,90%) var(--oy,40px));transition:clip-path .6s var(--ease),visibility 0s .6s}
.hdr.is-sheet .sheet{visibility:visible;pointer-events:auto;clip-path:circle(160% at var(--ox,90%) var(--oy,40px));transition:clip-path .7s var(--ease)}
.hdr.is-sheet .bar{opacity:1!important;visibility:visible!important;transform:none!important}
.sheet-body{display:grid;max-width:540px;margin-inline:auto}
.sheet-h{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin:18px 4px 6px}
.sl{display:flex;align-items:center;gap:12px;padding:13px 4px;font-size:19px;font-weight:360;border-bottom:1px solid var(--line)}
.sl .t{flex:1}.sl svg{width:14px;height:14px;color:var(--text-3)}
.sl.is-cur{color:var(--acc)}
button.sl{width:100%;text-align:left}
.sl .n{font-family:var(--mono);font-size:11px;color:var(--text-3);width:26px;flex:none}
.sheet-body .btn{margin-top:14px}
.hdr.is-sheet .sheet-body>*{animation:rise .55s var(--ease) both;animation-delay:calc(var(--i,0)*24ms + 100ms)}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (max-width:1060px){
  .nav,.hide-m{display:none}
  .burger{display:flex}
  .bar-in{gap:10px}
  .acts{gap:6px}
  .cap-cta .l{display:none}
}
@media (min-width:1061px){.cap-cta .s{display:none}.sheet{display:none}}
@media (max-width:440px){.brand .lion{width:28px;height:28px}.brand .wm{height:22px}.brand .lg{gap:6px}.theme-switch{grid-template-columns:repeat(3,24px)}.theme-switch button,.theme-knob{width:24px;height:24px}.theme-switch[data-mode="auto"] .theme-knob{transform:translateX(24px)}.theme-switch[data-mode="light"] .theme-knob{transform:translateX(48px)}@keyframes goo2{40%{width:32px}100%{width:24px}}.acts{gap:5px}}
@media (max-width:370px){.brand .wm{display:none!important}}

/* ---------- pages ---------- */
.page{animation:pageIn .7s var(--ease) both}
@keyframes pageIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.main.is-leaving{opacity:0;transform:translateY(-8px);transition:opacity .22s,transform .22s}
.sec{padding-block:clamp(72px,9vw,128px);position:relative;overflow-x:clip}
.sec-head{display:grid;gap:16px;max-width:760px;margin-bottom:clamp(36px,5vw,60px)}
.rv.in{animation:rv .9s var(--ease) both;animation-delay:calc(var(--d,0)*70ms)}
@keyframes rv{from{opacity:.25;transform:translateY(18px)}to{opacity:1;transform:none}}

/* hero */
.hero{min-height:min(860px,calc(100svh - 76px));display:grid;align-items:center;padding-block:clamp(40px,7vw,90px);position:relative}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:center;width:100%}
.hero-txt{display:grid;gap:24px;justify-items:start}
.live{width:8px;height:8px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 0 rgba(var(--acc-rgb),.6);animation:ping 2.2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(var(--acc-rgb),.55)}80%,100%{box-shadow:0 0 0 12px rgba(var(--acc-rgb),0)}}
.merc{background:linear-gradient(100deg,var(--merc-1) 0%,var(--merc-2) 22%,var(--merc-3) 38%,var(--merc-2) 55%,rgb(var(--acc-rgb)) 72%,var(--merc-2) 88%,var(--merc-1) 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:merc 9s var(--ease) infinite alternate;text-shadow:none!important;padding-bottom:.06em}
@keyframes merc{from{background-position:0% 50%}to{background-position:100% 50%}}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}
.fine{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13.5px;color:var(--text-2)}
.fine li{display:inline-flex;align-items:center;gap:8px}
.fine li::before{content:"";width:6px;height:6px;border-radius:50%;background:rgba(var(--acc-rgb),.8)}
.hud{transition:opacity .9s var(--ease),transform .9s var(--ease);justify-self:end;align-self:end;display:grid;gap:10px;width:min(300px,100%);padding:16px 18px;border-radius:18px;margin-top:auto;
  background:rgba(var(--tv),.55);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgba(var(--rim),var(--rim-a))}
/* pendant l'entrée du lion, le panneau de simulation reste devant, intact (le lion passe derrière, légèrement translucide) */
.hud-h{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
.hud-row{display:grid;grid-template-columns:1fr auto;gap:4px 12px;font-size:14px;color:var(--text-2)}
.hud-row b{font-family:var(--mono);font-weight:500;color:var(--text);text-align:right}
.hud-leg{display:flex;gap:14px;font-size:12px;color:var(--text-3)}
.hud-leg span{display:inline-flex;align-items:center;gap:6px}
.dot{width:7px;height:7px;border-radius:50%;background:rgb(var(--legit))}
.dia{width:7px;height:7px;border-radius:50%;background:rgb(var(--threat))}
.hero-right{display:flex;flex-direction:column;align-self:stretch;min-height:420px}
.scroll-cue{position:absolute;left:50%;bottom:22px;width:22px;height:36px;margin-left:-11px;border:1px solid var(--line-2);border-radius:14px}
.scroll-cue::after{content:"";position:absolute;left:50%;top:8px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--text-2);animation:cue 1.8s infinite}
@keyframes cue{0%{opacity:0;transform:translateY(-3px)}40%{opacity:1}100%{opacity:0;transform:translateY(9px)}}

/* cycle Prévention → Amélioration continue (fil qui se remplit au défilement) */
.cycle{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px;--fill:0}
.cycle::before{content:"";position:absolute;left:18px;right:18px;top:17px;height:1px;background:var(--line-2)}
.cycle::after{content:"";position:absolute;left:18px;top:17px;height:1px;width:calc((100% - 36px)*var(--fill));background:linear-gradient(90deg,rgba(var(--acc-rgb),.2),var(--acc));box-shadow:0 0 12px rgba(var(--acc-rgb),.7)}
.step{position:relative;display:grid;gap:8px;justify-items:start}
.step i{position:relative;z-index:1;width:35px;height:35px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-family:var(--mono);font-size:12px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--text-2);transition:box-shadow .4s,color .4s,background .4s}
.step.on i{box-shadow:inset 0 0 0 1px var(--acc),0 0 18px -4px rgba(var(--acc-rgb),.9);color:var(--acc)}
.step b{font-weight:480}
.step span{font-size:13.5px;color:var(--text-2);max-width:26ch}

/* cartes */
.card{position:relative;border-radius:var(--r-lg);padding:28px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0)) ,var(--card);box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .35s,transform .35s var(--ease)}
.card-glow::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(360px 200px at var(--mx,50%) var(--my,0%),rgba(var(--acc-rgb),.12),transparent 70%);opacity:0;transition:opacity .4s}
.card-glow:hover::after{opacity:1}
.card-glow:hover{box-shadow:inset 0 0 0 1px var(--line-2)}
.ico{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:rgba(var(--acc-rgb),.13);color:var(--acc)}
.ico svg{width:22px;height:22px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag.tech{background:rgba(var(--acc-rgb),.14);color:var(--acc);text-transform:none;letter-spacing:.02em;font-size:11.5px}
.tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:5px 8px;border-radius:8px;background:var(--chip);color:var(--text-2)}
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bento .card{display:grid;gap:14px;align-content:start}
.bento .wide{grid-column:span 2;grid-template-columns:1fr 1fr;align-items:center;gap:24px}
.bento .card h3{font-size:22px}
.bento .card p{color:var(--text-2);font-size:15px}
.flow{position:relative;height:190px;border-radius:18px;background:rgba(var(--tv),.6);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.flow canvas{position:absolute;inset:0;width:100%;height:100%}
.flow-lb{position:absolute;bottom:10px;left:12px;right:12px;display:flex;justify-content:space-between;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}

/* quiz « Saurez-vous repérer le piège ? » */
.quiz{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mail{display:grid;gap:14px;align-content:start;border-radius:var(--r-lg);padding:22px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .4s}
.mail.ok{box-shadow:inset 0 0 0 1px rgba(125,181,156,.6)}
.mail.ko{box-shadow:inset 0 0 0 1px rgba(var(--threat),.7)}
.mail-top{display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:center}
.av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:600;background:var(--card-2);color:var(--text-2)}
.from{font-size:14px;line-height:1.3;min-width:0}
.from b{display:block;font-weight:500}
.from span{font-family:var(--mono);font-size:12px;color:var(--text-3);overflow-wrap:anywhere}
.subj{font-weight:480;font-size:15.5px}
.body{font-size:14px;color:var(--text-2);padding:12px 14px;border-radius:12px;background:rgba(var(--tv),.5);border:1px dashed var(--line-2)}
.body u{text-decoration-color:rgba(var(--acc-rgb),.7);text-underline-offset:3px}
.ans{display:flex;gap:8px}
.ans button{flex:1;height:40px;border-radius:40px;border:1px solid var(--line-2);font-size:14px;transition:background .2s,border-color .2s}
.ans button:hover{background:var(--chip)}
.ans button[disabled]{cursor:default;opacity:.5}
.ans button.pick{opacity:1;border-color:var(--acc);background:rgba(var(--acc-rgb),.12)}
.why{font-size:13.5px;color:var(--text-2);display:grid;gap:6px}
.why b{color:var(--text);font-weight:500}
.verdict{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.verdict::before{content:"";width:7px;height:7px;border-radius:50%}
.verdict.good{color:#8DC2A8}.verdict.good::before{background:#8DC2A8}
.verdict.bad{color:rgb(var(--threat))}.verdict.bad::before{background:rgb(var(--threat))}
:root[data-theme="light"] .verdict.good{color:#3C7A5E}:root[data-theme="light"] .verdict.good::before{background:#3C7A5E}
.quiz-end{margin-top:22px;display:flex;flex-wrap:wrap;align-items:center;gap:16px;justify-content:space-between;padding:18px 22px;border-radius:20px;background:rgba(var(--acc-rgb),.08);box-shadow:inset 0 0 0 1px rgba(var(--acc-rgb),.25)}
.quiz-end p{font-size:15px}

/* approche + chiffres */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}
.pillars{display:grid;gap:12px}
.pillar{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:20px;border-radius:20px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.pillar h3{font-size:18px;margin-bottom:4px}
.pillar p{font-size:14.5px;color:var(--text-2)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:clamp(40px,6vw,72px);border-radius:22px;overflow:hidden;background:var(--line);box-shadow:inset 0 0 0 1px var(--line)}
.stat{padding:26px 22px;background:var(--card);display:grid;gap:6px}
.stat b{font-size:clamp(34px,3.6vw,46px);font-weight:340;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
.stat b small{font-size:.45em;margin-left:4px;color:var(--text-2);font-weight:400;letter-spacing:0}
.stat span{font-size:13.5px;color:var(--text-2)}

/* forfaits */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.plan{display:flex;flex-direction:column;gap:16px;padding:28px;border-radius:var(--r-lg);background:var(--card);box-shadow:inset 0 0 0 1px var(--line);position:relative}
.plan.rec{background:linear-gradient(180deg,rgba(var(--acc-rgb),.12),rgba(var(--acc-rgb),.02) 60%),var(--card);box-shadow:inset 0 0 0 1px rgba(var(--acc-rgb),.45),0 30px 60px -40px rgba(var(--glow),.9)}
.plan-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 10px}
.plan .feat{flex:1}
.plan .badge{white-space:nowrap}
.plan h3{font-size:24px;font-weight:460}
.badge{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:5px 9px;border-radius:40px;background:var(--btn);color:var(--btn-ink)}
.badge.soft{background:rgba(var(--acc-rgb),.15);color:var(--acc)}
.plan .for{font-size:14px;color:var(--text-2)}
.price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.price b{font-size:clamp(34px,3vw,42px);font-weight:360;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1}
.price span{font-size:13.5px;color:var(--text-2)}
.total{font-family:var(--mono);font-size:12.5px;color:var(--text-2);padding:9px 12px;border-radius:10px;background:rgba(var(--tv),.5);box-shadow:inset 0 0 0 1px var(--line)}
.total b{color:var(--text);font-weight:500}
.feat{display:grid;gap:10px;align-content:start;font-size:14.5px}
.feat li{display:grid;grid-template-columns:16px 1fr;gap:10px;align-items:start}
.feat svg{width:16px;height:16px;margin-top:3px;color:var(--acc)}
.fineprint{margin-top:18px;font-size:13px;color:var(--text-3);max-width:80ch}
.calc{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:18px;align-items:end;padding:22px;border-radius:22px;margin-bottom:18px;background:rgba(var(--tv),.6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1px var(--line)}
.fld{display:grid;gap:8px}
.fld label,.lbl{font-size:13px;color:var(--text-2);display:flex;justify-content:space-between;gap:8px}
.fld output{font-family:var(--mono);color:var(--text)}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent}
input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--acc) var(--pct,10%),var(--line-2) var(--pct,10%))}
input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--acc) var(--pct,10%),var(--line-2) var(--pct,10%))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;margin-top:-8px;background:var(--text);box-shadow:0 0 0 5px rgba(var(--acc-rgb),.25)}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border:0;border-radius:50%;background:var(--text);box-shadow:0 0 0 5px rgba(var(--acc-rgb),.25)}
.seg{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:40px;border:1px solid var(--line-2);height:44px}
.seg button{position:relative;z-index:1;border-radius:40px;font-size:14px;color:var(--text-2);transition:color .3s}
.seg button[aria-checked="true"]{color:var(--text)}
.seg i{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:40px;background:var(--chip);box-shadow:inset 0 0 0 1px var(--line-2),inset 0 1px 0 rgba(255,255,255,.1);transition:transform .5s var(--spring)}
.seg[data-v="annuel"] i{transform:translateX(100%)}
select,.inp,textarea{width:100%;height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--line-2);background:rgba(var(--tv),.55);color:var(--text);transition:border-color .2s,box-shadow .2s}
textarea{height:auto;min-height:120px;padding:12px 14px;resize:vertical}
select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 20px) 19px,calc(100% - 15px) 19px;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
select option{background:var(--card);color:var(--text)}
.inp:focus,select:focus,textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 4px rgba(var(--acc-rgb),.15)}
.inp[aria-invalid="true"]{border-color:rgb(var(--threat))}

/* sécurité du site */
.sec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border-radius:22px;overflow:hidden;background:var(--line);box-shadow:inset 0 0 0 1px var(--line)}
.ctl{padding:24px;background:var(--card);display:grid;gap:10px;align-content:start}
.ctl code{font-family:var(--mono);font-size:11.5px;color:var(--acc);letter-spacing:.02em}
.ctl h3{font-size:17px;font-weight:480}
.ctl p{font-size:14px;color:var(--text-2)}

/* bandeau final */
.final{border-radius:32px;padding:clamp(32px,5vw,64px);display:grid;grid-template-columns:1.3fr 1fr;gap:28px;align-items:center;
  background:radial-gradient(80% 120% at 100% 0%,rgba(var(--acc-rgb),.22),transparent 60%),var(--card);box-shadow:inset 0 0 0 1px var(--line-2);overflow:hidden;position:relative}
.final ul{display:grid;gap:10px}
.final li{display:flex;gap:10px;align-items:center;font-size:16px}
.final li svg{width:18px;height:18px;color:var(--acc)}

/* sous-pages */
.phero{padding-block:clamp(56px,8vw,110px) clamp(30px,4vw,50px)}
.phero .veil{display:grid;gap:18px;max-width:780px}
.crumb{font-family:var(--mono);font-size:12px;color:var(--text-3);letter-spacing:.06em}
.crumb a:hover{color:var(--text)}
.svc-layout{display:grid;grid-template-columns:230px 1fr;gap:clamp(24px,5vw,64px);align-items:start}
.toc{position:sticky;top:96px;display:grid;gap:2px}
.toc a{display:grid;grid-template-columns:26px 1fr;gap:6px;padding:9px 12px;border-radius:12px;font-size:14.5px;color:var(--text-2);transition:background .2s,color .2s}
.toc a .n{font-family:var(--mono);font-size:11px;color:var(--text-3);padding-top:2px}
.toc a.on{background:var(--chip);color:var(--text)}
.svc{display:grid;gap:22px;padding-block:clamp(28px,4vw,48px);border-top:1px solid var(--line);scroll-margin-top:90px}
.svc:first-child{border-top:0;padding-top:0}
.svc-h{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}
.svc-h h2{font-size:clamp(26px,2.8vw,36px)}
.svc .lede{max-width:64ch}
.svc :is(h2,.lede),.phero :is(h1,.lede){text-shadow:0 0 1px rgba(var(--tv),.9),0 0 16px rgba(var(--tv),.85)}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.trio .card{padding:22px;display:grid;gap:10px;align-content:start}
.trio h3{font-size:17px;font-weight:480}
.trio p{font-size:14.5px;color:var(--text-2)}
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.member{display:grid;gap:14px;padding:24px;border-radius:var(--r-lg);background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.mono-av{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:21px;font-weight:500;letter-spacing:.02em;color:var(--acc);background:radial-gradient(circle at 30% 25%,rgba(var(--acc-rgb),.28),rgba(var(--acc-rgb),.06));box-shadow:inset 0 0 0 1px rgba(var(--acc-rgb),.35)}
.member h3{font-size:19px}
.member p{font-size:14px;color:var(--text-2)}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);margin-block:8px 0}
.marquee-t{display:flex;gap:14px;width:max-content;animation:mq 34s linear infinite}
.marquee span{font-size:clamp(22px,2.6vw,34px);font-weight:300;color:var(--text-2);white-space:nowrap;display:inline-flex;align-items:center;gap:14px}
.marquee span::after{content:"";width:7px;height:7px;border-radius:50%;background:rgba(var(--acc-rgb),.7)}
@keyframes mq{to{transform:translateX(-50%)}}
.jobs{display:grid;gap:10px}
.job{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:18px 22px;border-radius:18px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .3s}
.job:hover{box-shadow:inset 0 0 0 1px var(--line-2)}
.job b{font-weight:480;display:block}
.job span{font-size:14px;color:var(--text-2)}
.cities{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.city{padding:24px;border-radius:var(--r-lg);background:var(--card);box-shadow:inset 0 0 0 1px var(--line);display:grid;gap:8px}
.city.cur{box-shadow:inset 0 0 0 1px rgba(var(--acc-rgb),.5)}
.city .mono{font-size:12px;color:var(--text-3);letter-spacing:.08em}
.contact{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(24px,5vw,64px);align-items:start}
.coord{display:grid;gap:12px}
.coord .card{padding:20px;display:grid;gap:6px}
.coord .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3)}
.coord .v{font-size:17px}
.reveal-btn{justify-self:start;font-size:14px;color:var(--acc);display:inline-flex;gap:6px;align-items:center}
.form{display:grid;gap:16px;padding:clamp(22px,3vw,32px);border-radius:var(--r-lg);background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form label{font-size:13px;color:var(--text-2);display:grid;gap:7px}
.chk{display:grid!important;grid-template-columns:18px 1fr;gap:10px!important;align-items:start;font-size:13.5px!important}
.chk input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--btn)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ts{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--text-3);padding:10px 12px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line)}
.ts i{width:16px;height:16px;border-radius:50%;border:2px solid var(--acc);border-right-color:transparent;animation:spin 1.2s linear infinite}
.ts.ok i{animation:none;border-color:#8DC2A8;background:radial-gradient(circle,#8DC2A8 38%,transparent 42%)}
@keyframes spin{to{transform:rotate(360deg)}}
.msg{padding:14px 16px;border-radius:14px;font-size:14px;background:rgba(var(--acc-rgb),.1);box-shadow:inset 0 0 0 1px rgba(var(--acc-rgb),.35)}
.err{font-size:12.5px;color:rgb(var(--threat))}
.faq{display:grid;gap:10px;max-width:880px}
.qa{border-radius:18px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);transition:box-shadow .3s}
.qa[open]{box-shadow:inset 0 0 0 1px var(--line-2)}
.qa summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:34px 1fr 20px;gap:10px;align-items:center;padding:18px 20px;font-size:16.5px;font-weight:460}
.qa summary::-webkit-details-marker{display:none}
.qa summary .n{font-family:var(--mono);font-size:12px;color:var(--text-3)}
.qa summary svg{width:16px;height:16px;color:var(--text-2);transition:transform .35s var(--ease)}
.qa[open] summary svg{transform:rotate(45deg)}
.qa .a{padding:0 20px 20px 64px;color:var(--text-2);font-size:15px;display:grid;gap:10px}
.qa .a li{list-style:disc;margin-left:18px}
.qa .a ol li{list-style:decimal}
.qa .a b{color:var(--text);font-weight:500}
.search{max-width:880px;margin-bottom:16px;position:relative}
.search svg{position:absolute;left:14px;top:14px;width:16px;height:16px;color:var(--text-3)}
.search .inp{padding-left:40px;height:46px}

/* pied de page */
.site-footer{margin-top:40px;padding-block:64px 36px;border-top:1px solid var(--line);background:var(--foot);transition:background .6s}
:root[data-theme="light"] .site-footer{--text:#F4ECE7;--text-2:rgba(244,236,231,.72);--text-3:rgba(244,236,231,.5);--line:rgba(255,255,255,.12);--acc:#E6C3B3;color:var(--text)}
:root[data-theme="light"][data-market="fr"] .site-footer{--text:#EAF1F4;--text-2:rgba(234,241,244,.72);--text-3:rgba(234,241,244,.5);--acc:#A9CFDF}
@media (prefers-color-scheme:light){
  :root:not([data-theme="dark"]) .site-footer{--text:#F4ECE7;--text-2:rgba(244,236,231,.72);--text-3:rgba(244,236,231,.5);--line:rgba(255,255,255,.12);--acc:#E6C3B3;color:var(--text)}
  :root:not([data-theme="dark"])[data-market="fr"] .site-footer{--text:#EAF1F4;--text-2:rgba(234,241,244,.72);--text-3:rgba(234,241,244,.5);--acc:#A9CFDF}
}
.f-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px}
.f-brand{display:grid;gap:14px;align-content:start}
.f-brand p{font-size:14px;color:var(--text-2);max-width:34ch}
.f-col{display:grid;gap:9px;align-content:start;font-size:14px}
.f-col .f-h{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);font-weight:400;margin-bottom:4px}
.f-col a{color:var(--text-2);transition:color .2s}
.f-col a:hover{color:var(--text)}
.f-bot{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;font-size:12.5px;color:var(--text-3)}
.f-bot .mono{letter-spacing:.04em}
.shieldline{display:inline-flex;align-items:center;gap:8px}
.shieldline::before{content:"";width:7px;height:7px;border-radius:50%;background:#8DC2A8}

/* modale souscription */
.modal{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fade .25s}
@keyframes fade{from{opacity:0}}
.modal-box{width:min(520px,100%);max-height:calc(100vh - 32px);overflow:auto;border-radius:24px;padding:28px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2),var(--shadow);display:grid;gap:16px;animation:pop2 .35s var(--ease)}
.modal-h{display:flex;justify-content:space-between;align-items:start;gap:10px}
.x{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-2);flex:none}
.x svg{width:14px;height:14px}
.recap{font-family:var(--mono);font-size:12.5px;color:var(--text-2);padding:12px 14px;border-radius:12px;background:rgba(var(--tv),.5)}

/* bouton « remonter » */
.to-top{position:fixed;z-index:40;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--tv),.75);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px var(--line-2);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s,transform .3s,visibility 0s .3s}
.to-top.on{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .3s}
.to-top svg{width:16px;height:16px}

/* responsive */
@media (max-width:1060px){
  .hero-grid{grid-template-columns:1fr}
  .hero-right{min-height:0}
  .hud{justify-self:start;margin-top:0}
  .bento{grid-template-columns:1fr 1fr}
  .bento .wide{grid-column:span 2}
  .quiz{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr}
  .sec-grid{grid-template-columns:1fr 1fr}
  .svc-layout{grid-template-columns:1fr}
  .toc{display:none}
  .calc{grid-template-columns:1fr 1fr}
  .calc .fld:first-child{grid-column:span 2}
  .f-grid{grid-template-columns:1fr 1fr 1fr}
  .f-brand{grid-column:1/-1}
}
@media (max-width:760px){
  .hero{min-height:0;padding-top:24px}
  .hero-grid{gap:28px}
  .hud{width:100%}
  .cycle{grid-template-columns:1fr 1fr;row-gap:22px}
  .cycle::before,.cycle::after{display:none}
  .bento,.quiz,.plans,.trio,.team,.split,.final,.contact,.cities,.row2{grid-template-columns:1fr}
  .bento .wide{grid-column:auto;grid-template-columns:1fr}
  .sec-grid{grid-template-columns:1fr}
  .calc{grid-template-columns:1fr}
  .calc .fld:first-child{grid-column:auto}
  .f-grid{grid-template-columns:1fr 1fr}
  .qa .a{padding-left:20px}
  .scroll-cue{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .marquee-t{animation:none}
}

/* ==========================================================================
   Production : utilitaires (remplacent les attributs style de la démo)
   ========================================================================== */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:fixed;z-index:100;left:16px;top:-64px;padding:10px 16px;border-radius:12px;background:var(--btn);color:var(--btn-ink);transition:top .2s}
.skip:focus{top:16px}
.main:focus{outline:none}
.d1{--d:1}.d2{--d:2}.d3{--d:3}.d4{--d:4}
.stack-12,.stack-14,.stack-16,.stack-18{display:grid}
.stack-12{gap:12px}.stack-14{gap:14px}.stack-16{gap:16px}.stack-18{gap:18px}
.start{justify-items:start}.self-start{justify-self:start}
.mt-6{margin-top:6px}.mt-14{margin-top:14px}.mt-26{margin-top:26px}.mt-40{margin-top:40px}.mb-10{margin-bottom:10px}
.pt-0{padding-top:0!important}.pt-10{padding-top:10px!important}.pt-20{padding-top:20px!important}
.badges{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.h1-sm{font-size:clamp(34px,4.6vw,58px)}
.cta-row.center{justify-content:center}
.fineprint.center{text-align:center;margin-inline:auto}
.f-col .f-h{font-size:11px}

/* simulateur et souscription */
.calc .fld label{align-items:center}
.num-in{width:92px;height:34px;padding:0 10px;text-align:right;font-family:var(--mono);font-size:14px}
.palier{font-size:12.5px;color:var(--acc);min-height:18px}
.plan .annual{font-size:12.5px;color:var(--text-3);margin-top:-8px}
.plan.is-custom .price b{font-size:clamp(26px,2.4vw,32px)}
.fl{display:grid;gap:7px;font-size:13px;color:var(--text-2)}
.ts-box:empty{display:none}
.coord-mini{display:flex;gap:16px;flex-wrap:wrap}
.coord-mini .link svg{width:15px;height:15px}
.coord a.v{color:var(--text)}
.modal .chk .link{display:inline}

/* jeu « Testez vos réflexes » */
.quiz-ctx{margin:-18px 0 18px;font-size:14.5px;color:var(--text-2)}
.quiz-ctx b{color:var(--text);font-weight:500}
.quiz-ctx code{font-family:var(--mono);font-size:.92em;color:var(--acc)}
.quiz-wait{grid-column:1/-1}
.mail .theme{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}
.pj{display:inline-flex;align-items:center;gap:6px;justify-self:start;max-width:100%;font-family:var(--mono);font-size:12px;color:var(--text-2);padding:6px 10px;border-radius:9px;background:var(--chip);overflow-wrap:anywhere}
.pj svg{width:13px;height:13px;flex:none}
.quiz-end .cta-row svg{width:15px;height:15px}

/* pages de message (paiement, retours, 404) */
.msg-page{min-height:calc(100svh - 220px);display:grid;align-items:center}
.msg-card{max-width:660px;margin-inline:auto;display:grid;gap:18px;justify-items:center;text-align:center;padding:clamp(28px,5vw,52px);border-radius:32px;
  background:radial-gradient(80% 120% at 50% 0%,rgba(var(--acc-rgb),.18),transparent 60%),var(--card);box-shadow:inset 0 0 0 1px var(--line-2)}
.msg-card .lede{margin-inline:auto}
.pastille{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--btn);box-shadow:0 12px 30px -12px rgba(var(--glow),.9);animation:popin .5s var(--spring) .1s both}
.pastille.ok{background:#3C8A66}.pastille.err{background:rgb(var(--threat))}
.pastille svg{width:26px;height:26px}
@keyframes popin{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}
.note-box{text-align:left;padding:16px 18px;border-radius:14px;background:rgba(var(--tv),.5);box-shadow:inset 0 0 0 1px var(--line);display:grid;gap:4px;font-size:14.5px;color:var(--text-2)}
.note-box b{color:var(--text);font-weight:500}

/* racine du domaine : choix du pays */
/* ---- Page de choix du pays : liste par région + carte en points (carte-pays.js) ---- */
.p-choice .main{min-height:100svh;display:grid}
.ch{position:relative;min-height:100svh;display:grid;align-items:center;overflow:hidden;isolation:isolate;padding-block:clamp(28px,5vw,56px)}
.ch-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,64px);align-items:center;pointer-events:none}
.ch-txt{max-width:560px;pointer-events:auto}
.choice-logo{display:inline-flex;align-items:center;gap:12px;margin-bottom:clamp(24px,5vh,48px)}
.choice-logo img{width:56px;height:56px}.choice-logo .wm{width:auto;height:33px}.choice-logo .wm-l{display:none}
:root[data-theme="light"] .choice-logo .wm-d{display:none}:root[data-theme="light"] .choice-logo .wm-l{display:block}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .choice-logo .wm-d{display:none}:root:not([data-theme="dark"]) .choice-logo .wm-l{display:block}}
.ch .eyebrow{display:flex;margin:0 0 14px}
.ch-h1{font-size:clamp(36px,4.4vw,58px);margin:0 0 16px}.ch-h1 .merc{white-space:nowrap}
.ch .lede{margin:0 0 clamp(22px,4vh,34px);max-width:470px}
.ch-group{margin:0 0 18px}
.ch-group-h{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:0 0 8px}
.ch-group-h::after{content:"";flex:1;height:1px;background:var(--line)}
.ch-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ch-ctry{--c:var(--cd,var(--ch-soon));position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:14px 16px 14px 14px;border-radius:16px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);text-decoration:none;color:inherit;transition:box-shadow .3s,transform .45s var(--spring)}
:root[data-theme="light"] .ch-ctry{--c:var(--cl,var(--ch-soon))}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .ch-ctry{--c:var(--cl,var(--ch-soon))}}
a.ch-ctry:hover,a.ch-ctry:focus-visible,.ch-ctry.is-hot{transform:translateX(4px);box-shadow:inset 0 0 0 1px rgba(var(--c),.55),0 18px 40px -26px rgba(var(--c),.8)}
a.ch-ctry:focus-visible{outline:none;box-shadow:inset 0 0 0 2px rgba(var(--c),.9)}
.ch-mark{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--c),.14);box-shadow:inset 0 0 0 1px rgba(var(--c),.45)}
.ch-mark i{width:9px;height:9px;border-radius:50%;background:rgb(var(--c));box-shadow:0 0 12px rgba(var(--c),.9)}
.is-soon .ch-mark{background:transparent}.is-soon .ch-mark i{background:transparent;box-shadow:inset 0 0 0 1.5px rgba(var(--c),.8)}
.ch-name b{display:block;font-size:17px;font-weight:480;letter-spacing:-.01em}
.ch-name span{display:block;font-size:13px;color:var(--text-2);margin-top:2px}
.ch-go{font-size:13.5px;color:rgb(var(--c));display:flex;align-items:center;gap:6px;white-space:nowrap}
.ch-go svg{width:14px;height:14px;transition:transform .35s var(--spring)}
a.ch-ctry:hover .ch-go svg,a.ch-ctry:focus-visible .ch-go svg{transform:translateX(3px)}
.ch-pill{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:30px;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--text-3)}
.ch-sugg{position:absolute;top:-9px;left:58px;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;border-radius:30px;background:rgb(var(--c));color:#1A1411;opacity:0;transform:translateY(4px);transition:opacity .35s var(--ease),transform .35s var(--ease);pointer-events:none;white-space:nowrap}
:root[data-theme="light"] .ch-sugg{color:#fff}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .ch-sugg{color:#fff}}
.ch-ctry.is-sugg{box-shadow:inset 0 0 0 1px rgba(var(--c),.5)}
.ch-ctry.is-sugg .ch-sugg{opacity:1;transform:none}
/* carte en fond plein écran : la terre va jusqu'aux bords et s'efface derrière le texte (--mx* posés par carte-pays.js) */
.ch-map{position:absolute;inset:0;z-index:0;--ch-land-a:.24}
:root{--ch-soon:168,152,142}
:root[data-theme="light"]{--ch-soon:138,124,116}:root[data-theme="light"] .ch-map{--ch-land-a:.22}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){--ch-soon:138,124,116}:root:not([data-theme="dark"]) .ch-map{--ch-land-a:.22}}
.ch-map:not(.is-ready){visibility:hidden}
.ch-map canvas,.ch-map svg{position:absolute;inset:0;width:100%;height:100%}
.ch-map .ch-live,.ch-map svg{right:auto;bottom:auto;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.ch-map.is-bleed canvas{-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.42) 0,rgba(0,0,0,.42) calc(var(--mx0,30%) - 80px),rgba(0,0,0,.1) var(--mx0,30%),rgba(0,0,0,.1) var(--mx1,40%),#000 var(--mx2,55%));mask-image:linear-gradient(90deg,rgba(0,0,0,.42) 0,rgba(0,0,0,.42) calc(var(--mx0,30%) - 80px),rgba(0,0,0,.1) var(--mx0,30%),rgba(0,0,0,.1) var(--mx1,40%),#000 var(--mx2,55%))}
.ch-map.is-inset canvas{-webkit-mask-image:radial-gradient(farthest-side,#000 58%,transparent);mask-image:radial-gradient(farthest-side,#000 58%,transparent)}
.ch-map svg{overflow:visible;pointer-events:none}
.ch-pin{transition:opacity .3s}.ch-pin circle{transition:r .35s var(--spring)}
.ch-lbl{font-family:var(--f);font-size:13px;fill:var(--text);paint-order:stroke;stroke:var(--bg);stroke-width:5px;stroke-linejoin:round}
.ch-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;fill:var(--text-3);paint-order:stroke;stroke:var(--bg);stroke-width:4px;stroke-linejoin:round}
.ch-arc{fill:none;stroke-width:1.4;stroke-linecap:round;transition:opacity .3s}
.ch-arc.is-live{stroke-dasharray:3 7;animation:ch-flow 2.4s linear infinite}
.ch-arc.is-soon{stroke-dasharray:2 6;opacity:.55}
@keyframes ch-flow{to{stroke-dashoffset:-20}}
.ch-pulse{fill:none;stroke-width:1.5;transform-box:fill-box;transform-origin:center;animation:ch-pulse 2.6s var(--ease) infinite}
@keyframes ch-pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.8);opacity:0}}
.ch-legend{position:absolute;right:max(var(--gutter),3vw);bottom:clamp(18px,4vh,40px);display:flex;gap:16px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}
.ch-legend span{display:flex;align-items:center;gap:7px}
.ch-legend i{width:9px;height:9px;border-radius:50%;background:var(--acc);box-shadow:0 0 10px var(--acc)}
.ch-legend i.o{background:transparent;box-shadow:inset 0 0 0 1.5px rgba(var(--ch-soon),.9)}
@media (max-width:900px){.ch{display:block}.ch-in{grid-template-columns:1fr}.ch-txt{max-width:none}.ch-map{position:relative;inset:auto;display:none;width:min(100%,460px);aspect-ratio:5/6;margin:8px auto 0}.ch-map.is-on{display:block}.ch-legend{right:8%;bottom:3%}}
@media (prefers-reduced-motion:reduce){.ch-arc.is-live,.ch-pulse{animation:none}}

/* textes longs : pages légales, fiches de poste */
.prose{max-width:760px;display:grid;gap:14px;color:var(--text-2);font-size:16px}
.prose h2{font-size:clamp(21px,2vw,26px);color:var(--text);margin-top:18px;scroll-margin-top:96px}
.prose h3{font-size:17px;color:var(--text);font-weight:480;margin-top:6px}
.prose ul,.prose ol{display:grid;gap:6px;padding-left:20px}
.prose ul li{list-style:disc}.prose ol li{list-style:decimal}
.prose b{color:var(--text);font-weight:500}
.prose code{font-family:var(--mono);font-size:.9em;color:var(--acc)}
.prose .final{color:var(--text)}
.legal-layout{display:grid;grid-template-columns:250px 1fr;gap:clamp(24px,5vw,64px);align-items:start}
.legal-layout .toc a{grid-template-columns:22px 1fr;font-size:13.5px}
.meta-list{display:flex;flex-wrap:wrap;gap:10px 26px;font-size:14px;color:var(--text-2)}
.meta-list li{display:grid;gap:2px}
.meta-list span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}
.meta-list b{font-weight:460;color:var(--text)}
@media (max-width:1060px){.legal-layout{grid-template-columns:1fr}}
@media (max-width:560px){.quiz-ctx{margin-top:-10px}}