/* ============ Polices hébergées localement (RGPD) ============ */
@font-face{ font-family:"Manrope"; font-style:normal; font-weight:200 800; font-display:swap; src:url("/assets/fonts/manrope.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Mono"; font-style:normal; font-weight:400; font-display:swap; src:url("/assets/fonts/plex-mono-400.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Mono"; font-style:normal; font-weight:500; font-display:swap; src:url("/assets/fonts/plex-mono-500.woff2") format("woff2"); }
@font-face{ font-family:"IBM Plex Mono"; font-style:normal; font-weight:600; font-display:swap; src:url("/assets/fonts/plex-mono-600.woff2") format("woff2"); }

/* ============ Design tokens ============ */
:root{
  --bg:#0b1626; --bg-2:#08111e;
  --surface:#11213a; --surface-2:#152843; --surface-3:#1a3050;
  --border:rgba(255,255,255,.07); --border-strong:rgba(255,255,255,.13);
  --text:#eef2f7; --text-2:#a9b8cc; --text-3:#7688a1;
  --accent:#ffd24a; --accent-ink:#1b1a14; --accent-soft:rgba(255,210,74,.14); --accent-text:#ffd24a;
  --pos:#3fd18f; --pos-soft:rgba(63,209,143,.12);
  --neg:#ff6f61; --neg-soft:rgba(255,111,97,.12);
  --paper:#f7f5ee; --paper-ink:#1d1d20; --paper-muted:#807d73; --paper-line:#d9d5c8;
  --paper-red:#c7322c; --paper-green:#177a52;
  --shadow-1:0 1px 0 rgba(255,255,255,.04) inset, 0 1px 2px rgba(0,0,0,.25);
  --shadow-2:0 1px 0 rgba(255,255,255,.05) inset, 0 12px 32px -12px rgba(0,0,0,.55);
  --shadow-paper:0 24px 48px -20px rgba(0,0,0,.6), 0 2px 6px rgba(0,0,0,.2);
  --r-sm:10px; --r-md:14px; --r-lg:20px; --r-pill:999px;
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:72px;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#f3f5f9; --bg-2:#e9edf3; --surface:#ffffff; --surface-2:#f6f8fb; --surface-3:#eef2f7;
    --border:rgba(16,35,63,.09); --border-strong:rgba(16,35,63,.16);
    --text:#0f1f35; --text-2:#475a73; --text-3:#6b7c93;
    --accent:#f2bf1d; --accent-soft:rgba(242,191,29,.18); --accent-text:#9a6f00;
    --pos:#12824f; --pos-soft:rgba(18,130,79,.1); --neg:#c9352d; --neg-soft:rgba(201,53,45,.09);
    --shadow-1:0 1px 2px rgba(16,35,63,.06); --shadow-2:0 12px 32px -14px rgba(16,35,63,.22);
    --shadow-paper:0 24px 48px -24px rgba(16,35,63,.35), 0 2px 6px rgba(16,35,63,.08);
  }
}
:root[data-theme="light"]{
  --bg:#f3f5f9; --bg-2:#e9edf3; --surface:#ffffff; --surface-2:#f6f8fb; --surface-3:#eef2f7;
  --border:rgba(16,35,63,.09); --border-strong:rgba(16,35,63,.16);
  --text:#0f1f35; --text-2:#475a73; --text-3:#6b7c93;
  --accent:#f2bf1d; --accent-soft:rgba(242,191,29,.18); --accent-text:#9a6f00;
  --pos:#12824f; --pos-soft:rgba(18,130,79,.1); --neg:#c9352d; --neg-soft:rgba(201,53,45,.09);
  --shadow-1:0 1px 2px rgba(16,35,63,.06); --shadow-2:0 12px 32px -14px rgba(16,35,63,.22);
  --shadow-paper:0 24px 48px -24px rgba(16,35,63,.35), 0 2px 6px rgba(16,35,63,.08);
}
:root[data-theme="dark"]{
  --bg:#0b1626; --bg-2:#08111e; --surface:#11213a; --surface-2:#152843; --surface-3:#1a3050;
  --border:rgba(255,255,255,.07); --border-strong:rgba(255,255,255,.13);
  --text:#eef2f7; --text-2:#a9b8cc; --text-3:#7688a1;
  --accent:#ffd24a; --accent-soft:rgba(255,210,74,.14); --accent-text:#ffd24a;
  --pos:#3fd18f; --pos-soft:rgba(63,209,143,.12); --neg:#ff6f61; --neg-soft:rgba(255,111,97,.12);
  --shadow-1:0 1px 0 rgba(255,255,255,.04) inset, 0 1px 2px rgba(0,0,0,.25);
  --shadow-2:0 1px 0 rgba(255,255,255,.05) inset, 0 12px 32px -12px rgba(0,0,0,.55);
  --shadow-paper:0 24px 48px -20px rgba(0,0,0,.6), 0 2px 6px rgba(0,0,0,.2);
}

/* ============ Base ============ */
:root{ box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px); }
html{ scroll-padding-top:calc(80px + env(safe-area-inset-top,0px)); scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *,*::before,*::after{ transition:none!important; animation:none!important; } }
*,*::before,*::after{ box-sizing:inherit; }
body{ margin:0; font-family:var(--sans); font-size:16px; color:var(--text); background:var(--bg);
  line-height:1.55; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; font-feature-settings:"cv11","ss01"; overflow-x:hidden; }
img,svg{ max-width:100%; }
a{ color:inherit; }
.num{ font-variant-numeric:tabular-nums; }
.container{ width:100%; max-width:1160px; margin:0 auto; padding:0 20px; }
@media (min-width:768px){ .container{ padding:0 32px; } }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.icon{ width:18px; height:18px; flex:none; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

/* ============ Header ============ */
.site-header{ position:sticky; top:0; z-index:30; padding-top:env(safe-area-inset-top,0px);
  background:color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter:saturate(140%) blur(12px); -webkit-backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--border); }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.brand-mark{ width:32px; height:32px; border-radius:9px; background:var(--surface-2); border:1px solid var(--border-strong); display:grid; place-items:center; }
.brand-name{ font-weight:800; letter-spacing:-.01em; font-size:16px; }
.brand-tag{ color:var(--text-3); font-size:13px; font-weight:500; padding-left:12px; margin-left:2px; border-left:1px solid var(--border-strong); }
@media (max-width:640px){ .brand-tag{ display:none; } }
.nav-link{ font-size:14px; font-weight:600; color:var(--text-2); text-decoration:none; padding:8px 12px; border-radius:var(--r-pill); transition:color .2s var(--ease), background .2s var(--ease); }
.nav-link:hover{ color:var(--text); background:var(--surface-2); }

/* ============ Hero ============ */
.hero{ padding:var(--s-7) 0 var(--s-6); }
@media (min-width:900px){ .hero{ padding:88px 0 56px; } }
.eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-text); margin-bottom:var(--s-4); }
.eyebrow::before{ content:""; width:18px; height:2px; background:var(--accent); border-radius:2px; }
h1{ font-size:clamp(32px,5.4vw,58px); line-height:1.06; letter-spacing:-.03em; font-weight:800; margin:0 0 var(--s-5); max-width:22ch; text-wrap:balance; }
h1 .hl{ color:var(--accent-text); }
@media (min-width:720px){ h1 .h1-2{ display:block; } }
.hero p.lede{ font-size:clamp(17px,1.8vw,20px); color:var(--text-2); max-width:58ch; margin:0 0 var(--s-5); }
.hero p.lede strong{ color:var(--text); font-weight:700; }
.trust{ display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-5); padding:0; margin:0 0 var(--s-6); list-style:none; }
.trust li{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--text-2); }
.trust .icon{ width:16px; height:16px; color:var(--pos); stroke-width:2.4; }
.hero-cta{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-4); }
.hero-cta .note{ font-size:14px; color:var(--text-3); }
@media (max-width:559px){ .hero-cta .btn{ width:100%; } }

/* ============ Buttons ============ */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 24px; border-radius:var(--r-pill);
  font:700 16px/1 var(--sans); letter-spacing:-.005em; text-decoration:none; cursor:pointer; border:1px solid transparent;
  transition:transform .15s var(--ease), background-color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease), color .2s var(--ease); -webkit-tap-highlight-color:transparent; }
.btn:active{ transform:translateY(1px) scale(.99); }
.btn:focus-visible{ outline:none; box-shadow:0 0 0 3px var(--bg), 0 0 0 5px var(--accent); }
.btn-primary{ background:var(--accent); color:var(--accent-ink); box-shadow:0 8px 24px -10px rgba(255,210,74,.55); }
.btn-primary:hover{ background:#ffdb6b; box-shadow:0 10px 28px -10px rgba(255,210,74,.7); }
.btn-ghost{ background:transparent; color:var(--text); border-color:var(--border-strong); }
.btn-ghost:hover{ background:var(--surface-2); }
.btn-quiet{ background:transparent; color:var(--text-2); min-height:44px; padding:0 14px; }
.btn-quiet:hover{ color:var(--text); background:var(--surface-2); }
.btn-block{ width:100%; }
.btn .icon{ width:18px; height:18px; }

/* ============ App layout ============ */
.app{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-5); padding-bottom:var(--s-7); }
@media (min-width:1024px){ .app{ grid-template-columns:minmax(0,1fr) 400px; gap:var(--s-6); align-items:start; } }
@media (min-width:1200px){ .app{ grid-template-columns:minmax(0,1fr) 430px; } }

.panel{ background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); box-shadow:var(--shadow-2); }

/* ============ Form ============ */
.form{ padding:var(--s-2) 0; }
.step{ padding:var(--s-5) var(--s-5) var(--s-6); border-bottom:1px solid var(--border); }
@media (min-width:768px){ .step{ padding:var(--s-6) var(--s-6) 36px; } }
.step:last-of-type{ border-bottom:0; }
.step-head{ display:flex; gap:var(--s-4); align-items:flex-start; margin-bottom:var(--s-5); }
.step-badge{ flex:none; width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:var(--surface-3); border:1px solid var(--border-strong); color:var(--accent-text); }
.step-badge .icon{ width:20px; height:20px; }
.step-num{ font:600 12px var(--mono); color:var(--text-3); letter-spacing:.08em; }
.step-title{ font-size:19px; font-weight:800; letter-spacing:-.015em; margin:2px 0 2px; }
.step-desc{ font-size:14px; color:var(--text-2); margin:0; }
.fields{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-5) var(--s-4); }
@media (min-width:560px){ .fields{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.f label{ display:block; font-size:14px; font-weight:700; color:var(--text); margin-bottom:8px; letter-spacing:-.005em; }
.control{ display:flex; align-items:stretch; height:52px; background:var(--surface-2); border:1px solid var(--border-strong); border-radius:var(--r-md);
  transition:border-color .18s var(--ease), box-shadow .18s var(--ease), background-color .18s var(--ease); overflow:hidden; }
.control:hover{ border-color:color-mix(in srgb, var(--text) 22%, transparent); }
.control:focus-within{ border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-soft); background:var(--surface); }
.control input{ flex:1; min-width:0; border:0; background:transparent; color:var(--text); padding:0 14px; outline:none;
  font:500 17px var(--mono); font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
.control input::placeholder{ color:var(--text-3); }
.unit{ flex:none; display:flex; align-items:center; justify-content:center; width:92px; padding:0 12px; border-left:1px solid var(--border);
  font:600 13px var(--sans); color:var(--text-3); background:color-mix(in srgb, var(--surface-3) 45%, transparent); user-select:none; }
.help{ font-size:13px; color:var(--text-3); margin-top:7px; line-height:1.4; }
.f.invalid .control{ border-color:var(--neg); box-shadow:0 0 0 4px var(--neg-soft); }
.f .err{ display:none; font-size:13px; color:var(--neg); margin-top:7px; font-weight:600; }
.f.invalid .err{ display:block; }
.f.invalid .help{ display:none; }
.form-foot{ padding:var(--s-5); display:flex; flex-direction:column; gap:var(--s-4); border-top:1px solid var(--border); background:color-mix(in srgb, var(--surface-2) 55%, transparent); border-radius:0 0 var(--r-lg) var(--r-lg); }
@media (min-width:768px){ .form-foot{ padding:var(--s-5) var(--s-6) var(--s-6); } }
.form-foot .meta{ font-size:13px; color:var(--text-3); }
.form-foot .btns{ display:flex; gap:var(--s-3); align-items:center; }
.form-foot .btns #go{ flex:1; }
@media (max-width:559px){ .form-foot .btns{ flex-direction:column-reverse; align-items:stretch; } .form-foot .btns .btn{ width:100%; } }

/* ============ Summary (results) ============ */
.summary{ display:flex; flex-direction:column; gap:var(--s-4); }
@media (min-width:1024px){ .summary{ position:sticky; top:calc(84px + env(safe-area-inset-top,0px)); } }
.result-hero{ padding:var(--s-5); position:relative; overflow:hidden; transition:box-shadow .5s var(--ease); }
@media (min-width:768px){ .result-hero{ padding:28px; } }
.result-hero.pulse{ box-shadow:0 0 0 2px var(--accent), var(--shadow-2); }
.rh-top{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:var(--s-2) var(--s-3); margin-bottom:var(--s-3); }
.rh-top .overline{ white-space:nowrap; }
.overline{ font-size:12px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--text-3); }
.chip{ display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 12px; border-radius:var(--r-pill); font-size:13px; font-weight:700; white-space:nowrap; }
.chip::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.chip.pos{ color:var(--pos); background:var(--pos-soft); }
.chip.neg{ color:var(--neg); background:var(--neg-soft); }
.big{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin:2px 0 var(--s-2); }
.big-val{ font:600 clamp(46px,9vw,60px)/1 var(--mono); letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.big-val.pos{ color:var(--pos); } .big-val.neg{ color:var(--neg); }
.big-unit{ font-size:18px; font-weight:700; color:var(--text-2); }
.rh-sub{ font-size:15px; color:var(--text-2); margin:0; }
.rh-sub strong{ color:var(--text); font-weight:700; }
.meter{ margin-top:var(--s-5); }
.meter-bar{ height:8px; border-radius:var(--r-pill); background:var(--surface-3); overflow:hidden; }
.meter-fill{ height:100%; border-radius:inherit; background:var(--accent); width:0; transition:width .6s var(--ease); }
.meter-legend{ display:flex; justify-content:space-between; font-size:13px; color:var(--text-3); margin-top:8px; gap:var(--s-3); }
.meter-legend b{ color:var(--text-2); font-weight:700; }
#coverabs{ white-space:nowrap; font-variant-numeric:tabular-nums; }

.yields{ display:grid; grid-template-columns:1fr 1fr; }
.yield{ padding:var(--s-5); }
.yield + .yield{ border-left:1px solid var(--border); }
.yield .overline{ display:block; margin-bottom:6px; }
.yield .v{ font:600 28px/1.1 var(--mono); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.yield .d{ font-size:13px; color:var(--text-3); margin-top:4px; }

.metrics{ display:grid; grid-template-columns:1fr 1fr; }
.metric{ padding:var(--s-4) var(--s-5); border-top:1px solid var(--border); }
.metric:nth-child(odd){ border-right:1px solid var(--border); }
.metric:nth-child(-n+2){ border-top:0; }
.metric .k{ font-size:13px; color:var(--text-3); font-weight:600; }
.metric .v{ font:600 17px/1.3 var(--mono); font-variant-numeric:tabular-nums; margin-top:3px; letter-spacing:-.01em; }
.insight{ display:flex; gap:var(--s-3); align-items:flex-start; padding:var(--s-4) var(--s-5); border-top:1px solid var(--border); font-size:14px; color:var(--text-2); }
.insight .icon{ color:var(--accent-text); margin-top:2px; }
.insight strong{ color:var(--text); }
.see-calc{ display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px; font-weight:700; color:var(--text-2); text-decoration:none; padding:var(--s-3); border-radius:var(--r-md); transition:color .2s var(--ease), background .2s var(--ease); }
.see-calc:hover{ color:var(--text); background:var(--surface-2); }

/* ============ Transparency section ============ */
.section{ padding:var(--s-8) 0; border-top:1px solid var(--border); }
.section-head{ max-width:640px; margin-bottom:var(--s-6); }
.section-head h2{ font-size:clamp(26px,3.4vw,36px); line-height:1.15; letter-spacing:-.025em; font-weight:800; margin:0 0 var(--s-3); }
.section-head p{ color:var(--text-2); margin:0; font-size:17px; }
.explain{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-6); align-items:start; }
@media (min-width:960px){ .explain{ grid-template-columns:minmax(0,460px) minmax(0,1fr); gap:56px; } }

.receipt{ width:100%; max-width:480px; background:var(--paper); color:var(--paper-ink); font-family:var(--mono); padding:36px 26px 40px; box-shadow:var(--shadow-paper); position:relative;
  --zz:10px;
  -webkit-mask:
    conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) var(--zz) repeat-x,
    conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) var(--zz) repeat-x,
    linear-gradient(#000 0 0) center/100% calc(100% - 2*var(--zz)) no-repeat;
          mask:
    conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) var(--zz) repeat-x,
    conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) var(--zz) repeat-x,
    linear-gradient(#000 0 0) center/100% calc(100% - 2*var(--zz)) no-repeat; }
@media (min-width:480px){ .receipt{ padding:40px 34px 44px; } }
.rc-head{ text-align:center; margin-bottom:18px; }
.rc-brand{ font:600 16px var(--mono); letter-spacing:.24em; }
.rc-sub{ font-size:12px; color:var(--paper-muted); margin-top:4px; letter-spacing:.04em; }
.rc-rule{ border:0; border-top:1px solid var(--paper-line); margin:14px 0; }
.rc-rule.dash{ border-top:2px dashed var(--paper-ink); margin:16px 0 14px; }
.rc-line{ display:grid; grid-template-columns:18px minmax(0,1fr) auto; column-gap:10px; align-items:baseline; padding:9px 0; }
.rc-line + .rc-line{ border-top:1px dotted var(--paper-line); }
.rc-op{ font-weight:600; color:var(--paper-muted); text-align:center; }
.rc-lab{ font-size:15px; font-weight:500; }
.rc-det{ grid-column:2 / 4; font-size:12px; color:var(--paper-muted); margin-top:2px; font-family:var(--sans); }
.rc-amt{ font-size:15px; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; }
.rc-line.income .rc-amt, .rc-line.income .rc-op{ color:var(--paper-green); }
.rc-total{ display:grid; grid-template-columns:18px minmax(0,1fr) auto; column-gap:10px; align-items:baseline; }
.rc-total .rc-op{ color:var(--paper-ink); font-size:18px; }
.rc-total .rc-lab{ font-size:15px; font-weight:600; letter-spacing:.06em; }
.rc-total .rc-amt{ font-size:24px; letter-spacing:-.02em; }
.rc-total .rc-amt.neg{ color:var(--paper-red); } .rc-total .rc-amt.pos{ color:var(--paper-green); }
.rc-year{ text-align:right; font-size:12px; color:var(--paper-muted); margin-top:4px; }
.stamp{ display:block; width:max-content; margin:26px auto 4px; font:800 22px/1 var(--sans); letter-spacing:.14em; border:3px solid currentColor; border-radius:8px; padding:8px 16px 7px; transform:rotate(-6deg); opacity:.85; }
.stamp.pos{ color:var(--paper-green); } .stamp.neg{ color:var(--paper-red); }
.rc-total .rc-lab{ white-space:nowrap; }
@media (max-width:420px){ .rc-total .rc-lab{ font-size:13px; letter-spacing:.03em; } .rc-total .rc-amt{ font-size:20px; } .yield .overline, .metric .k{ letter-spacing:.04em; } .yield{ padding:var(--s-4); } .metric{ padding:var(--s-4); } }
.rc-foot{ text-align:center; font-size:11px; color:var(--paper-muted); margin-top:18px; letter-spacing:.03em; }

.explain-side{ display:flex; flex-direction:column; gap:var(--s-5); }
.formula{ padding:var(--s-5); }
.formula h3, .levers h3{ font-size:17px; font-weight:800; letter-spacing:-.01em; margin:0 0 var(--s-2); }
.formula p{ color:var(--text-2); font-size:15px; margin:0 0 var(--s-4); }
.formula code{ display:block; font:500 14px/1.7 var(--mono); color:var(--text); background:var(--surface-2); border:1px solid var(--border); border-radius:var(--r-md); padding:var(--s-4); overflow-x:auto; white-space:normal; }
.levers{ padding:var(--s-5); }
.levers > p{ color:var(--text-2); font-size:15px; margin:0 0 var(--s-3); }
.lever{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--s-3); align-items:center; padding:14px 0; border-top:1px solid var(--border); }
.lever:first-of-type{ border-top:0; }
.lever-t{ font-size:15px; font-weight:700; }
.lever-d{ font-size:13px; color:var(--text-3); margin-top:2px; }
.lever-g{ text-align:right; }
.lever-g .g{ font:600 15px var(--mono); color:var(--pos); white-space:nowrap; font-variant-numeric:tabular-nums; }
.lever-g .n{ font:500 12px var(--mono); color:var(--text-3); white-space:nowrap; margin-top:2px; }
.lever-empty{ font-size:14px; color:var(--text-3); padding:8px 0; }
.share-row{ display:flex; gap:var(--s-2); flex-wrap:wrap; align-items:center; }
.toast{ font-size:14px; font-weight:600; color:var(--pos); opacity:0; transition:opacity .25s var(--ease); }
.toast.show{ opacity:1; }

/* ============ Article ============ */
.article{ max-width:720px; }
.article h2{ font-size:clamp(22px,2.6vw,28px); line-height:1.2; letter-spacing:-.02em; font-weight:800; margin:var(--s-7) 0 var(--s-3); }
.article h2:first-child{ margin-top:0; }
.article p, .article li{ color:var(--text-2); font-size:17px; }
.article strong{ color:var(--text); }
.article ul{ padding-left:20px; }
.article li{ margin-bottom:8px; }
.article li::marker{ color:var(--accent); }
.site-footer{ border-top:1px solid var(--border); padding:var(--s-6) 0 calc(var(--s-6) + 76px); color:var(--text-3); font-size:13px; }
@media (min-width:1024px){ .site-footer{ padding-bottom:var(--s-6); } }
.site-footer .container{ display:flex; flex-direction:column; gap:var(--s-2); }

/* ============ Mobile result bar ============ */
.mbar{ position:fixed; left:0; right:0; bottom:0; z-index:40; padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));
  background:color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--border-strong); display:flex; align-items:center; justify-content:space-between; gap:var(--s-3);
  transform:translateY(0); transition:transform .3s var(--ease); }
.mbar.hide{ transform:translateY(110%); }
.mbar .k{ font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.mbar .v{ white-space:nowrap; font:600 22px/1.2 var(--mono); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.mbar .v.pos{ color:var(--pos); } .mbar .v.neg{ color:var(--neg); }
.mbar .btn{ min-height:46px; padding:0 18px; font-size:15px; white-space:nowrap; }
@media (max-width:360px){ .mbar .v{ font-size:18px; } .mbar .btn{ padding:0 14px; font-size:14px; } }
@media (min-width:1024px){ .mbar{ display:none; } }

/* ============ Reveal ============ */
.reveal{ opacity:0; transform:translateY(8px); transition:opacity .5s var(--ease), transform .5s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* ============ Navigation ============ */
.nav{ display:flex; align-items:center; gap:4px; }
.nav-link[aria-current="page"]{ color:var(--text); background:var(--surface-2); }
@media (max-width:480px){ .nav .hide-sm{ display:none; } }

/* ============ Footer (multi-pages) ============ */
.site-footer .foot-top{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--s-4); align-items:center; margin-bottom:var(--s-3); }
.foot-links{ display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-5); padding:0; margin:0; list-style:none; }
.foot-links a{ color:var(--text-2); text-decoration:none; font-weight:600; }
.foot-links a:hover{ color:var(--text); }

/* ============ Accueil ============ */
.home-hero{ padding:72px 0 56px; }
@media (min-width:900px){ .home-hero{ padding:112px 0 80px; } }
.home-hero h1{ max-width:18ch; }
.cards{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-4); }
@media (min-width:720px){ .cards{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.tool{ display:flex; flex-direction:column; gap:var(--s-3); padding:var(--s-5); text-decoration:none; color:inherit; transition:border-color .2s var(--ease), transform .2s var(--ease); min-height:220px; }
a.tool:hover{ border-color:var(--border-strong); transform:translateY(-2px); }
.tool .step-badge{ margin-bottom:var(--s-2); }
.tool h3{ font-size:19px; font-weight:800; letter-spacing:-.015em; margin:0; }
.tool p{ margin:0; color:var(--text-2); font-size:15px; flex:1; }
.tool .go{ font-size:14px; font-weight:800; color:var(--accent-text); display:flex; align-items:center; gap:6px; }
.tool.soon{ opacity:.62; }
.tool .soon-tag{ font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
.pillars{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-6); }
@media (min-width:860px){ .pillars{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.pillar .n{ font:600 13px var(--mono); color:var(--accent-text); letter-spacing:.08em; }
.pillar h3{ font-size:19px; font-weight:800; margin:8px 0 6px; letter-spacing:-.015em; }
.pillar p{ color:var(--text-2); margin:0; }
.split{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-6); align-items:center; }
@media (min-width:960px){ .split{ grid-template-columns:minmax(0,1fr) minmax(0,440px); gap:64px; } }
.split h2{ font-size:clamp(26px,3.4vw,36px); line-height:1.15; letter-spacing:-.025em; font-weight:800; margin:0 0 var(--s-3); }
.split p{ color:var(--text-2); font-size:17px; margin:0 0 var(--s-5); }
.cta-band{ padding:var(--s-6); display:flex; flex-direction:column; gap:var(--s-4); align-items:flex-start; }
@media (min-width:768px){ .cta-band{ flex-direction:row; align-items:center; justify-content:space-between; padding:40px; } }
.cta-band h2{ font-size:clamp(22px,2.8vw,30px); letter-spacing:-.02em; font-weight:800; margin:0 0 6px; }
.cta-band p{ margin:0; color:var(--text-2); }

/* ============ Pages de contenu ============ */
.page{ padding:64px 0 var(--s-8); }
.page .article h1{ font-size:clamp(30px,4.4vw,44px); max-width:none; margin-bottom:var(--s-3); }
.page .article .updated{ color:var(--text-3); font-size:14px; margin:0 0 var(--s-6); }
.page .article h2{ margin-top:var(--s-6); }
.page .article a{ color:var(--accent-text); }
.todo{ background:var(--accent-soft); color:var(--text); border-radius:6px; padding:0 6px; font-weight:700; }
.notfound{ min-height:60vh; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:var(--s-4); padding:var(--s-8) 0; }
.notfound .code{ font:600 64px/1 var(--mono); color:var(--accent-text); letter-spacing:-.04em; }
.site-footer.plain{ padding-bottom:var(--s-6); }

/* ================= V2 ================= */
.skip{ position:absolute; left:12px; top:-60px; z-index:100; background:var(--accent); color:var(--accent-ink); font-weight:800; padding:10px 16px; border-radius:var(--r-pill); text-decoration:none; transition:top .2s var(--ease); }
.skip:focus{ top:calc(12px + env(safe-area-inset-top,0px)); }
@media (max-width:380px){ .nav .hide-xs{ display:none; } }
.home-hero .lede{ font-size:clamp(17px,1.8vw,20px); color:var(--text-2); max-width:58ch; margin:0 0 var(--s-5); }
.home-hero .lede strong{ color:var(--text); }

/* Exemples pré-remplis */
.presets{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-2); padding:var(--s-5) var(--s-5) 0; }
@media (min-width:768px){ .presets{ padding:var(--s-6) var(--s-6) 0; } }
.presets-l{ font-size:13px; font-weight:700; color:var(--text-3); margin-right:4px; width:100%; }
@media (min-width:560px){ .presets-l{ width:auto; } }
.chip-btn{ font:600 13px var(--sans); color:var(--text-2); background:var(--surface-2); border:1px solid var(--border-strong); border-radius:var(--r-pill); padding:8px 14px; cursor:pointer; transition:color .2s var(--ease), border-color .2s var(--ease), background .2s var(--ease); min-height:36px; }
.chip-btn:hover{ color:var(--text); border-color:color-mix(in srgb, var(--text) 25%, transparent); }
.chip-btn[aria-pressed="true"]{ color:var(--accent-ink); background:var(--accent); border-color:var(--accent); }
.chip-btn:focus-visible{ outline:none; box-shadow:0 0 0 3px var(--accent-soft); }

/* FAQ */
.faq{ max-width:820px; border-top:1px solid var(--border); }
.faq-item{ border-bottom:1px solid var(--border); }
.faq-item summary{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:var(--s-4); padding:20px 0; font-size:17px; font-weight:700; letter-spacing:-.01em; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary .icon{ color:var(--text-3); transition:transform .25s var(--ease); }
.faq-item[open] summary .icon{ transform:rotate(180deg); }
.faq-item summary:focus-visible{ outline:2px solid var(--accent); outline-offset:4px; border-radius:6px; }
.faq-item p{ margin:0 0 20px; color:var(--text-2); max-width:70ch; }
.related{ margin-top:var(--s-6); display:flex; flex-direction:column; gap:var(--s-2); max-width:820px; }
.related-l{ font-size:12px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--text-3); margin-bottom:4px; }
.related-a{ display:flex; align-items:center; gap:10px; color:var(--text); text-decoration:none; font-weight:700; padding:12px 14px; border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface); transition:border-color .2s var(--ease); }
.related-a:hover{ border-color:var(--border-strong); }
.related-a .icon{ color:var(--accent-text); }

/* Réseaux */
.socials{ display:flex; flex-wrap:wrap; gap:var(--s-2); padding:0; margin:0; list-style:none; }
.socials a{ display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 16px; border:1px solid var(--border-strong); border-radius:var(--r-pill); color:var(--text); text-decoration:none; font-weight:700; font-size:14px; transition:background .2s var(--ease), border-color .2s var(--ease); }
.socials a:hover{ background:var(--surface-2); }
.socials.small a{ min-height:36px; padding:0 12px; font-size:13px; color:var(--text-2); }
.article .socials{ margin:0 0 var(--s-4); }

/* Footer V2 */
.foot-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-6); margin-bottom:var(--s-6); }
@media (min-width:760px){ .foot-grid{ grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr); } }
.foot-brand strong{ color:var(--text); font-size:15px; }
.foot-brand p{ margin:6px 0 var(--s-4); color:var(--text-3); max-width:40ch; }
.foot-col{ display:flex; flex-direction:column; gap:10px; }
.foot-col a{ color:var(--text-2); text-decoration:none; font-weight:600; }
.foot-col a:hover{ color:var(--text); }
.foot-h{ font-size:12px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--text-3); margin-bottom:2px; }
.foot-legal{ margin:0; padding-top:var(--s-5); border-top:1px solid var(--border); color:var(--text-3); }

/* Épisodes */
.epis{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-4); }
@media (min-width:640px){ .epis{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1060px){ .epis{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.epi{ display:flex; flex-direction:column; gap:var(--s-2); padding:var(--s-5); text-decoration:none; color:inherit; transition:border-color .2s var(--ease), transform .2s var(--ease); }
.epi:hover{ border-color:var(--border-strong); transform:translateY(-2px); }
.epi-n{ font:600 12px var(--mono); letter-spacing:.1em; color:var(--accent-text); }
.epi h3{ font-size:17px; font-weight:800; letter-spacing:-.01em; margin:0; line-height:1.3; }
.epi p{ margin:0; color:var(--text-2); font-size:14px; flex:1; }
.epi .go, .guide-card .go{ font-size:14px; font-weight:800; color:var(--accent-text); display:flex; align-items:center; gap:6px; margin-top:var(--s-2); }
.follow{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-4); margin-top:var(--s-6); color:var(--text-2); }
.follow strong{ color:var(--text); }

/* Guides */
.guides-list{ display:grid; grid-template-columns:minmax(0,1fr); gap:var(--s-4); }
@media (min-width:720px){ .guides-list{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.guide-card{ display:flex; flex-direction:column; gap:var(--s-2); padding:var(--s-5); text-decoration:none; color:inherit; transition:border-color .2s var(--ease), transform .2s var(--ease); }
.guide-card:hover{ border-color:var(--border-strong); transform:translateY(-2px); }
.gc-k{ font-size:12px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--text-3); }
.guide-card h3{ font-size:19px; font-weight:800; letter-spacing:-.015em; margin:0; line-height:1.3; }
.guide-card p{ margin:0; color:var(--text-2); font-size:15px; }
.article .intro{ font-size:19px; color:var(--text-2); }
.article .receipt{ margin:var(--s-6) 0; }
.article .note{ font-size:14px; color:var(--text-3); margin-top:var(--s-5); }
.article .guides-list{ margin-top:var(--s-6); }
.article .guide-card, .article .guide-card h3{ color:var(--text); text-decoration:none; }
.cta-band.inline{ margin:var(--s-6) 0; padding:var(--s-5); }
@media (min-width:768px){ .cta-band.inline{ padding:28px; } }
.cta-band.inline h2{ font-size:22px; margin:0 0 4px; }
.article .cta-band a.btn{ color:var(--accent-ink); }
.table-wrap{ overflow-x:auto; margin:var(--s-4) 0 var(--s-5); border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface); }
table.data{ width:100%; border-collapse:collapse; font-size:15px; min-width:420px; }
table.data th, table.data td{ padding:12px 16px; text-align:left; border-bottom:1px solid var(--border); }
table.data th{ font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3); }
table.data td:not(:first-child), table.data th:not(:first-child){ text-align:right; font-family:var(--mono); font-variant-numeric:tabular-nums; }
table.data td:first-child{ color:var(--text-2); }
table.data tr:last-child td{ border-bottom:0; }
table.data tr.total td{ font-weight:700; color:var(--text); background:var(--surface-2); }
table.data td.pos{ color:var(--pos); } table.data td.neg{ color:var(--neg); }

/* Impression du ticket */
#print-area{ display:none; }
@media print{
  @page{ margin:14mm; }
  body{ background:#fff !important; color:#000; }
  body > *:not(#print-area){ display:none !important; }
  #print-area{ display:block !important; }
  #print-area .receipt{ max-width:440px; box-shadow:none; -webkit-mask:none; mask:none; border:1px dashed #999; opacity:1; transform:none; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .pa-h{ font:700 14px var(--sans); margin:0 0 12px; color:#000; }
  .pa-n{ font:12px var(--sans); color:#555; margin-top:12px; }
}