/*
Theme Name: BFO Native
Theme URI: https://blackformance.com/
Author: Realisons / Yan Haltey Brands
Description: Native WordPress theme generated from the Blackformance prototype. Trilingual FR/DE/EN via Polylang.
Version: 0.57.3
Requires at least: 6.5
Tested up to: 7.0
Text Domain: bfo-native
*/

/* Blackformance — prototype site v0.3. Charte : tokens/ du repo + planches art-*.jsx.
   Deux thèmes (dark / light). Motifs : brackets · crosshair · grid · scanlines. */

/* ---------- THEMES ---------- */
:root, [data-theme="dark"]{
  --bg:#050505; --surface:#0c0c0d; --surface2:#16161a; --line:#1f1f24;
  --text:#fafaf7; --text2:#9a9aa3; --text3:#74747e;
  --accent:#d4ff3a; --accent-dim:#a3c722; --accent-ink:#050505;
  --eye:var(--accent); --motif:rgba(255,255,255,.55); --motif-soft:rgba(255,255,255,.10);
  --shadow:0 1px 0 rgba(255,255,255,.03);
}
[data-theme="light"]{
  --bg:#f5f1e8; --surface:#fffdf9; --surface2:#ece5d6; --line:#ddd4c2;
  --text:#0c0c0d; --text2:#5a564d; --text3:#8f8878;
  --accent:#d4ff3a; --accent-dim:#a3c722; --accent-ink:#0c0c0d;
  --eye:#0c0c0d; --motif:rgba(0,0,0,.42); --motif-soft:rgba(0,0,0,.08);
  --shadow:0 1px 2px rgba(0,0,0,.04);
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--bg); color:var(--text);
  font-family:var(--sans); font-weight:300; line-height:1.6;
  -webkit-font-smoothing:antialiased; font-feature-settings:'ss01','cv11';
  transition:background .35s ease, color .35s ease;}
:root{
  --sans:"IBM Plex Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --maxw:1140px;
}
a{color:inherit; text-decoration:none;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
.mono{font-family:var(--mono);}
.tab{font-variant-numeric:tabular-nums;}
.accent{color:var(--accent-dim);}
em{font-style:italic; color:var(--text);}
h1,h2,h3{font-weight:600; line-height:1.12; letter-spacing:-.015em; margin:0;}

.eyebrow{font-family:var(--mono); font-size:11.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--eye); margin:0 0 18px; display:inline-flex; gap:.5em; align-items:center;}
.eyebrow::before{content:"//"; color:var(--text3);}

/* ---------- MOTIFS ---------- */
.motif-grid{position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,var(--motif-soft) 1px,transparent 1px) 0 0/54px 54px,
             linear-gradient(var(--motif-soft) 1px,transparent 1px) 0 0/54px 54px;
  mask-image:radial-gradient(circle at 14% 0%,#000 0%,transparent 60%);}
.motif-scan{position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(0deg,var(--motif-soft) 0 1px,transparent 1px 5px);
  opacity:.5; mask-image:linear-gradient(180deg,#000,transparent 70%);}
/* corner brackets (stationery-style : top-right + bottom-left) */
.bkt{position:relative;}
.bkt::before,.bkt::after{content:""; position:absolute; width:11px; height:11px; border:0 solid var(--accent); opacity:.9;}
.bkt::before{top:9px; right:9px; border-top-width:1px; border-right-width:1px;}
.bkt::after{bottom:9px; left:9px; border-bottom-width:1px; border-left-width:1px;}
.stamp{font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--text3); text-transform:uppercase;}

/* ---------- HEADER ---------- */
header{position:sticky; top:0; z-index:50; background:color-mix(in srgb,var(--bg) 78%, transparent);
  backdrop-filter:blur(12px); border-bottom:1px solid var(--line);}
.bar{display:flex; align-items:center; justify-content:space-between; height:66px; gap:16px;}
.bar .logo{height:19px; width:auto; display:block;}
.bar .logo-onlight{display:none;}
[data-theme="light"] .bar .logo-ondark{display:none;}
[data-theme="light"] .bar .logo-onlight{display:block;}
.bar .brand{display:flex; align-items:center; gap:12px;}
.bar .brand .loc{color:var(--text3);}
nav.main{display:flex; align-items:center;}
nav.main a{font-family:var(--mono); font-size:12.5px; letter-spacing:.05em; color:var(--text2); margin-left:22px; transition:color .15s; white-space:nowrap;}
nav.main a:hover,nav.main a.active{color:var(--text);}
nav.main a.active{border-bottom:1.5px solid var(--accent); padding-bottom:3px;}
.nav-cta{color:var(--accent-dim)!important;}
.tools{display:flex; align-items:center; gap:12px; margin-left:24px;}
.lang{font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; color:var(--text3); display:flex; gap:7px;}
.lang a.on{color:var(--text);}
.lang a[aria-disabled]{opacity:.5; cursor:not-allowed;}
/* Bascule clair/sombre : icône seule (glyphe négatif ◐), discrète, sans libellé */
.theme-btn{background:transparent; border:1px solid var(--line); color:var(--text2); border-radius:4px;
  padding:7px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:.15s;}
.theme-btn:hover{border-color:var(--text3); color:var(--text);}
.theme-btn .lbl{display:none;}
.theme-btn .dot{width:14px; height:14px; border-radius:50%; border:1.5px solid currentColor; background:transparent;
  background-image:linear-gradient(90deg, currentColor 0 50%, transparent 50% 100%);}
@media(max-width:900px){ nav.main a{margin-left:14px; font-size:11.5px;} .tools{margin-left:12px;} .bar .brand .loc{display:none;} }
@media(max-width:680px){ nav.main .opt{display:none;} .lang{display:none;} }

/* ---------- BUTTONS ---------- */
.cta-row{display:flex; flex-wrap:wrap; gap:14px; margin-top:36px;}
.btn{display:inline-flex; align-items:center; gap:9px; font-family:var(--mono); font-size:13px; letter-spacing:.03em;
  padding:13px 22px; border-radius:4px; border:1px solid var(--line); color:var(--text); background:transparent;
  transition:.16s; cursor:pointer;}
.btn:hover{border-color:var(--text3); background:var(--surface);}
.btn.primary{background:var(--accent); color:var(--accent-ink); border-color:var(--accent); font-weight:600;}
.btn.primary:hover{background:var(--accent-dim); border-color:var(--accent-dim);}

/* ---------- HERO ---------- */
.hero{position:relative; overflow:hidden; padding:104px 0 88px;}
.hero .inner{position:relative; z-index:1; max-width:860px;}
.tagline{font-family:var(--mono); color:var(--accent-dim); font-size:13px; letter-spacing:.22em; text-transform:uppercase; margin:0 0 24px;}
.hero h1{font-size:clamp(40px,6.6vw,78px); letter-spacing:-.03em; font-weight:600;}
.hero h1 .sub{display:block; color:var(--text2); font-weight:300; font-size:clamp(19px,2.2vw,25px); margin-top:22px; letter-spacing:-.01em; line-height:1.45;}
.hero p.lede{color:var(--text2); font-size:18px; max-width:600px; margin:30px 0 0;}
.hero .side-stamp{position:absolute; top:120px; right:28px; z-index:1; text-align:right; display:flex; flex-direction:column; gap:5px;}
@media(max-width:900px){ .hero .side-stamp{display:none;} }

/* ---------- PAGE HERO ---------- */
.page-hero{position:relative; overflow:hidden; padding:80px 0 40px; border-bottom:1px solid var(--line);}
.page-hero .inner{position:relative; z-index:1; max-width:860px;}
.page-hero h1{font-size:clamp(34px,5.2vw,58px); letter-spacing:-.025em;}
.page-hero p.lede{color:var(--text2); font-size:18px; max-width:660px; margin:22px 0 0;}

/* ---------- SECTIONS ---------- */
section{padding:74px 0; border-top:1px solid var(--line);}
section.alt{background:var(--surface);}
section:first-of-type{border-top:0;}
.sec-head{max-width:720px; margin-bottom:46px;}
.sec-head h2{font-size:clamp(27px,3.4vw,40px);}
.sec-head p{color:var(--text2); font-size:18px; margin:18px 0 0;}
.sec-head p a{color:var(--accent-dim); border-bottom:1px solid var(--line);}

/* ---------- PROSE ---------- */
.prose{max-width:730px; color:var(--text2); font-size:16.5px;}
.prose p{margin:0 0 18px;}
.prose h3{color:var(--text); font-size:21px; margin:36px 0 12px; letter-spacing:-.01em;}
.prose strong{color:var(--text); font-weight:500;}
.prose ul{margin:0 0 18px; padding-left:0; list-style:none;}
.prose ul li{position:relative; padding-left:24px; margin:0 0 10px;}
.prose ul li::before{content:"→"; position:absolute; left:0; color:var(--accent-dim);}

/* ---------- STEPS ---------- */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.step{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:28px 26px; box-shadow:var(--shadow);}
.step .n{font-family:var(--mono); color:var(--accent-dim); font-size:12px; letter-spacing:.1em;}
.step h3{font-size:19px; margin:16px 0 10px;}
.step p{color:var(--text2); font-size:15px; margin:0;}

/* ---------- BOUNDARY ---------- */
.split{display:grid; grid-template-columns:1fr auto 1fr; align-items:stretch; border:1px solid var(--line); border-radius:8px; overflow:hidden; margin-top:20px;}
.split .col{padding:32px 34px; background:var(--surface);}
.split .col.b{background:var(--surface2);}
.split .mid{width:1px; background:var(--line);}
.split .who{font-family:var(--mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;}
.split .col.a .who{color:var(--accent-dim);}
.split .col.b .who{color:var(--text2);}
.split h3{font-size:22px; margin:14px 0 6px;}
.split p{color:var(--text2); font-size:15px; margin:6px 0 0;}
.split .q{color:var(--text);}

/* ---------- FAMILY CARDS (prestations) ---------- */
.fam-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px;}
.card-fam{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:26px 26px 24px; box-shadow:var(--shadow); transition:border-color .16s, transform .16s;}
.card-fam:hover{border-color:var(--text3); transform:translateY(-2px);}
.card-fam .top{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:4px;}
.card-fam .name{font-size:22px; font-weight:600; letter-spacing:-.01em;}
.card-fam .k{font-family:var(--mono); font-size:11px; color:var(--accent-dim); letter-spacing:.12em; text-transform:uppercase;}
.card-fam .desc{color:var(--text2); font-size:15px; margin:8px 0 18px;}
.card-fam .ex{border-top:1px solid var(--line); padding-top:14px; margin-top:2px;}
.card-fam .ex .lbl{font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--text3); display:block; margin-bottom:10px;}
.card-fam .ex ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px;}
.card-fam .ex li{display:flex; gap:10px; align-items:baseline; font-size:14px; color:var(--text2);}
.card-fam .ex li b{font-family:var(--mono); font-size:12px; color:var(--text); font-weight:500; white-space:nowrap;}
.card-fam .ex li span{color:var(--text2);}

/* ---------- FAMILY TEASER (home) ---------- */
.fam-teaser{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.fam-teaser a{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:20px; transition:.16s; display:block; box-shadow:var(--shadow);}
.fam-teaser a:hover{border-color:var(--accent); transform:translateY(-2px);}
.fam-teaser .k{font-family:var(--mono); font-size:11px; color:var(--accent-dim); letter-spacing:.12em;}
.fam-teaser h3{font-size:18px; margin:12px 0 5px; letter-spacing:-.01em;}
.fam-teaser p{color:var(--text3); font-size:12.5px; margin:0; font-family:var(--mono); letter-spacing:.03em;}

/* ---------- WHY ---------- */
.why{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.why .item{border-top:2px solid var(--accent); padding:18px 0 0;}
.why .item .big{font-family:var(--mono); font-size:20px; color:var(--text); font-weight:500; letter-spacing:.01em;}
.why .item p{color:var(--text2); font-size:14px; margin:10px 0 0;}

/* ---------- APPROACH GENERIC ---------- */
.generic{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.generic .g{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:26px; box-shadow:var(--shadow);}
.generic .g .k{font-family:var(--mono); font-size:11px; color:var(--accent-dim); letter-spacing:.12em; text-transform:uppercase;}
.generic .g h3{font-size:19px; margin:14px 0 8px;}
.generic .g p{color:var(--text2); font-size:14.5px; margin:0;}

/* ---------- TIERS ---------- */
.tiers{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:8px;}
.tier{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:26px; box-shadow:var(--shadow);}
.tier .lvl{font-family:var(--mono); color:var(--accent-dim); font-size:12px; letter-spacing:.1em; text-transform:uppercase;}
.tier h3{font-size:20px; margin:12px 0 10px;}
.tier p{color:var(--text2); font-size:14.5px; margin:0;}
.note{color:var(--text3); font-size:13px; font-family:var(--mono); margin-top:22px; letter-spacing:.03em;}

/* ---------- LIME CTA BAND ---------- */
.cta-band{position:relative; overflow:hidden; background:var(--accent); color:var(--accent-ink); border-top:1px solid var(--line);}
.cta-band .inner{position:relative; z-index:1; text-align:center; padding:72px 0;}
.cta-band h2{font-size:clamp(26px,3.6vw,40px); color:#050505;}
.cta-band p{color:#141418; margin:16px auto 30px; max-width:520px; font-size:17px;}
.cta-band .cta-row{justify-content:center;}
.cta-band .btn{border-color:rgba(0,0,0,.28); color:#050505;}
.cta-band .btn:hover{background:rgba(0,0,0,.07);}
.cta-band .btn.dark{background:#050505; color:var(--accent); border-color:#050505;}
.cta-band .motif-scan{opacity:.10;}

/* ---------- CONTACT ---------- */
.contact-cols{display:grid; grid-template-columns:1.4fr 1fr; gap:44px; align-items:start;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.field{display:flex; flex-direction:column; gap:8px;}
.field.full{grid-column:1 / -1;}
.field label{font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--text2);}
.field label .req{color:var(--accent-dim);}
.field input,.field select,.field textarea{background:var(--surface); border:1px solid var(--line); border-radius:4px;
  color:var(--text); font-family:var(--sans); font-size:15px; padding:12px 14px; width:100%; transition:border-color .15s;}
.field textarea{resize:vertical; min-height:132px;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--accent);}
.field select{font-family:var(--mono); font-size:13.5px;}
.form-actions{grid-column:1 / -1; display:flex; align-items:center; gap:18px; flex-wrap:wrap;}
.form-note{color:var(--text3); font-family:var(--mono); font-size:12px;}
.form-note.ok{color:var(--accent-dim);}
.aside .blk{border-top:2px solid var(--accent); padding:16px 0 0; margin-bottom:26px;}
.aside .blk .k{font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-dim);}
.aside .blk h3{font-size:17px; margin:8px 0 6px;}
.aside .blk p{color:var(--text2); font-size:14px; margin:0;}
.aside .blk a{color:var(--text); border-bottom:1px solid var(--line);}

/* ---------- FOOTER ---------- */
footer{border-top:1px solid var(--line); padding:36px 0; color:var(--text3);}
.foot{display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center; font-family:var(--mono); font-size:12px; letter-spacing:.04em;}
footer .sig{color:var(--text2);}
.foot-links a{margin-left:16px; color:var(--text3);}
.foot-links a:hover{color:var(--text);}
.foot-meta{max-width:var(--maxw); margin:14px auto 0; padding:0 28px; font-family:var(--mono); font-size:11px; color:var(--text3); letter-spacing:.04em;}
.proto-flag{background:var(--surface2); border-top:1px solid var(--line); font-family:var(--mono); font-size:11px;
  letter-spacing:.08em; color:var(--accent-dim); text-align:center; padding:7px; text-transform:uppercase;}

@media(max-width:820px){ .contact-cols{grid-template-columns:1fr;} .form-grid{grid-template-columns:1fr;} }
@media(max-width:760px){
  .steps,.tiers,.why,.fam-grid,.fam-teaser,.generic{grid-template-columns:1fr;}
  .why,.fam-teaser{grid-template-columns:1fr 1fr;}
  .split{grid-template-columns:1fr;} .split .mid{width:auto; height:1px;}
}

/* =====================================================================
   v0.4 — mix ink/paper (négatif au toggle) · viseur · icônes · motion
   ===================================================================== */
:root{ --ease:cubic-bezier(.2,.8,.2,1); }

/* ---- Panels : palettes fixes qui cohabitent sur une même page ---- */
.ink{
  --bg:#050505; --surface:#0c0c0d; --surface2:#16161a; --line:#26262c;
  --text:#fafaf7; --text2:#9a9aa3; --text3:#74747e;
  --accent-ink:#050505; --eye:#d4ff3a; --motif-soft:rgba(255,255,255,.10);
  background:var(--bg); color:var(--text);
}
.paper{
  --bg:#f5f1e8; --surface:#fffdf9; --surface2:#ece5d6; --line:#ddd4c2;
  --text:#0c0c0d; --text2:#5a564d; --text3:#8f8878;
  --accent-ink:#0c0c0d; --eye:#0c0c0d; --motif-soft:rgba(0,0,0,.07);
  background:var(--bg); color:var(--text);
}
/* Toggle = négatif : on inverse ink<->paper */
[data-theme="light"] .ink{
  --bg:#f5f1e8; --surface:#fffdf9; --surface2:#ece5d6; --line:#ddd4c2;
  --text:#0c0c0d; --text2:#5a564d; --text3:#8f8878;
  --accent-ink:#0c0c0d; --eye:#0c0c0d; --motif-soft:rgba(0,0,0,.07);
}
[data-theme="light"] .paper{
  --bg:#050505; --surface:#0c0c0d; --surface2:#16161a; --line:#26262c;
  --text:#fafaf7; --text2:#9a9aa3; --text3:#74747e;
  --accent-ink:#050505; --eye:#d4ff3a; --motif-soft:rgba(255,255,255,.10);
}
section.ink, section.paper{border-top:0;}
.panel-edge{border-top:1px solid var(--line);}

/* ---- Viseur / mark ---- */
.vf{display:inline-block; vertical-align:middle; color:var(--text);}
.vf svg{display:block;}
.brand .vf{color:var(--text);}
.mark-lockon rect.core{transform-box:fill-box; transform-origin:center; animation:lockon 3.2s var(--ease) infinite;}
@keyframes lockon{0%,70%,100%{transform:scale(1); opacity:1;} 82%{transform:scale(.55); opacity:.7;}}

/* ---- Icônes de domaine ---- */
.icn{width:30px; height:30px; color:var(--text);}
.icn svg{display:block; width:100%; height:100%;}
.card-fam .top .icn{margin-right:auto;}
.dom-head{display:flex; align-items:center; gap:14px; margin-bottom:6px;}
.dom-head .icn{flex:none;}

/* ---- Titre : accent lime italique serif ---- */
.li{font-family:"IBM Plex Serif",Georgia,serif; font-style:italic; font-weight:500;
  color:var(--accent-dim); letter-spacing:-.01em;}
[data-theme] .ink .li, .ink .li{color:var(--accent);}
.paper .li{color:#7a9410;}
[data-theme="light"] .ink .li{color:#7a9410;}
[data-theme="light"] .paper .li{color:var(--accent);}

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

/* =========================== MINI BUSINESS CASE =========================== */
.sim{position:relative; background:#0a0a0b; border:1px solid #26262c; border-radius:10px;
  padding:18px; color:#fafaf7; font-family:var(--mono); overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.5);}
.sim .scan{position:absolute; left:0; right:0; height:64px; top:-64px;
  background:linear-gradient(180deg,transparent,rgba(212,255,58,.10),transparent);
  animation:scan 4.2s linear infinite; pointer-events:none;}
@keyframes scan{0%{top:-64px;}100%{top:100%;}}
.sim-top{display:flex; align-items:center; justify-content:space-between; font-size:10.5px; letter-spacing:.1em; color:#5a5a64; text-transform:uppercase;}
.sim-top .id{color:#8a8a94;}
.sim-top .run{color:var(--accent); display:inline-flex; align-items:center; gap:6px;}
.sim-top .run .dot{width:6px; height:6px; border-radius:50%; background:var(--accent); animation:blink 1.1s steps(1) infinite;}
@keyframes blink{50%{opacity:.25;}}
.sim h4{font-family:var(--sans); font-weight:600; font-size:16px; letter-spacing:-.01em; margin:12px 0 2px; color:#fafaf7;}
.sim .sub{font-size:11px; color:#5a5a64; margin-bottom:16px;}
.sim-cost{display:flex; align-items:flex-end; justify-content:space-between; border-top:1px solid #1f1f24; border-bottom:1px solid #1f1f24; padding:12px 0; margin-bottom:14px;}
.sim-cost .lab{font-size:9.5px; letter-spacing:.12em; color:#5a5a64; text-transform:uppercase;}
.sim-cost .val{font-size:30px; font-weight:600; font-variant-numeric:tabular-nums; color:#fafaf7; line-height:1;}
.sim-cost .val .cur{font-size:15px; color:#8a8a94; margin-right:4px;}
.sim-cost .delta{font-size:11px; color:#5fd97a;}
.sim-bars{display:flex; align-items:flex-end; gap:8px; height:66px; margin-bottom:6px;}
.sim-bars .bar{flex:1; background:#1b1b1f; border-top:2px solid #33333a; position:relative; height:0; animation:grow 1.1s var(--ease) forwards;}
.sim-bars .bar.hot{background:rgba(212,255,58,.14); border-top-color:var(--accent);}
.sim-bars .bar span{position:absolute; top:-15px; left:0; right:0; text-align:center; font-size:9.5px; color:#8a8a94;}
@keyframes grow{from{height:0;}}
.sim-x{display:flex; justify-content:space-between; font-size:9px; color:#5a5a64; border-top:1px solid #1f1f24; padding-top:6px; margin-bottom:14px;}
.sim-verdict{display:flex; align-items:center; gap:12px; background:rgba(95,217,122,.08); border:1px solid rgba(95,217,122,.3); border-radius:6px; padding:11px 14px; opacity:0; animation:fadein .5s var(--ease) 1.4s forwards;}
.sim-verdict .go{font-family:var(--sans); font-weight:700; font-size:14px; letter-spacing:.06em; color:#5fd97a;}
.sim-verdict .txt{font-size:11px; color:#8a8a94; font-family:var(--sans);}
@keyframes fadein{to{opacity:1;}}
.sim-log{margin-top:12px; border-top:1px solid #1f1f24; padding-top:10px; font-size:10.5px; color:#5a5a64; line-height:1.7;}
.sim-log .ln{display:flex; gap:10px; opacity:0; animation:fadein .3s steps(1) forwards;}
.sim-log .ln .t{color:#5a5a64;}
.sim-log .ln .svc{color:#7aa8ff;}
.sim-log .ln .ok{color:#5fd97a; margin-left:auto;}
.sim-log .ln:nth-child(1){animation-delay:.3s;} .sim-log .ln:nth-child(2){animation-delay:.7s;}
.sim-log .ln:nth-child(3){animation-delay:1.1s;} .sim-log .ln:nth-child(4){animation-delay:1.6s;}

/* hero layout with sim */
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center;}
@media(max-width:940px){ .hero-grid{grid-template-columns:1fr; gap:36px;} .hero .side-stamp{display:none;} }

@media(prefers-reduced-motion:reduce){
  .sim .scan,.mark-lockon rect.core,.sim-top .run .dot{animation:none;}
  .sim-bars .bar{animation:none; height:var(--h,40%);}
  .sim-verdict,.sim-log .ln{opacity:1; animation:none;}
  .reveal{opacity:1; transform:none;}
}

/* =====================================================================
   v0.5 — constellation · strip domaines · lime clair · dropdown · légal
   ===================================================================== */

/* Lime plus doux sur fond clair (lignes/bordures) ; garde le punch sur sombre.
   En négatif, .paper devient une section sombre : l'accent reprend le lime vif. */
.paper{ --accent:#8aa60f; }
[data-theme="light"] .ink{ --accent:#8aa60f; }
[data-theme="light"] .paper{ --accent:#d4ff3a; }

/* Sélecteur de langue (dropdown) */
.lang-select{font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; color:var(--text2);
  background:transparent; border:1px solid var(--line); border-radius:4px; padding:6px 24px 6px 10px;
  cursor:pointer; appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 13px) 12px,calc(100% - 9px) 12px; background-size:4px 4px,4px 4px; background-repeat:no-repeat;}
.lang-select:hover{border-color:var(--text3); color:var(--text);}
.lang-select option{background:#0c0c0d; color:#fafaf7;}

/* Domaines — strip compact (icône + texte, sur une ligne) */
.dom-strip{display:grid; grid-template-columns:repeat(4,1fr); gap:12px;}
.dom{display:flex; align-items:center; gap:14px; padding:15px 16px; border:1px solid var(--line);
  border-radius:8px; background:var(--surface); transition:border-color .16s, transform .16s;}
.dom:hover{border-color:var(--accent); transform:translateY(-2px);}
.dom .icn{width:26px; height:26px; flex:none;}
.dom .tx{display:flex; flex-direction:column; line-height:1.2;}
.dom .tx b{font-size:15px; font-weight:600; letter-spacing:-.01em; color:var(--text);}
.dom .tx span{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; color:var(--text3); text-transform:uppercase; margin-top:3px;}
@media(max-width:820px){ .dom-strip{grid-template-columns:repeat(2,1fr);} }
@media(max-width:460px){ .dom-strip{grid-template-columns:1fr;} }

/* ---- Constellation (toile d'araignée des prestations) ---- */
.constel{padding:16px 16px 14px;}
.constel .c-top{display:flex; align-items:center; justify-content:space-between; font-size:10.5px;
  letter-spacing:.1em; color:#5a5a64; text-transform:uppercase; margin-bottom:2px;}
.constel .c-top .run{color:var(--accent); display:inline-flex; align-items:center; gap:6px;}
.constel .c-top .run .dot{width:6px; height:6px; border-radius:50%; background:var(--accent); animation:blink 1.1s steps(1) infinite;}
.constel svg{display:block; width:100%; height:auto;}
.constel .edge{stroke:#26262c; stroke-width:1;}
.constel .edge.live{stroke:rgba(212,255,58,.5);}
.constel .flow{fill:var(--accent);}
.constel .node-ring{fill:none; stroke:#1f1f24; stroke-width:2.4;}
.constel .node-prog{fill:none; stroke:var(--accent); stroke-width:2.4; stroke-linecap:round;
  transform:rotate(-90deg); transform-origin:center; transition:stroke-dashoffset 1.2s var(--ease);}
.constel .node-core{fill:#0c0c0d; stroke:#33333a; stroke-width:1;}
.constel .node.hot .node-core{fill:var(--accent); stroke:var(--accent);}
.constel .node-lbl{font-family:var(--mono); font-size:8.5px; fill:#8a8a94; text-anchor:middle;}
.constel .node-pct{font-family:var(--mono); font-size:8px; fill:var(--accent); text-anchor:middle;}
.constel .hub-core{fill:rgba(95,217,122,.12); stroke:#5fd97a; stroke-width:1.5;}
.constel .hub-go{font-family:var(--sans); font-weight:700; font-size:11px; fill:#5fd97a; text-anchor:middle;}
.constel .hub-lbl{font-family:var(--mono); font-size:8px; fill:#8a8a94; text-anchor:middle; text-transform:uppercase; letter-spacing:.08em;}
.constel .sweep{fill:url(#sweepgrad); transform-origin:center; animation:sweep 6s linear infinite;}
@keyframes sweep{to{transform:rotate(360deg);}}
.constel .c-foot{display:flex; justify-content:space-between; font-family:var(--mono); font-size:10px; color:#5a5a64; border-top:1px solid #1f1f24; padding-top:9px; margin-top:6px;}
.constel .c-foot b{color:#fafaf7; font-weight:500;}

/* Footer légal */
.foot-legal{display:flex; flex-wrap:wrap; gap:10px 18px; justify-content:space-between; align-items:center;
  margin-top:18px; padding-top:16px; border-top:1px solid var(--line);}
.legal-links a{font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--text3); margin-left:16px;}
.legal-links a:first-child{margin-left:0;}
.legal-links a:hover{color:var(--text);}
@media(max-width:620px){ .legal-links a{margin-left:0; margin-right:14px;} }

@media(prefers-reduced-motion:reduce){ .constel .sweep,.constel .c-top .run .dot{animation:none;} }

.mission-showcase{max-width:540px;}
.mission-showcase .sim{margin:0;}
@media(max-width:600px){ .mission-showcase{max-width:100%;} }

/* v0.6 — prestations : sous-produits dépliables (<details>) */
.prod-list{margin-top:14px; border-top:1px solid var(--line);}
details.prod{border-bottom:1px solid var(--line);}
details.prod > summary{list-style:none; cursor:pointer; display:flex; gap:12px; align-items:baseline; padding:12px 0;}
details.prod > summary::-webkit-details-marker{display:none;}
details.prod > summary .p-name{font-family:var(--mono); font-size:13.5px; color:var(--text); white-space:nowrap;}
details.prod > summary .p-q{color:var(--text2); font-size:13.5px;}
details.prod > summary .p-plus{margin-left:auto; color:var(--accent-dim); font-family:var(--mono); font-size:15px; line-height:1; transition:transform .2s var(--ease);}
details.prod[open] > summary .p-plus{transform:rotate(45deg);}
details.prod:hover > summary .p-name{color:var(--accent-dim);}
.p-exp{color:var(--text2); font-size:13.5px; line-height:1.55; padding:2px 0 14px; max-width:56ch;}
.p-exp .disc{display:block; margin-top:8px; font-family:var(--mono); font-size:11px; color:var(--text3);}

/* =====================================================================
   v0.7 — réservoirs de données (fûts qui se remplissent → GO)
   ===================================================================== */
.flux{padding:16px 18px 15px;}
.flux .c-top{display:flex; align-items:center; justify-content:space-between; font-size:10.5px; letter-spacing:.1em; color:#5a5a64; text-transform:uppercase; margin-bottom:4px;}
.flux .c-top .id{color:#8a8a94;}
.flux .c-top .run{color:var(--accent); display:inline-flex; align-items:center; gap:6px;}
.flux .c-top .run .dot{width:6px; height:6px; border-radius:50%; background:var(--accent); animation:blink 1.1s steps(1) infinite;}
.silos{display:flex; align-items:stretch; gap:11px; height:190px; margin:14px 0 6px;}
.silo{flex:1; display:flex; flex-direction:column; align-items:center; gap:9px; min-width:0;}
.silo .tube{position:relative; width:100%; max-width:40px; flex:1; border:1px solid #26262c; border-radius:6px; background:#0d0d0e; overflow:hidden;}
.silo .tube .ticks{position:absolute; inset:0; background:repeating-linear-gradient(0deg,transparent 0 15px,rgba(255,255,255,.035) 15px 16px);}
.silo .fill{position:absolute; left:0; right:0; bottom:0; height:0;
  background:linear-gradient(180deg,rgba(212,255,58,.30),rgba(212,255,58,.07));
  border-top:1.5px solid var(--accent); transition:height 1.5s var(--ease);}
.silo .fill::after{content:""; position:absolute; top:-1.5px; left:0; right:0; height:8px;
  background:linear-gradient(180deg,rgba(212,255,58,.5),transparent); opacity:.5; animation:flux-glow 2.6s var(--ease) infinite;}
@keyframes flux-glow{50%{opacity:1;}}
.silo .lab{font-family:var(--mono); font-size:9px; color:#8a8a94; letter-spacing:.03em; text-align:center; white-space:nowrap;}
.silo .pv{font-family:var(--mono); font-size:9px; color:#c9c9cf; font-variant-numeric:tabular-nums;}
.silo.done .pv{color:var(--accent);}
.go-tile{width:66px; flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  border:1px solid #26262c; border-radius:6px; background:#0d0d0e; transition:.5s var(--ease); align-self:stretch;}
.go-tile .g{font-family:var(--sans); font-weight:700; font-size:15px; letter-spacing:.08em; color:#3a3a42; transition:.5s;}
.go-tile .s{font-family:var(--mono); font-size:8px; letter-spacing:.12em; text-transform:uppercase; color:#5a5a64;}
.go-tile.armed{border-color:#5fd97a; background:rgba(95,217,122,.09);}
.go-tile.armed .g{color:#5fd97a;}
.go-tile.armed .s{color:#5fd97a;}
.flux .c-foot{display:flex; justify-content:space-between; font-family:var(--mono); font-size:10px; color:#5a5a64; border-top:1px solid #1f1f24; padding-top:9px; margin-top:8px;}
.flux .c-foot b{color:#8a8a94; font-weight:500;}
.flux .c-foot.armed b{color:#5fd97a;}
@media(prefers-reduced-motion:reduce){ .silo .fill::after,.flux .c-top .run .dot{animation:none;} }

/* v0.32 : clarification (accueil) — grille de brouillard qui devient nette, plan par plan */
.clarify{display:flex; flex-direction:column; gap:16px; height:190px; margin:14px 0 6px;}
.clarify .clfield{position:relative; flex:1; min-height:0;}
.clarify .nd{position:absolute; width:6px; height:6px; border-radius:50%; background:#33333a; opacity:.5; transform:translate(-50%,-50%); transition:background .2s cubic-bezier(.2,.8,.2,1), opacity .2s cubic-bezier(.2,.8,.2,1), box-shadow .2s cubic-bezier(.2,.8,.2,1);}
.clarify .nd.clr{background:var(--accent); opacity:1; box-shadow:0 0 4px rgba(212,255,58,.4);}
.clarify .clbar{display:flex; align-items:center; gap:12px;}
.clarify .clbar-track{flex:1; height:4px; border-radius:2px; background:#1f1f24; overflow:hidden;}
.clarify .clbar-fill{height:100%; width:0; background:var(--accent); transition:width .2s linear;}
.clarify .clbar-pct{font-family:var(--mono); font-size:11px; color:#c9c9cf; font-variant-numeric:tabular-nums; min-width:36px; text-align:right;}

/* v0.7 — ancres domaines (compense l'en-tête sticky) */
.card-fam[id]{scroll-margin-top:88px;}

/* v0.9 — mini-widgets de tête de page */
.page-hero .hero-grid{align-items:start;}
.page-hero .hero-grid .sim{align-self:center;}
.mini{padding:17px 18px 15px;}
.mini .m-top{display:flex; justify-content:space-between; font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:#5a5a64; margin-bottom:15px;}
.mini .m-top .run{color:var(--accent); display:inline-flex; align-items:center; gap:6px;}
.mini .m-top .run .dot{width:6px; height:6px; border-radius:50%; background:var(--accent); animation:blink 1.1s steps(1) infinite;}
.mini .m-foot{border-top:1px solid #1f1f24; padding-top:11px; margin-top:15px; font-family:var(--mono); font-size:10.5px; color:#5a5a64; display:flex; justify-content:space-between;}
.mini .m-foot b{color:#8a8a94; font-weight:500;}
.mini .cov-n{color:var(--accent);}
/* couverture */
.cov{display:grid; grid-template-columns:repeat(4,1fr); gap:8px;}
.cov .cell{aspect-ratio:5/4; border:1px solid #26262c; border-radius:5px; display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:11px; color:#5a5a64; transition:.4s var(--ease);}
.cov .cell.on{border-color:var(--accent); background:rgba(212,255,58,.10); color:var(--accent);}
/* v0.34 — GO : le verdict se verrouille au centre du nuage (lock-on signature) */
.clarify .cl-go{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); opacity:0; pointer-events:none; z-index:2;}
.clarify .cl-go .tx{display:block; font-family:var(--mono); font-weight:700; font-size:19px; letter-spacing:.18em; text-indent:.18em; color:#050505; background:var(--accent); padding:9px 24px; border-radius:6px; box-shadow:0 0 34px rgba(212,255,58,.42);}
.clarify .cl-go .ring{position:absolute; left:-12px; top:-12px; right:-12px; bottom:-12px; inset:-12px; border:1.5px solid rgba(212,255,58,.8); border-radius:10px; opacity:0;}
.clarify .cl-go.show{opacity:1; animation:go-pop .32s cubic-bezier(.2,.8,.2,1);}
.clarify .cl-go.show .ring{animation:go-ring .55s cubic-bezier(.2,.8,.2,1) forwards;}
@keyframes go-pop{0%{transform:translate(-50%,-50%) scale(.7);}70%{transform:translate(-50%,-50%) scale(1.07);}100%{transform:translate(-50%,-50%) scale(1);}}
@keyframes go-ring{0%{inset:-44px; opacity:0;}55%{inset:-8px; opacity:1;}78%{inset:-15px;}100%{inset:-12px; opacity:1;}}
@media(prefers-reduced-motion:reduce){ .clarify .cl-go.show,.clarify .cl-go.show .ring{animation:none; opacity:1;} }

/* v0.33 — couverture : conteneur de données balayé par une scanline */
.dcov{position:relative; display:grid; grid-template-columns:repeat(9,1fr); gap:6px; height:172px; padding:2px 0; margin:12px 0 4px;}
.dcov .dcol{display:flex; flex-direction:column; gap:6px;}
.dcov .dcell{flex:1; border-radius:3px; background:#161619; border:1px solid #242429; transition:background .2s cubic-bezier(.2,.8,.2,1), border-color .2s cubic-bezier(.2,.8,.2,1);}
.dcov .dcol.on .dcell{background:rgba(212,255,58,.12); border-color:rgba(212,255,58,.42);}
.dcov .dlab{font-family:var(--mono); font-size:9px; letter-spacing:.05em; text-align:center; color:#5a5a64; padding-top:3px; transition:color .2s cubic-bezier(.2,.8,.2,1);}
.dcov .dcol.on .dlab{color:var(--accent);}
.dcov .dscan{position:absolute; top:0; bottom:17px; width:2px; margin-left:-1px; background:var(--accent); box-shadow:0 0 9px rgba(212,255,58,.65); opacity:0; transition:opacity .32s cubic-bezier(.2,.8,.2,1);}
.dcov .dscan.run{opacity:1;}
/* vérification */
.veri{display:flex; flex-direction:column; gap:11px;}
.veri .ln{display:flex; align-items:center; gap:11px; font-family:var(--mono); font-size:12.5px; color:#5a5a64; transition:.3s;}
.veri .ln .ck{width:17px; height:17px; border:1px solid #33333a; border-radius:3px; display:flex; align-items:center; justify-content:center; font-size:10px; color:transparent; transition:.3s;}
.veri .ln.ok{color:#e8e8ea;}
.veri .ln.ok .ck{border-color:#5fd97a; color:#5fd97a;}
/* canal */
.canal{display:flex; flex-direction:column; gap:18px; padding:10px 0 4px;}
.canal .wire{display:flex; align-items:center;}
.canal .node{font-family:var(--mono); font-size:11px; color:#c9c9cf; padding:7px 12px; border:1px solid #26262c; border-radius:5px;}
.canal .node.bfo{color:var(--accent); border-color:rgba(212,255,58,.4);}
.canal .path{flex:1; height:2px; background:#26262c; position:relative; margin:0 10px;}
.canal .path .p{position:absolute; top:-2px; left:0; width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 6px var(--accent); animation:wire 2.4s var(--ease) infinite;}
@keyframes wire{0%{left:0; opacity:0;} 12%{opacity:1;} 88%{opacity:1;} 100%{left:100%; opacity:0;}}
.canal .ack{font-family:var(--mono); font-size:11px; color:#5fd97a;}
@media(prefers-reduced-motion:reduce){ .mini .m-top .run .dot,.canal .path .p{animation:none;} }

/* v0.10 — eyebrow vert plus lisible sur les surfaces claires */
.paper{ --eye:#6f8f12; }
[data-theme="light"] .ink{ --eye:#6f8f12; }
[data-theme="light"] .paper{ --eye:var(--accent); }

/* v0.10 — explorateur de domaines (Expertise) */
.explorer{position:relative; display:grid; grid-template-columns:284px 1fr; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--surface); box-shadow:var(--shadow);}
.ex-radio{position:absolute; width:1px; height:1px; opacity:0; pointer-events:none;}
.ex-nav{border-right:1px solid var(--line);}
.ex-item{display:flex; align-items:center; gap:10px; padding:15px 18px; border-bottom:1px solid var(--line); cursor:pointer; transition:background .15s, box-shadow .15s;}
.ex-item:last-child{border-bottom:0;}
.ex-item .k{font-family:var(--mono); font-size:10px; color:var(--text3);}
.ex-item .nm{font-size:15px; font-weight:600; letter-spacing:-.01em;}
.ex-item .verb{font-family:var(--mono); font-size:9.5px; color:var(--text3); text-transform:uppercase; letter-spacing:.06em;}
.ex-item .ct{margin-left:auto; font-family:var(--mono); font-size:10.5px; color:var(--text3); border:1px solid var(--line); border-radius:99px; padding:1px 8px;}
.ex-item:hover{background:var(--surface2);}
.ex-stage{padding:28px 30px; min-height:340px;}
.ex-panel{display:none;}
.ex-panel .ph{display:flex; align-items:center; gap:14px;}
.ex-panel .ph .icn{width:34px; height:34px; color:var(--text);}
.ex-panel .ph .verb{font-family:var(--mono); font-size:11px; color:var(--accent-dim); text-transform:uppercase; letter-spacing:.08em;}
.ex-panel .ph h3{font-size:26px; letter-spacing:-.01em;}
.ex-panel .ph-desc{color:var(--text2); font-size:15px; margin:12px 0 6px; max-width:62ch;}
.pr{padding:15px 0; border-top:1px solid var(--line);}
.pr .pr-top{display:flex; gap:14px; align-items:baseline; flex-wrap:wrap;}
.pr-n{font-family:var(--mono); font-size:14px; color:var(--text); font-weight:500;}
.pr-q{font-family:var(--mono); font-size:12.5px; color:var(--accent-dim);}
.pr-d{color:var(--text2); font-size:14px; margin:7px 0 0; max-width:66ch; line-height:1.55;}
#r-market:checked ~ .ex-nav label[for="r-market"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-market:checked ~ .ex-nav label[for="r-market"] .nm{color:var(--accent-dim);}
#r-market:checked ~ .ex-stage .p-market{display:block;}
#r-offer:checked ~ .ex-nav label[for="r-offer"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-offer:checked ~ .ex-nav label[for="r-offer"] .nm{color:var(--accent-dim);}
#r-offer:checked ~ .ex-stage .p-offer{display:block;}
#r-focus:checked ~ .ex-nav label[for="r-focus"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-focus:checked ~ .ex-nav label[for="r-focus"] .nm{color:var(--accent-dim);}
#r-focus:checked ~ .ex-stage .p-focus{display:block;}
#r-actor:checked ~ .ex-nav label[for="r-actor"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-actor:checked ~ .ex-nav label[for="r-actor"] .nm{color:var(--accent-dim);}
#r-actor:checked ~ .ex-stage .p-actor{display:block;}
#r-opportunity:checked ~ .ex-nav label[for="r-opportunity"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-opportunity:checked ~ .ex-nav label[for="r-opportunity"] .nm{color:var(--accent-dim);}
#r-opportunity:checked ~ .ex-stage .p-opportunity{display:block;}
#r-decision:checked ~ .ex-nav label[for="r-decision"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-decision:checked ~ .ex-nav label[for="r-decision"] .nm{color:var(--accent-dim);}
#r-decision:checked ~ .ex-stage .p-decision{display:block;}
#r-compliance:checked ~ .ex-nav label[for="r-compliance"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-compliance:checked ~ .ex-nav label[for="r-compliance"] .nm{color:var(--accent-dim);}
#r-compliance:checked ~ .ex-stage .p-compliance{display:block;}
#r-continuous:checked ~ .ex-nav label[for="r-continuous"]{background:var(--surface2); box-shadow:inset 3px 0 0 var(--accent);}
#r-continuous:checked ~ .ex-nav label[for="r-continuous"] .nm{color:var(--accent-dim);}
#r-continuous:checked ~ .ex-stage .p-continuous{display:block;}
@media(max-width:760px){ .explorer{grid-template-columns:1fr;} .ex-nav{border-right:0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr;} .ex-item{border-bottom:1px solid var(--line);} .ex-stage{padding:22px;} }

/* v0.10 — Cabinet : chiffres + tuiles techno */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:22px;}
.stat{border-top:2px solid var(--accent); padding-top:16px;}
.stat .n{font-family:var(--sans); font-size:clamp(26px,3.6vw,40px); font-weight:700; color:var(--text); letter-spacing:-.03em; font-variant-numeric:tabular-nums; line-height:1;}
.stat .l{color:var(--text2); font-size:13.5px; margin-top:10px; max-width:24ch;}
.tiles{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.tile{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:26px 24px; box-shadow:var(--shadow);}
.tile .icn{width:30px; height:30px; color:var(--text); margin-bottom:16px;}
.tile h3{font-size:19px; letter-spacing:-.01em;}
.tile p{color:var(--text2); font-size:14.5px; margin:8px 0 0;}
@media(max-width:760px){ .stats{grid-template-columns:1fr 1fr;} .tiles{grid-template-columns:1fr;} }

/* v0.11 — index compact Expertise */
.catalog{columns:2; column-gap:20px;}
.cat{break-inside:avoid; border:1px solid var(--line); border-radius:8px; padding:18px 20px; margin:0 0 16px; background:var(--surface); box-shadow:var(--shadow);}
.cat-h{display:flex; align-items:center; gap:10px; padding-bottom:11px; border-bottom:1px solid var(--line); margin-bottom:4px;}
.cat-h .icn{width:22px; height:22px; color:var(--text); flex:none;}
.cat-h .nm{font-size:16px; font-weight:600; letter-spacing:-.01em;}
.cat-h .v{font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.07em; color:var(--text3);}
.cat-h .ct{margin-left:auto; font-family:var(--mono); font-size:10.5px; color:var(--text3); border:1px solid var(--line); border-radius:99px; padding:1px 8px;}
.cat ul{list-style:none; margin:0; padding:0;}
.cat li{display:flex; gap:10px; align-items:baseline; padding:8px 0; border-bottom:1px solid var(--line);}
.cat li:last-child{border-bottom:0;}
.cat li .a{font-family:var(--mono); font-size:12.5px; color:var(--text); white-space:nowrap; flex:none;}
.cat li .q{font-size:12.5px; color:var(--text2); line-height:1.4;}
@media(max-width:760px){ .catalog{columns:1;} }

/* v0.11 — logo un peu plus grand */
.bar .logo{height:25px;}
.bar .vf svg{width:25px; height:25px;}

/* v0.12 — cartographie radiale + modale */
.carto{max-width:540px; margin:10px auto 0;}
.carto svg{width:100%; height:auto; overflow:visible;}
.c-ring{fill:none; stroke:var(--line);}
.c-tick{stroke:var(--line);}
.c-spoke{stroke:var(--line); stroke-dasharray:2 4;}
.c-hub{fill:var(--surface); stroke:var(--accent);}
.c-hubvf{fill:none; stroke:var(--accent); stroke-width:1.4;}
.c-hubdot{fill:var(--accent);}
.cnode{cursor:pointer;}
.cnode .nd{fill:var(--surface2); stroke:var(--line); stroke-width:1.5; transition:fill .18s, stroke .18s;}
.cnode:hover .nd,.cnode:focus .nd{stroke:var(--accent); fill:color-mix(in srgb,var(--accent) 12%, var(--surface2));}
.cnode:focus{outline:none;}
.cnode .code{fill:var(--text); font-family:var(--mono); font-size:14px; font-weight:600; text-anchor:middle;}
.cnode .lab{fill:var(--text2); font-family:var(--mono); font-size:12.5px; letter-spacing:.02em; transition:fill .18s;}
.cnode:hover .lab,.cnode:focus .lab{fill:var(--text);}
.c-badge{fill:var(--bg); stroke:var(--line);}
.c-badgetxt{fill:var(--accent-dim); font-family:var(--mono); font-size:10px; font-weight:600; text-anchor:middle;}

.cmodal{position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:24px;}
.cmodal.open{display:flex;}
.cm-back{position:absolute; inset:0; background:rgba(0,0,0,.62); backdrop-filter:blur(3px);}
.cm-card{position:relative; background:var(--bg); border:1px solid var(--line); border-radius:12px;
  max-width:600px; width:100%; max-height:82vh; overflow:auto; padding:30px 32px 26px; box-shadow:0 30px 90px rgba(0,0,0,.55);}
.cm-x{position:absolute; top:14px; right:18px; background:transparent; border:0; color:var(--text2); font-size:24px; line-height:1; cursor:pointer;}
.cm-x:hover{color:var(--text);}
.cm-h{display:flex; align-items:center; gap:14px; margin-bottom:6px;}
.cm-h .icn{width:34px; height:34px; color:var(--text); flex:none;}
.cm-h .verb{font-family:var(--mono); font-size:11px; color:var(--accent-dim); text-transform:uppercase; letter-spacing:.08em;}
.cm-h h3{font-size:26px; letter-spacing:-.01em;}
.cm-list{margin-top:12px;}
.cm-a{padding:15px 0; border-top:1px solid var(--line);}
.cm-a .cm-top{display:flex; gap:12px; align-items:baseline; flex-wrap:wrap;}
.cm-a .a{font-family:var(--mono); font-size:14px; color:var(--text); font-weight:500;}
.cm-a .q{font-family:var(--mono); font-size:12.5px; color:var(--accent-dim);}
.cm-a p{color:var(--text2); font-size:14px; margin:7px 0 0; line-height:1.55;}

/* v0.14 — cartographie : radar (collant) à gauche, les 8 domaines toujours
   affichés à droite ; au survol, la fiche se déplie (mini-chapitre) + le nœud
   correspondant s'allume sur le radar. */
.carto-wrap{display:grid; grid-template-columns:.9fr 1.1fr; gap:46px; align-items:start;}
.carto-wrap .carto{position:sticky; top:88px; max-width:none; margin:0;}
.carto-right{display:flex; flex-direction:column;}
.carto-list{display:flex; flex-direction:column;}
/* Les rangées ne changent jamais de taille : aucun décalage au survol. */
.cx{display:flex; align-items:baseline; gap:12px; padding:13px 14px; border-top:1px solid var(--line);
  border-left:2px solid transparent; cursor:default; transition:background .2s var(--ease), border-color .2s;}
.cx:first-child{border-top:0;}
.cx:focus{outline:none;}
.cx-code{font-family:var(--mono); font-size:10.5px; font-weight:600; letter-spacing:.06em; color:var(--accent-dim);
  border:1px solid var(--line); border-radius:4px; padding:2px 7px; flex:none;}
.cx-nm{font-size:17px; font-weight:600; letter-spacing:-.01em; color:var(--text); transition:color .18s;}
.cx-verb{margin-left:auto; font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.09em; color:var(--text3); transition:color .18s;}
.cx.on{background:color-mix(in srgb,var(--accent) 7%, transparent); border-left-color:var(--accent);}
.cx.on .cx-nm{color:var(--accent-dim);}
.cx.on .cx-verb{color:var(--text2);}
/* Panneau à hauteur fixe : le mini-chapitre change à l'intérieur, rien ne bouge. */
.cx-panel{margin-top:22px; height:190px; padding:22px 24px; border:1px solid var(--line); border-radius:10px;
  background:var(--surface); box-shadow:var(--shadow); overflow:hidden; display:flex; flex-direction:column; justify-content:center;}
.cx-panel .ph{display:flex; align-items:center; gap:13px; margin-bottom:12px;}
.cx-panel .ph .icn{width:28px; height:28px; color:var(--text); flex:none;}
.cx-panel .ph .nm{font-size:20px; font-weight:600; letter-spacing:-.01em;}
.cx-panel .ph .verb{margin-left:auto; font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.09em; color:var(--accent-dim);}
.cx-panel .desc{color:var(--text2); font-size:14px; line-height:1.6; margin:0;}
/* Radar illustratif : non interactif (piloté par la liste), il s'allume en écho. */
.cnode{pointer-events:none;}
.cnode.active .nd{stroke:var(--accent); fill:color-mix(in srgb,var(--accent) 16%, var(--surface2)); stroke-width:2;}
.cnode.active .lab{fill:var(--text);}
.cnode.active .code{fill:var(--text);}
@media(max-width:820px){
  .carto-wrap{grid-template-columns:1fr; gap:22px;}
  .carto-wrap .carto{position:static; max-width:400px; margin:0 auto;}
  .cx-panel{height:auto; min-height:150px;}
}

/* v0.13 — Cabinet : récit d'origine designé */
.story{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start;}
.story .lead{font-size:clamp(23px,2.9vw,33px); font-weight:600; letter-spacing:-.02em; line-height:1.22; color:var(--text); margin:0;}
.story-body p{color:var(--text2); font-size:16px; margin:0 0 16px;}
.story-body p:last-of-type{margin-bottom:0;}
.sig{margin-top:22px; padding-top:16px; border-top:1px solid var(--line);}
.sig .name{font-family:"IBM Plex Serif",Georgia,serif; font-style:italic; font-size:19px; color:var(--text);}
.sig .role{display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--text3); margin-top:5px;}
@media(max-width:760px){ .story{grid-template-columns:1fr; gap:22px;} }

/* v0.13 — tuiles techno : icônes un peu plus petites */
.tile .icn{width:25px; height:25px;}

/* v0.13 — Contact : plus clean et aéré */
.contact-cols{gap:56px;}
.contact-cols .form-grid{gap:22px;}
.contact-cols .field input,.contact-cols .field textarea,.contact-cols .field select{padding:13px 15px;}
.aside .blk{padding-top:18px; margin-bottom:30px;}
.aside .blk h3{font-size:18px;}

/* =====================================================================
   v0.14 — lisibilité (footer · nav · labels) · lime cohérent ·
           flux matriciel · easter egg · bandeau cookies
   ===================================================================== */

/* ---- Fond clair en GRIS (plus foncé que le crème) + lime VIF sur les traits,
   bordures et mires. Les textes de label restent en gris très foncé (lisibles).
   S'applique aux panneaux .paper et, en négatif, aux .ink devenus clairs. */
.paper, [data-theme="light"] .ink{
  --bg:#eae7df; --surface:#f3f0ea; --surface2:#dcd8cd; --line:#c9c5b8;
  --text:#16150f; --text2:#4d4a40; --text3:#7c7869;
  --accent:#d4ff3a; --accent-dim:#3a3a30; --eye:#33332b; --motif-soft:rgba(0,0,0,.055);
}
/* En négatif, un panneau .paper devient sombre : lime vif sur fond sombre.
   Gris de texte remontés pour être bien lisibles sur le noir. */
[data-theme="light"] .paper{
  --bg:#050505; --surface:#0c0c0d; --surface2:#16161a; --line:#26262c;
  --text:#fafaf7; --text2:#9a9aa3; --text3:#74747e;
  --accent:#d4ff3a; --accent-dim:#a3c722; --eye:#d4ff3a; --motif-soft:rgba(255,255,255,.10);
}
/* Accent italique de titre : olive foncé lisible sur gris, lime vif sur sombre. */
.paper .li,[data-theme="light"] .ink .li{ color:#2f3a10; }
[data-theme="light"] .paper .li{ color:var(--accent); }
/* Points d'accent dans les icônes SVG : olive foncé sur les tuiles claires. */
.paper .icn svg [fill="var(--accent)"],[data-theme="light"] .ink .icn svg [fill="var(--accent)"]{ fill:#4f6d0a; }
.paper .icn svg [stroke="var(--accent)"],[data-theme="light"] .ink .icn svg [stroke="var(--accent)"]{ stroke:#4f6d0a; }
/* Le bouton primaire garde le lime vif + texte sombre sur les deux thèmes. */
.btn.primary{ background:var(--accent); border-color:var(--accent); color:#0c0c0d; }
.btn.primary:hover{ background:#bdea2c; border-color:#bdea2c; }

/* ---- Nav d'en-tête : un cran de contraste en plus ---- */
nav.main a{ color:var(--text); opacity:.7; }
nav.main a:hover,nav.main a.active,nav.main a.opt.active{ opacity:1; }
.nav-cta{ opacity:1; }

/* ---- Footer plus lisible (texte + poids) ---- */
footer{ color:var(--text2); }
footer .sig{ color:var(--text); font-weight:400; }
.foot-links a,.foot-meta,.legal-links a{ color:var(--text2); font-weight:400; }
.foot-links a:hover,.legal-links a:hover{ color:var(--text); }

/* ---- Logo d'en-tête : à hauteur du viseur, un peu plus grand ---- */
.bar .logo{ height:28px; }
.bar .vf svg{ width:28px; height:28px; }

/* ---- Cabinet : tuiles techno, icônes nettement plus petites ----
   (.icn est un <span> inline : sans display:block, la largeur était ignorée
   et le SVG remplissait toute la tuile) */
.tile .icn{ display:block; width:20px; height:20px; margin-bottom:16px; }
.tile{ padding:24px 22px; }

/* =====================================================================
   Flux matriciel (accueil) : le bruit du marché se recompose en décision
   ===================================================================== */
.matrix{position:relative; overflow:hidden; border:1px solid #26262c; border-radius:12px;
  background:radial-gradient(130% 100% at 50% -10%,#101013,#060607 70%);
  min-height:360px; display:flex; align-items:center; justify-content:center;
  box-shadow:0 24px 70px rgba(0,0,0,.5);}
.mx-rain{position:absolute; inset:0; display:flex; overflow:hidden; pointer-events:none;
  mask-image:linear-gradient(180deg,transparent,#000 14%,#000 62%,transparent);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 14%,#000 62%,transparent);}
.mx-col{flex:1 0 auto; font-family:var(--mono); font-size:14px; line-height:1.32;
  text-align:center; white-space:pre-line; color:rgba(212,255,58,.32);
  animation:mxfall linear infinite; will-change:transform;}
.mx-col b{color:var(--accent); font-weight:400; text-shadow:0 0 8px rgba(212,255,58,.7);}
@keyframes mxfall{from{transform:translateY(-52%);} to{transform:translateY(0);}}
.mx-read{position:relative; z-index:2; text-align:center; min-width:min(340px,80%);
  padding:26px 30px; background:rgba(6,6,7,.62); backdrop-filter:blur(2px);
  border:1px solid #24242a; border-radius:10px;}
.mx-line{font-family:var(--mono); font-size:13px; letter-spacing:.14em; text-transform:uppercase;
  color:#7f7f88; margin:0 0 11px; min-height:1.1em; transition:color .3s;}
.mx-line .ck{color:#3a3a42; margin-right:9px;}
.mx-line.done{color:#c9c9cf;}
.mx-line.done .ck{color:var(--accent);}
.mx-verdict{margin-top:16px; padding-top:16px; border-top:1px solid #1f1f24;}
.mx-verdict .go{display:inline-flex; align-items:center; gap:9px; font-family:var(--sans);
  font-weight:700; font-size:19px; letter-spacing:.03em; color:#5fd97a;
  opacity:0; transform:translateY(6px); transition:opacity .6s var(--ease), transform .6s var(--ease);}
.mx-verdict.on .go{opacity:1; transform:none;}
.matrix-wrap{max-width:620px; margin:0 auto;}
@media(prefers-reduced-motion:reduce){ .mx-col{animation:none;} }

/* =====================================================================
   Easter egg : Blackformance ⇄ Whiteformance (juste pour rigoler)
   ===================================================================== */
.ee-name{cursor:pointer; transition:color .2s;}
.ee-name:hover{color:var(--accent-dim);}

/* =====================================================================
   Curseur viseur : au repos, le curseur se transforme en mire
   ===================================================================== */
.vf-cursor{position:fixed; left:0; top:0; width:44px; height:44px; margin:-22px 0 0 -22px;
  pointer-events:none; z-index:400; color:var(--accent); opacity:0; will-change:transform;
  transition:opacity .22s var(--ease), width .22s var(--ease), height .22s var(--ease);
  filter:drop-shadow(0 0 2px rgba(0,0,0,.55));}
.vf-cursor svg{display:block; width:100%; height:100%;}
.vf-cursor .rc{transform-box:fill-box; transform-origin:center; animation:lockon 3.2s var(--ease) infinite;}
.vf-cursor.show{opacity:.92;}
body.vf-idle{cursor:none;}
@media(pointer:coarse){ .vf-cursor{display:none;} }
@media(prefers-reduced-motion:reduce){ .vf-cursor .rc{animation:none;} }

/* =====================================================================
   Bandeau cookies (fenêtre, pas une page) + fenêtre de réglages
   ===================================================================== */
.ck-banner{position:fixed; left:0; right:0; bottom:0; z-index:300;
  transform:translateY(130%); transition:transform .45s var(--ease);
  background:#0a0a0b; border-top:1px solid #2b2b31; color:#d7d7db;
  box-shadow:0 -18px 50px rgba(0,0,0,.5);}
.ck-banner.show{transform:none;}
.ck-in{max-width:var(--maxw); margin:0 auto; padding:18px 28px;
  display:flex; align-items:center; gap:26px; flex-wrap:wrap;}
.ck-ico{flex:none; color:var(--accent);}
.ck-ico svg{display:block; width:26px; height:26px;}
.ck-txt{flex:1; min-width:250px; font-family:var(--sans); font-size:13.5px; line-height:1.55; color:#a6a6ae;}
.ck-txt b{display:block; font-size:14px; font-weight:600; letter-spacing:.02em; color:#fafaf7; margin-bottom:4px; font-family:var(--mono); text-transform:uppercase;}
.ck-txt a{color:var(--accent); border-bottom:1px solid rgba(212,255,58,.4);}
.ck-acts{display:flex; gap:12px; flex-wrap:wrap;}
.ck-btn{font-family:var(--mono); font-size:12.5px; letter-spacing:.02em; padding:11px 20px;
  border-radius:4px; cursor:pointer; border:1px solid #34343b; background:transparent;
  color:#d7d7db; transition:.15s; white-space:nowrap;}
.ck-btn:hover{border-color:#5a5a64; color:#fff;}
.ck-btn.primary{background:var(--accent); color:#050505; border-color:var(--accent); font-weight:600;}
.ck-btn.primary:hover{background:#bdea2c; border-color:#bdea2c; color:#050505;}
@media(max-width:640px){ .ck-in{gap:16px;} .ck-acts{width:100%;} .ck-btn{flex:1;} }

.ck-modal{position:fixed; inset:0; z-index:320; display:none; align-items:center; justify-content:center; padding:24px;}
.ck-modal.open{display:flex;}
.ck-back{position:absolute; inset:0; background:rgba(0,0,0,.66); backdrop-filter:blur(3px);}
.ck-card{position:relative; width:100%; max-width:560px; max-height:86vh; overflow:auto;
  background:#0a0a0b; border:1px solid #26262c; border-radius:12px; padding:28px 30px 24px;
  color:#e8e8ea; box-shadow:0 30px 90px rgba(0,0,0,.6);}
.ck-x{position:absolute; top:14px; right:18px; background:transparent; border:0; color:#8a8a94;
  font-size:24px; line-height:1; cursor:pointer;}
.ck-x:hover{color:#fafaf7;}
.ck-eyebrow{font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); margin:0 0 8px;}
.ck-card h3{font-family:var(--sans); font-size:23px; letter-spacing:-.01em; color:#fafaf7; margin:0 0 6px;}
.ck-card .intro{font-family:var(--sans); font-size:13.5px; line-height:1.55; color:#8a8a94; margin:0 0 18px; max-width:52ch;}
.ck-card .intro a{color:var(--accent); border-bottom:1px solid rgba(212,255,58,.4);}
.ck-cat{display:flex; gap:18px; align-items:flex-start; padding:16px 0; border-top:1px solid #1f1f24;}
.ck-cat .info{flex:1;}
.ck-cat .nm{font-family:var(--sans); font-size:15px; font-weight:600; color:#fafaf7;}
.ck-cat .de{font-family:var(--sans); font-size:13px; line-height:1.5; color:#8a8a94; margin-top:5px;}
.ck-sw{position:relative; width:44px; height:25px; flex:none; margin-top:2px;}
.ck-sw input{position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; z-index:1;}
.ck-sw .track{position:absolute; inset:0; background:#26262c; border:1px solid #34343b; border-radius:99px; transition:.2s;}
.ck-sw .track::after{content:""; position:absolute; top:3px; left:3px; width:17px; height:17px; border-radius:50%; background:#8a8a94; transition:.2s;}
.ck-sw input:checked + .track{background:rgba(212,255,58,.22); border-color:rgba(212,255,58,.55);}
.ck-sw input:checked + .track::after{background:var(--accent); transform:translateX(19px);}
.ck-sw input:disabled{cursor:not-allowed;}
.ck-sw input:disabled + .track{opacity:.55;}
.ck-actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:22px; padding-top:20px; border-top:1px solid #1f1f24;}
.ck-actions .ck-btn{flex:1; text-align:center; justify-content:center;}
@media(max-width:520px){ .ck-actions{flex-direction:column;} }

/* =====================================================================
   v0.14c — Expertise : les 8 domaines forment un anneau autour du cercle
   (grille 3×3, cartographie au centre). Au survol d'une carte OU de son nœud,
   la carte grandit fortement pour se lire, et le nœud s'allume.
   ===================================================================== */
.xp-ring{position:relative; display:grid;
  grid-template-columns:1fr minmax(300px,420px) 1fr;
  grid-template-areas:"cn mk of" "co circle fo" "de op ac";
  gap:16px 18px; align-items:center; justify-items:stretch;}
.xp-ring .xp-carto{grid-area:circle; align-self:center; z-index:1;}
.xp-carto svg{display:block; width:100%; height:auto; overflow:visible;}
.dom-card{background:var(--surface); border:1px solid var(--line); border-radius:10px;
  padding:18px 20px; box-shadow:var(--shadow); min-height:150px; display:flex; flex-direction:column;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .18s, background .18s;}
/* Survol de la carte ou de son nœud (.hot) : mise en avant sobre (pas de zoom). */
.dom-card:hover,.dom-card:focus-within,.dom-card.hot{border-color:var(--accent);
  background:color-mix(in srgb,var(--accent) 8%, var(--surface));
  transform:translateY(-3px); z-index:2; box-shadow:0 12px 30px rgba(0,0,0,.12); outline:none;}
.dom-card .dc-h{display:flex; align-items:center; gap:12px; margin-bottom:11px;}
.dom-card .dc-h .icn{display:block; width:26px; height:26px; color:var(--text); flex:none;}
.dom-card .dc-nm{font-size:18px; font-weight:600; letter-spacing:-.01em; color:var(--text);}
.dom-card .dc-verb{margin-left:auto; font-family:var(--mono); font-size:9.5px; text-transform:uppercase;
  letter-spacing:.09em; color:var(--text3);}
.dom-card .dc-desc{color:var(--text2); font-size:13.5px; line-height:1.55; margin:0;}
/* Nœuds du cercle rendus interactifs (pilotent aussi l'agrandissement). */
.xp-ring .cnode{pointer-events:auto; cursor:pointer;}
@media(max-width:820px){
  .xp-ring{display:flex; flex-direction:column; gap:14px;}
  .xp-ring .xp-carto{order:-1; max-width:330px; margin:0 auto 6px; align-self:center;}
  .dom-card:hover,.dom-card:focus-within,.dom-card.hot{transform:none;}
}

/* v0.14c — petites icônes sur les étapes de la méthode (accueil) */
.step .s-ico{display:block; width:24px; height:24px; color:var(--text); margin-bottom:15px;}
.step .s-ico svg{display:block; width:100%; height:100%;}

/* =====================================================================
   v0.15 — flux de processus, domaines lisibles/non cliquables, notion de
   grandeur des tiers, centre d'Expertise discret, verdict en lime.
   ===================================================================== */

/* ---- Processus : cartes reliées par des flèches avec un flux animé ---- */
.process{display:flex; align-items:stretch; gap:6px;}
.process > .step, .process > .tile{flex:1 1 0; min-width:0;}
.p-arrow{flex:0 0 auto; align-self:center; display:flex; align-items:center; color:var(--accent-dim);}
.p-arrow svg{width:36px; height:20px; overflow:visible;}
.p-dot{fill:var(--accent);}
@keyframes p-flow{0%{transform:translateX(0);opacity:0} 12%{opacity:1} 80%{opacity:1} 100%{transform:translateX(30px);opacity:0}}
.p-dot{animation:p-flow 2.2s var(--ease) infinite;}
@media(prefers-reduced-motion:reduce){ .p-dot{animation:none;} }
@media(max-width:760px){
  .process{flex-direction:column; gap:4px;}
  .p-arrow{transform:rotate(90deg); padding:4px 0;}
}

/* ---- Domaines (accueil) : lisibles, et NON cliquables (pas d'effet survol) ---- */
.dom{cursor:default;}
.dom:hover{border-color:var(--line); transform:none;}
.dom .tx span{font-family:var(--sans); font-size:12px; letter-spacing:0; text-transform:none; color:var(--text2); margin-top:3px;}
@media(max-width:820px){ .dom-strip{grid-template-columns:repeat(2,1fr);} }

/* ---- Trois profondeurs : barres ascendantes = petit / moyen / grand ---- */
.t-size{display:flex; align-items:flex-end; gap:5px; height:22px; margin-bottom:16px;}
.t-size i{width:8px; border-radius:1px; background:var(--line); display:block;}
.t-size i:nth-child(1){height:9px;}
.t-size i:nth-child(2){height:15px;}
.t-size i:nth-child(3){height:22px;}
.tier.s1 .t-size i:nth-child(1){background:var(--accent);}
.tier.s2 .t-size i:nth-child(-n+2){background:var(--accent);}
.tier.s3 .t-size i{background:var(--accent);}

/* ---- Expertise : centre discret (mire) au lieu du radar ---- */
.xp-ring{grid-template-columns:1fr minmax(150px,230px) 1fr;}
.xp-carto .xp-mire{display:block; width:100%; height:auto; max-width:118px; margin:0 auto;}
.xp-mire .m-ring{fill:none; stroke:var(--line); stroke-width:1.5;}
.xp-mire .m-vf{fill:none; stroke:var(--accent-dim); stroke-width:2;}
.xp-mire .m-dot{fill:var(--accent); transform-box:fill-box; transform-origin:center; animation:lockon 3.2s var(--ease) infinite;}
@media(prefers-reduced-motion:reduce){ .xp-mire .m-dot{animation:none;} }

/* ---- Verdict du flux matriciel : lime (au lieu du vert) ---- */
.mx-verdict .go{color:var(--accent);}

/* v0.15 — date de mise à jour en tête des pages légales */
.prose .doc-date{font-family:var(--mono); font-size:12px; letter-spacing:.04em; color:var(--text3);
  margin:0 0 26px; padding-bottom:16px; border-bottom:1px solid var(--line);}

/* =====================================================================
   v0.16 — processus en chevrons (flèches) + centre logique de l'Expertise
   ===================================================================== */

/* ---- Chevrons : chaque étape est une flèche, avec un léger espace ---- */
.process.chev{display:flex; align-items:stretch; gap:8px;}
.process.chev > .step, .process.chev > .tile{
  flex:1 1 0; min-width:0; background:var(--surface2); border:0; box-shadow:none;
  padding:24px 44px 24px 46px;
  clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%, 22px 50%);
}
.process.chev > :first-child{
  clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%);
  padding-left:26px;
}
.process.chev .bkt::before, .process.chev .bkt::after{display:none;}
.process.chev .step .n, .process.chev .tile h3{position:relative;}
@media(max-width:760px){
  .process.chev{flex-direction:column; gap:6px;}
  .process.chev > .step, .process.chev > .tile,
  .process.chev > :first-child{
    padding:22px 24px 34px;
    clip-path:polygon(0 0, 100% 0, 100% calc(100% - 18px), 50% 100%, 0 calc(100% - 18px));
  }
}

/* ---- Centre de l'Expertise : la décision, point de convergence ---- */
.xp-center{display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center;}
.xp-center .xp-mire{max-width:90px;}
.xp-c-lbl{font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-dim);}
.xp-c-sub{font-family:var(--mono); font-size:10px; letter-spacing:.06em; color:var(--text3);}

/* =====================================================================
   v0.17 — ÉCHELLE TYPO CENTRALISÉE (source unique) + fond clair plus gris
   + chevrons avec relief + gris des widgets plus lisibles
   ===================================================================== */

/* ---- Tokens de taille de texte : à régler ICI, s'appliquent partout ---- */
:root{
  --fs-eyebrow:11.5px;   /* eyebrows // */
  --fs-label:11px;       /* micro-labels mono (verbe, code, niveau) */
  --fs-meta:13px;        /* méta secondaire */
  --fs-body:15.5px;      /* TOUTES les descriptions de cartes/blocs */
  --fs-lead:18px;        /* chapeaux */
  --fs-h3:20px;          /* titres de cartes */
}

/* ---- Descriptions unifiées (même taille partout) ---- */
.step p, .tile p, .dom-card .dc-desc, .why .item p, .tier p, .aside .blk p,
.generic .g p, .card-fam .desc{ font-size:var(--fs-body); line-height:1.55; }
/* ---- Titres de cartes unifiés ---- */
.step h3, .tile h3, .dom-card .dc-nm, .tier h3, .aside .blk h3{ font-size:var(--fs-h3); }
/* ---- Chapeaux / lede unifiés ---- */
.sec-head p, .page-hero p.lede, .hero p.lede{ font-size:var(--fs-lead); }

/* ---- Fond clair : gris neutre (moins crème), pour faire ressortir le lime ---- */
.paper, [data-theme="light"] .ink{
  --bg:#dcdbd5; --surface:#e8e7e1; --surface2:#cdccc4; --line:#b8b7ae;
  --text:#161614; --text2:#494940; --text3:#79776c;
}

/* ---- Chevrons : un peu de relief (dégradé + ombre portée), moins plats ---- */
.process.chev > .step, .process.chev > .tile{
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface2) 78%, #fff) 0%, var(--surface2) 100%);
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.14));
}
[data-theme="dark"] .ink .process.chev > .tile, .ink .process.chev > .tile{
  background:linear-gradient(180deg, color-mix(in srgb,var(--surface2) 68%, #fff) 0%, var(--surface2) 100%);
}
.process.chev .step h3{ margin-top:8px; }

/* ---- Widgets sombres : gris trop foncés remontés (lisibles sur noir) ---- */
.flux .c-foot, .mini .m-foot, .constel .c-foot{ color:#96969f; }
.flux .c-foot b, .mini .m-foot b, .constel .c-foot b{ color:#cbcbd1; }
.sim .sub, .sim-x, .sim-cost .lab, .sim-top{ color:#8b8b95; }
.silo .lab, .silo .pv{ color:#a6a6ae; }

/* v0.17 — page 404 */
.err{position:relative; overflow:hidden; min-height:calc(100vh - 160px); display:flex; align-items:center;}
.err .inner{position:relative; z-index:1; max-width:640px; margin:0 auto; text-align:center; padding:80px 0;}
.err-mire{display:inline-block; width:72px; height:72px; color:var(--text); margin-bottom:6px;}
.err-mire svg{display:block; width:100%; height:100%;}
.err-mire .core{transform-box:fill-box; transform-origin:center; animation:lockon 3.2s var(--ease) infinite;}
.err h1{font-size:clamp(32px,5vw,54px); margin-top:8px;}
.err .cta-row{justify-content:center;}
@media(prefers-reduced-motion:reduce){ .err-mire .core{animation:none;} }

/* =====================================================================
   v0.18 — chevrons sans dégradé (plus contrastés, en-tête groupé) ·
   registre des domaines (index éditorial disruptif) · compteurs à suffixe ·
   panneau Contact en terminal sombre
   ===================================================================== */

/* ---- Chevrons : fond plat, sans bordure ni ombre, nettement contrasté ---- */
.process.chev > .step, .process.chev > .tile{
  background:var(--surface2); border:0; box-shadow:none; filter:none;
}
/* clair : puce sensiblement plus sombre que le fond */
.paper .process.chev > .step, .paper .process.chev > .tile,
[data-theme="light"] .ink .process.chev > .step, [data-theme="light"] .ink .process.chev > .tile{
  background:#bebdb2;
}
/* sombre : puce sensiblement plus claire que le fond */
[data-theme="dark"] .ink .process.chev > .step, [data-theme="dark"] .ink .process.chev > .tile,
.ink .process.chev > .step, .ink .process.chev > .tile{
  background:#1d1d23;
}
/* En-tête du chevron : icône + label sur une même ligne (plus « nu ») */
.process.chev .s-top{display:flex; align-items:center; gap:11px; margin-bottom:14px;}
.process.chev .s-top > .icn, .process.chev .s-top > .s-ico{
  display:block; width:20px; height:20px; margin:0; flex:none; color:var(--text);
}
.process.chev .s-top .n{margin:0; font-family:var(--mono); font-size:var(--fs-label);
  letter-spacing:.12em; color:var(--accent-dim);}
.process.chev .s-top h3{margin:0; font-size:var(--fs-h3);}
.process.chev .step h3{margin:0 0 8px;}
.process.chev .step p, .process.chev .tile p{margin:0;}

/* ---- Registre des domaines : un index éditorial, une ligne par domaine ---- */
.dom-index{border-top:1px solid var(--line); margin-top:4px;}
.dom-index .dom-row{position:relative; display:grid; align-items:center;
  border-bottom:1px solid var(--line); transition:background .25s ease; outline:none;}
.dom-index .dom-row::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--accent); transform:scaleY(0); transform-origin:top;
  transition:transform .3s var(--ease);}
.dom-index .dom-row:hover::before, .dom-index .dom-row:focus-within::before{transform:scaleY(1);}
.dom-index .dom-row:hover, .dom-index .dom-row:focus-within{background:var(--surface);}
.dr-code{font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.14em; color:var(--accent-dim);}
.dr-nm{font-weight:600; letter-spacing:-.02em; color:var(--text); transition:transform .3s var(--ease);}
.dom-index .dom-row:hover .dr-nm, .dom-index .dom-row:focus-within .dr-nm{transform:translateX(4px);}
.dr-gl{color:var(--text2); font-size:var(--fs-body);}
.dr-ct{font-family:var(--mono); font-size:11px; letter-spacing:.05em; color:var(--text3);
  text-transform:uppercase; text-align:right; white-space:nowrap;}
.dr-ct i{font-style:normal;}

/* Version compacte (Accueil) : code · nom · glose · compte */
.dom-index:not(.xp) .dom-row{grid-template-columns:56px minmax(150px,auto) 1fr;
  gap:24px; padding:20px 16px;}
.dom-index:not(.xp) .dr-nm{font-size:clamp(22px,2.6vw,32px);}

/* Version détaillée (Expertise) : index · code · nom+verbe+desc · compte */
.dom-index.xp .dom-row{grid-template-columns:40px 44px 1fr;
  gap:22px; padding:24px 16px; align-items:start;}
.dom-index.xp .dr-ix{font-family:var(--mono); font-size:12px; color:var(--text3); padding-top:8px;}
.dom-index.xp .dr-code{padding-top:8px;}
.dr-main .dr-h{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; margin-bottom:8px;}
.dom-index.xp .dr-nm{font-size:clamp(24px,3vw,36px);}
.dr-verb{font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-dim);}
.dom-index.xp .dr-desc{color:var(--text2); font-size:var(--fs-body); line-height:1.55; margin:0; max-width:64ch;}
.dom-index.xp .dr-ct{padding-top:12px;}
.dom-index.xp .dr-ct b{display:block; font-size:24px; color:var(--text); font-weight:600; letter-spacing:-.02em;}

/* Ligne de convergence sous le registre */
.dom-foot{display:flex; align-items:center; justify-content:center; gap:12px; text-align:center;
  margin:34px auto 0; font-size:var(--fs-body); color:var(--text2);}
.dom-foot .df-mire{display:inline-flex; width:26px; height:26px; color:var(--text); flex:none;}
.dom-foot .df-mire svg{width:100%; height:100%;}
.dom-foot b{color:var(--text); font-weight:600;}

@media(max-width:680px){
  .dom-index:not(.xp) .dom-row{grid-template-columns:48px 1fr; gap:4px 16px; padding:16px 12px;}
  .dom-index:not(.xp) .dr-code{grid-row:1 / 3; align-self:center;}
  .dom-index:not(.xp) .dr-ct{grid-column:2; text-align:left;}
  .dom-index.xp .dom-row{grid-template-columns:40px 1fr; gap:4px 14px; padding:18px 12px;}
  .dom-index.xp .dr-ix{display:none;}
  .dom-index.xp .dr-code{grid-row:1 / 3; padding-top:0; align-self:start;}
  .dom-index.xp .dr-ct{grid-column:1 / 3; text-align:left; padding-top:8px;}
  .dom-index.xp .dr-ct b{display:inline; font-size:16px; margin-right:6px;}
}

/* ---- Contact : aside en colonne éditoriale (raccord avec le reste du site, pas d'encadré) ---- */
.aside{background:transparent; border:0; border-left:1px solid var(--line); border-radius:0;
  box-shadow:none; padding:2px 0 2px 40px; color:var(--text); align-self:start;}
.aside .a-lead{margin:0 0 20px;}
.aside .a-lead h3{font-size:20px; letter-spacing:-.01em; margin:8px 0 0; color:var(--text);}
.aside .blk{border-top:1px solid var(--line); padding:18px 0 0; margin:0 0 22px;}
.aside .blk:last-child{margin-bottom:0;}
.aside .blk .k{display:block; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-dim); margin-bottom:7px;}
.aside .blk h3{color:var(--text); font-size:18px; margin:0 0 6px; font-weight:600; letter-spacing:-.005em;}
.aside .blk p{color:var(--text2); font-size:15px; line-height:1.55; margin:0;}
.aside .blk a{color:var(--text); border-bottom:1px solid var(--accent-dim);}
.aside .blk a:hover{color:var(--accent-dim); border-color:var(--accent-dim);}
@media(max-width:820px){ .aside{border-left:0; padding-left:0; border-top:1px solid var(--line); padding-top:28px; margin-top:8px;} }

/* =====================================================================
   v0.18b — navigation mobile standard (bouton menu + panneau déroulant)
   Le bouton .nav-toggle est injecté par app.js ; il apparaît < 680px.
   ===================================================================== */
.nav-toggle{display:none;}

@media(max-width:680px){
  /* Bouton hamburger */
  .nav-toggle{display:inline-flex; flex-direction:column; justify-content:center; gap:5px;
    width:44px; height:40px; padding:0 10px; background:transparent;
    border:1px solid var(--line); border-radius:9px; cursor:pointer; flex:none;}
  .nav-toggle span{display:block; height:1.5px; width:100%; background:var(--text);
    transition:transform .25s var(--ease), opacity .2s;}
  body.nav-open .nav-toggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
  body.nav-open .nav-toggle span:nth-child(2){opacity:0;}
  body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}

  /* La barre : marque à gauche, hamburger à droite */
  .bar{gap:12px;}

  /* nav.main devient un panneau déroulant plein largeur sous le header */
  nav.main{position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--bg); border-bottom:1px solid var(--line);
    box-shadow:0 18px 40px rgba(0,0,0,.28);
    padding:6px 0 14px; transform:translateY(-10px); opacity:0; pointer-events:none;
    transition:opacity .2s ease, transform .2s var(--ease);
    max-height:calc(100vh - 66px); overflow:auto; z-index:49;}
  body.nav-open nav.main{opacity:1; transform:none; pointer-events:auto;}

  /* Liens : pleine largeur, réaffichés */
  nav.main .opt{display:block;}
  nav.main a{margin-left:0; padding:15px 28px; font-size:15px; letter-spacing:.02em;
    color:var(--text2); border-bottom:1px solid var(--line);}
  nav.main a:last-of-type{border-bottom:0;}
  nav.main a.active,nav.main a.opt.active{color:var(--text); padding-bottom:15px; position:relative;}
  nav.main a.active{border-bottom:1px solid var(--line);}
  nav.main a.active::before{content:""; position:absolute; left:0; top:12px; bottom:12px;
    width:3px; background:var(--accent);}
  .nav-cta{color:var(--accent-dim)!important;}

  /* Outils (langue + négatif) en bas du panneau */
  .tools{margin-left:0; padding:16px 28px 4px; gap:16px; justify-content:flex-start;}
}

/* =====================================================================
   Variante « confiance » — brique Preuve (décisions réellement éclairées)
   ===================================================================== */
.proofs{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.proof{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:24px 22px;}
.proof .pf-tag{font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-dim);}
.proof .pf-q{font-size:var(--fs-h3); font-weight:600; letter-spacing:-.01em; color:var(--text); margin:12px 0;}
.proof .pf-o{color:var(--text2); font-size:var(--fs-body); line-height:1.55; margin:0; padding-top:12px; border-top:1px solid var(--line);}
@media(max-width:760px){ .proofs{grid-template-columns:1fr;} }

/* =====================================================================
   Variante « confiance » v0.21 — offre par profondeur de donnée,
   bande de corpus, veille continue, placeholders à remplir
   ===================================================================== */

/* Jetons à remplir avant publication */
.ph{color:var(--accent-dim); font-style:normal;}

/* ---- Trois profondeurs : niveaux définis par les sources mobilisées ---- */
.depths{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:8px;}
.depth{background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:24px 22px; display:flex; flex-direction:column;}
.depth .dp-h{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px;}
.depth .dp-h .t-size{margin-bottom:0;}
.depth .lvl{font-family:var(--mono); color:var(--accent-dim); font-size:12px; letter-spacing:.1em; text-transform:uppercase;}
.depth h3{font-size:var(--fs-h3); margin:0 0 12px;}
.depth .dp-row{padding:12px 0; border-top:1px solid var(--line);}
.depth .dp-row .dp-k{display:block; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--text3); margin-bottom:6px;}
.depth .dp-row p{margin:0; color:var(--text2); font-size:15px; line-height:1.55;}
.depth.s1 .t-size i:nth-child(1){background:var(--accent);}
.depth.s2 .t-size i:nth-child(-n+2){background:var(--accent);}
.depth.s3 .t-size i{background:var(--accent);}
.depths-foot{margin:22px 0 0; font-size:var(--fs-body); color:var(--text2);}
.depths-foot b{color:var(--text); font-weight:600;}
@media(max-width:760px){ .depths{grid-template-columns:1fr;} }

/* ---- « Ce qui nous distingue » à 6 cartes (3 colonnes) ---- */
.why.trois{grid-template-columns:repeat(3,1fr);}
.why.trois .item .big{font-size:16px;}
@media(max-width:820px){ .why.trois{grid-template-columns:1fr 1fr;} }

/* ---- Bande de corpus (chiffres du référentiel) ---- */
.corpus{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:0 0 28px;
  padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.corpus .cxi{display:flex; flex-direction:column; gap:7px;}
.corpus .cxn{font-family:var(--mono); font-size:clamp(22px,3vw,32px); font-weight:600; color:var(--text); letter-spacing:-.02em; line-height:1;}
.corpus .cxl{font-size:12.5px; color:var(--text2); max-width:22ch;}
@media(max-width:680px){ .corpus{grid-template-columns:1fr 1fr; gap:20px 16px;} }

/* ---- Bloc « Ce qui compte » à 6 chiffres ---- */
.stats.six{grid-template-columns:repeat(3,1fr);}
@media(max-width:760px){ .stats.six{grid-template-columns:1fr 1fr;} }

/* ---- Veille continue : le produit récurrent (retainer) ---- */
.sub-band{display:grid; grid-template-columns:1.6fr 1fr; gap:32px; align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:34px 32px;}
.sub-band .sb-txt h2{margin:0 0 12px;}
.sub-band .sb-txt p{color:var(--text2); font-size:var(--fs-lead); margin:0 0 22px; max-width:52ch;}
.sub-band .sb-txt .cta-row{margin:0;}
.sub-band .sb-side{border-left:1px solid var(--line); padding-left:28px; display:flex; flex-direction:column; gap:16px;}
.sb-tag{display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-dim);}
.sb-tag .dot{width:6px; height:6px; border-radius:50%; background:var(--accent); animation:blink 1.1s steps(1) infinite;}
.sb-pulse{display:flex; align-items:flex-end; gap:6px; height:44px;}
.sb-pulse span{flex:1; background:var(--line); border-radius:2px; transform-origin:bottom; animation:sbpulse 1.6s var(--ease) infinite;}
.sb-pulse span:nth-child(1){height:40%; animation-delay:0s;}
.sb-pulse span:nth-child(2){height:70%; animation-delay:.15s;}
.sb-pulse span:nth-child(3){height:100%; animation-delay:.3s; background:var(--accent);}
.sb-pulse span:nth-child(4){height:60%; animation-delay:.45s;}
.sb-pulse span:nth-child(5){height:85%; animation-delay:.6s;}
@keyframes sbpulse{0%,100%{opacity:.55; transform:scaleY(.9);} 50%{opacity:1; transform:scaleY(1);}}
.sb-note{font-family:var(--mono); font-size:11px; color:var(--text2); margin:0;}
@media(max-width:760px){
  .sub-band{grid-template-columns:1fr; gap:24px; padding:28px 24px;}
  .sub-band .sb-side{border-left:0; border-top:1px solid var(--line); padding-left:0; padding-top:20px;}
}
@media(prefers-reduced-motion:reduce){ .sb-tag .dot,.sb-pulse span{animation:none;} }

/* =====================================================================
   Variante « confiance » v0.22 — repères d'accueil + preuve du procédé
   (l'affirmation reliée à ses sources) ; veille déplacée sur Expertise
   ===================================================================== */

/* ---- Bande de 2 repères en tête d'accueil (raisons de croire) ---- */
.reperes{display:flex; flex-wrap:wrap; justify-content:center; gap:14px 40px;
  margin-bottom:46px; padding-bottom:34px; border-bottom:1px solid var(--line);}
.reperes .rp{font-size:15px; color:var(--text2); display:inline-flex; align-items:baseline; gap:9px;}
.reperes .rp b{font-family:var(--mono); font-size:19px; font-weight:600; color:var(--text); letter-spacing:-.01em;}

/* ---- La preuve = une affirmation reliée à ses sources ---- */
.claim{max-width:660px; margin:0 auto; background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:30px 32px 22px; position:relative;}
.claim .cl-lbl{font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--text3);}
.claim .cl-txt{font-family:"IBM Plex Serif",Georgia,serif; font-style:italic; font-weight:500;
  font-size:23px; line-height:1.4; color:var(--text); margin:14px 0 22px;}
.claim .cl-foot{display:flex; flex-wrap:wrap; gap:8px; padding-top:16px; border-top:1px solid var(--line);}
.cl-chip{font-family:var(--mono); font-size:11px; letter-spacing:.02em; color:var(--text2);
  background:var(--surface2); border:1px solid var(--line); border-radius:20px; padding:5px 11px;}
.cl-chip.ok{color:var(--accent-dim); border-color:color-mix(in srgb,var(--accent) 40%, var(--line));}

/* =====================================================================
   v0.23 — badge langues (capacité de service, non cliquable) + restructure
   ===================================================================== */
.lang-badge{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; color:var(--text3);
  border:1px solid var(--line); border-radius:6px; padding:5px 8px; white-space:nowrap; cursor:default; user-select:none;}
.claim-lead{text-align:center; max-width:52ch; margin:40px auto 22px; font-size:var(--fs-lead); color:var(--text2);}

/* =====================================================================
   v0.24 — lisibilité (graisse/taille), chiffres en box, cartes « pourquoi
   nous », méthode en gros
   ===================================================================== */

/* ---- Lisibilité : un cran de graisse et de taille ---- */
body{font-weight:400;}
:root{ --fs-body:16px; }
nav.main a{font-weight:500; font-size:13px; opacity:.9;}
nav.main a:hover,nav.main a.active,nav.main a.opt.active{opacity:1;}

/* ---- « Ce qui compte » : chiffres en boîtes (fini les traits lime) ---- */
.stats .stat{background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:24px 22px; border-top:1px solid var(--line);}
.stats .stat .l{margin-top:12px;}

/* ---- « Pourquoi nous » : 4 cartes travaillées ---- */
.why.cards{grid-template-columns:repeat(4,1fr);}
.why.cards .item{background:var(--surface); border:1px solid var(--line); border-radius:12px;
  padding:26px 24px; border-top:1px solid var(--line);}
.why.cards .item::before{content:""; display:block; width:24px; height:3px; background:var(--accent);
  border-radius:2px; margin-bottom:18px;}
.why.cards .item .big{font-size:17px; margin-bottom:9px;}
@media(max-width:900px){ .why.cards{grid-template-columns:1fr 1fr;} }
@media(max-width:520px){ .why.cards{grid-template-columns:1fr;} }

/* ---- Méthode : les trois temps en gros ---- */
.process.chev.lead .s-top{gap:13px;}
.process.chev.lead .s-top h3{font-size:26px; letter-spacing:-.02em;}
.process.chev.lead .step p{font-size:var(--fs-body);}

/* v0.24b — chiffres unifiés (mêmes boîtes accueil + Cabinet) ; accueil = 3 */
.stats.trois{grid-template-columns:repeat(3,1fr);}
.stats.trois{margin-bottom:52px;}
@media(max-width:760px){ .stats.trois{grid-template-columns:1fr 1fr;} }
@media(max-width:460px){ .stats.trois{grid-template-columns:1fr;} }

/* =====================================================================
   v0.25 — correctifs : chevrons en négatif, chiffres dans le hero
   ===================================================================== */

/* Bug négatif : une section .paper devient SOMBRE en négatif → puce sombre */
[data-theme="light"] .paper .process.chev > .step,
[data-theme="light"] .paper .process.chev > .tile{ background:#1d1d23; }

/* Chiffres remontés dans le hero (fini les deux zones claires jumelles) */
.hero .hero-stats{margin-top:46px;}

/* =====================================================================
   v0.26 — cartes chiffres flottantes (accueil = mêmes boîtes que Cabinet,
   à cheval sur la charnière hero/méthode) + canal Contact qui se résout
   ===================================================================== */

/* Structure 1 : la bande chiffres chevauche le bas du hero (boîtes claires) */
.stats.trois.float{position:relative; z-index:3; margin-top:-64px; margin-bottom:52px;}
@media(max-width:760px){ .stats.trois.float{margin-top:-34px;} }

/* Contact : le point parcourt le canal UNE fois et se pose côté BFO */
.canal .path .p{ animation:wire-arrive 1.7s var(--ease) forwards; }
@keyframes wire-arrive{0%{left:0; opacity:0;} 18%{opacity:1;} 100%{left:calc(100% - 6px); opacity:1;}}

/* v0.29 : canal statique, le point se pose côté BFO sans animation (fini le gadget) */
.canal .path .p{ animation:none; left:calc(100% - 6px); opacity:1; }

/* v0.31 : widgets hero symboliques (peu de texte, un signe) */
/* Cabinet — le processus : question -> livrable -> décision -> GO (repris de l'accueil) */
.wproc{display:flex; align-items:center; padding:8px 0 24px;}
.wproc .wstep{position:relative; flex:none; display:flex; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid #33333a; border-radius:8px; color:#8a8a94; opacity:.42; transition:.45s var(--ease);}
.wproc .wstep.on{opacity:1; border-color:rgba(212,255,58,.42); color:var(--accent);}
.wproc .wstep svg{width:19px; height:19px;}
.wproc .wstep .wl{position:absolute; top:calc(100% + 8px); left:50%; transform:translateX(-50%); font-family:var(--mono); font-size:9.5px; letter-spacing:.07em; text-transform:uppercase; color:#a6a6ae; white-space:nowrap;}
.wproc .warr{flex:1; height:1px; background:#26262c; margin:0 7px;}
.wproc .wgo{flex:none; display:flex; align-items:center; height:38px; padding:0 14px; font-family:var(--mono); font-size:12.5px; font-weight:600; letter-spacing:.1em; color:#5a5a64; border:1px solid #26262c; border-radius:8px; transition:.5s var(--ease);}
.wproc .wgo.on{color:var(--accent); border-color:rgba(212,255,58,.55); background:rgba(212,255,58,.08);}

/* Contact — le tunnel : de vos multiples questions vers une clarté unique */
.fn{display:block; width:100%; height:auto; margin:8px 0 4px;}
.fn .wall{stroke:#26262c; stroke-width:1.2; stroke-dasharray:3 5;}
.fn .ray{stroke:#2c2c32; stroke-width:1.2;}
.fn .q{fill:#5a5a64;}
.fn .halo{fill:rgba(212,255,58,.15);}
.fn .clr{fill:var(--accent);}

/* v0.34 — tunnel animé : chaque rayon s'illumine tour à tour, puis le point focus se verrouille */
.fn .q{transition:fill .2s cubic-bezier(.2,.8,.2,1), opacity .34s cubic-bezier(.2,.8,.2,1);}
.fn .q.lit{fill:var(--accent);}
.fn .ray{transition:stroke .2s cubic-bezier(.2,.8,.2,1), opacity .34s cubic-bezier(.2,.8,.2,1);}
.fn .ray.lit{stroke:rgba(212,255,58,.45);}
.fn .wall{transition:opacity .34s cubic-bezier(.2,.8,.2,1);}
.fn .halo{fill:rgba(138,138,148,.10); transition:fill .34s cubic-bezier(.2,.8,.2,1);}
.fn .clr{fill:#5a5a64; transition:fill .34s cubic-bezier(.2,.8,.2,1);}
.fn .oring{fill:none; stroke:rgba(212,255,58,.75); stroke-width:1.5; opacity:0; transform-box:fill-box; transform-origin:center;}
/* verrouillage : les questions et les rayons retombent dans le noir mais restent en fantôme
   (on sent qu'ils ont existé) ; seul le point de clarté demeure lumineux */
.fn.done .q{opacity:1; fill:#3a3a42;}
.fn.done .ray{opacity:1; stroke:#212127;}
.fn.done .wall{opacity:1;}
.fn.done .halo{fill:rgba(212,255,58,.22);}
.fn.done .clr{fill:var(--accent);}
.fn .fx{transform-box:fill-box; transform-origin:center;}
.fn.done .fx{animation:fpop .34s cubic-bezier(.2,.8,.2,1);}
.fn.done .oring{animation:oring .6s cubic-bezier(.2,.8,.2,1) forwards;}
@keyframes fpop{0%{transform:scale(.6);}60%{transform:scale(1.25);}100%{transform:scale(1.12);}}
@keyframes oring{0%{opacity:.9; transform:scale(1);}100%{opacity:0; transform:scale(3.4);}}
@media(prefers-reduced-motion:reduce){ .fn.done .fx,.fn.done .oring{animation:none;} .fn.done .oring{opacity:0;} }

/* v0.43 — Cabinet : barres bicolores de volume autour d'une tendance (certaines dépassent la ligne) */
.grow{display:block; width:100%; height:auto; margin:10px 0 2px;}
/* rejeu : on coupe les transitions le temps de resnapper à l'état initial */
.grow.noanim *{transition:none !important; animation:none !important;}
.grow .g{stroke:rgba(255,255,255,.05); stroke-width:1;}
.grow .base{stroke:#33333a; stroke-width:1;}
.grow .gtick{stroke:#33333a; stroke-width:1; opacity:0; transition:opacity .5s cubic-bezier(.2,.8,.2,1) .3s;}
.grow .barg{transform-box:fill-box; transform-origin:bottom; transform:scaleY(0); transition:transform .5s cubic-bezier(.2,.8,.2,1) calc(var(--bi,0) * 50ms);}
.grow .bl{fill:rgba(212,255,58,.12);}
.grow .bu{fill:rgba(212,255,58,.3);}
.grow .ln{stroke:var(--accent); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1.15s cubic-bezier(.2,.8,.2,1) .45s;}
.grow .ehalo{fill:rgba(212,255,58,.16); opacity:0; transition:opacity .3s cubic-bezier(.2,.8,.2,1) 1.5s;}
.grow .end{fill:var(--accent); opacity:0; transform-box:fill-box; transform-origin:center; transition:opacity .3s cubic-bezier(.2,.8,.2,1) 1.5s;}
.grow.draw .barg{transform:scaleY(1);}
.grow.draw .gtick{opacity:1;}
.grow.draw .ln{stroke-dashoffset:0;}
.grow.draw .ehalo{opacity:1;}
.grow.draw .end{opacity:1; animation:epop .42s cubic-bezier(.2,.8,.2,1) 1.5s both;}
@keyframes epop{0%{transform:scale(.3);}70%{transform:scale(1.3);}100%{transform:scale(1);}}
@media(prefers-reduced-motion:reduce){
  .grow .barg,.grow .gtick,.grow .ln,.grow .ehalo,.grow .end{transition:none; animation:none; opacity:1;}
  .grow .barg{transform:scaleY(1);}
  .grow.draw .end{animation:none; transform:none;}
  .grow .ln{stroke-dashoffset:0;}
}

/* v0.34 — veille : sonar (le balayage continu, l'état même de la veille) */
.sonar{position:relative; width:150px; height:150px; margin:2px 0;}
.sonar .rg{position:absolute; border-radius:50%; border:1px solid var(--line);}
.sonar .rg.r1{inset:0;}
.sonar .rg.r2{inset:17%;}
.sonar .rg.r3{inset:34%;}
.sonar .axv{position:absolute; left:50%; top:4px; bottom:4px; width:1px; margin-left:-.5px; background:var(--line); opacity:.6;}
.sonar .axh{position:absolute; top:50%; left:4px; right:4px; height:1px; margin-top:-.5px; background:var(--line); opacity:.6;}
.sonar .beam{position:absolute; inset:0; border-radius:50%; background:rgba(212,255,58,.08); background:conic-gradient(from 0deg, rgba(212,255,58,.34), rgba(212,255,58,.05) 55deg, transparent 72deg); animation:sonar-sweep 5.2s linear infinite;}
.sonar .core{position:absolute; left:50%; top:50%; width:6px; height:6px; margin:-3px 0 0 -3px; border-radius:50%; background:var(--accent);}
.sonar .blip{position:absolute; width:7px; height:7px; margin:-3.5px 0 0 -3.5px; border-radius:50%; background:var(--accent); opacity:.14; animation:sonar-blip 5.2s linear infinite;}
/* Sur bande claire (thème par défaut), le lime vif est invisible sur le crème :
   balayage et échos passent en olive sombre. En négatif, la bande redevient
   sombre, retour au lime vif. */
.paper .sonar .beam{background:rgba(90,102,20,.12); background:conic-gradient(from 0deg, rgba(90,102,20,.38), rgba(90,102,20,.06) 55deg, transparent 72deg);}
.paper .sonar .core,.paper .sonar .blip{background:#5a6614;}
[data-theme="light"] .paper .sonar .beam{background:rgba(212,255,58,.08); background:conic-gradient(from 0deg, rgba(212,255,58,.34), rgba(212,255,58,.05) 55deg, transparent 72deg);}
[data-theme="light"] .paper .sonar .core,[data-theme="light"] .paper .sonar .blip{background:var(--accent);}
.sonar .blip.b1{left:76.9%; top:23.1%; animation-delay:.65s;}
.sonar .blip.b2{left:60.3%; top:78.2%; animation-delay:2.31s;}
.sonar .blip.b3{left:8.2%; top:53.7%; animation-delay:3.83s;}
@keyframes sonar-sweep{to{transform:rotate(360deg);}}
@keyframes sonar-blip{0%{opacity:.95;}14%{opacity:.75;}45%{opacity:.14;}100%{opacity:.14;}}
@media(prefers-reduced-motion:reduce){
  .sonar .beam{animation:none; opacity:.3;}
  .sonar .blip{animation:none; opacity:.6;}
}

/* v0.34 — rail de navigation verticale (desktop) : fader de sections */
.rail{position:fixed; right:26px; top:50%; transform:translateY(-50%); z-index:120; display:none;
  background:rgba(12,12,13,.2); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); border-radius:99px; padding:16px 0;}
@media(min-width:1280px){ .rail{display:block;} }
.rail .track{position:relative; width:34px; height:min(46vh,380px);}
.rail .line{position:absolute; left:50%; top:0; bottom:0; width:2px; margin-left:-1px; background:rgba(138,138,148,.35); border-radius:1px; z-index:0;}
.rail .knob{position:absolute; left:50%; top:0; width:18px; height:32px; margin-left:-9px; border-radius:5px; background:#0c0c0d; border:1px solid rgba(212,255,58,.75); box-shadow:0 2px 10px rgba(0,0,0,.35); transition:top .18s cubic-bezier(.2,.8,.2,1); pointer-events:auto; cursor:grab; touch-action:none; z-index:1;}
.rail .knob:active,.rail.grabbing .knob{cursor:grabbing;}
.rail.grabbing .knob{transition:none;}
.rail .track{cursor:pointer;}
.rail .knob::after{content:""; position:absolute; left:3px; right:3px; top:50%; height:2px; margin-top:-1px; background:var(--accent); border-radius:1px;}
.rail .stop{position:absolute; left:50%; width:15px; height:15px; margin:-7.5px 0 0 -7.5px; border-radius:50%; background:transparent; border:0; cursor:pointer; padding:0; z-index:2;}
.rail .stop::after{content:""; position:absolute; inset:4px; border-radius:50%; background:rgba(138,138,148,.55); transition:background .2s cubic-bezier(.2,.8,.2,1), inset .2s cubic-bezier(.2,.8,.2,1);}
.rail .stop:hover::after,.rail .stop.on::after{background:var(--accent); inset:3px; box-shadow:0 0 0 2px rgba(12,12,13,.55);}
.rail .stop .tip{position:absolute; right:24px; top:50%; transform:translateY(-50%); white-space:nowrap; font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:#c9c9cf; background:#0c0c0d; border:1px solid #26262c; border-radius:4px; padding:5px 10px; opacity:0; pointer-events:none; transition:opacity .2s;}
.rail .stop:hover .tip,.rail .stop:focus-visible .tip{opacity:1;}
[data-rail][tabindex="-1"]:focus:not(:focus-visible){outline:none;}
@media(prefers-reduced-motion:reduce){ .rail .knob{transition:none;} html{scroll-behavior:auto;} }

/* v0.35 — la grille du hero reprise, très légèrement, sur les sections noires de contenu */
section.ink:not(.hero){position:relative;}
section.ink:not(.hero) > .wrap{position:relative; z-index:1;}
section.ink:not(.hero)::before{content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:linear-gradient(90deg,var(--motif-soft) 1px,transparent 1px) 0 0/54px 54px,
             linear-gradient(var(--motif-soft) 1px,transparent 1px) 0 0/54px 54px;
  opacity:.5;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.35) 48%,transparent 92%);
  mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.35) 48%,transparent 92%);}

/* v0.36 — lisibilité des petits libellés de widgets : plus clairs (blancs), taille plancher 10px */
.flux .c-top, .mini .m-top{color:#b4b4bb; font-size:10.5px;}
.flux .c-top .id, .mini .m-top span:first-child{color:#dcdce0;}
.flux .c-foot, .mini .m-foot, .constel .c-foot{color:#b4b4bb; font-size:10.5px;}
.flux .c-foot b, .mini .m-foot b, .constel .c-foot b{color:#f0f0f2;}
.dcov .dlab{color:#b4b4bb; font-size:10px;}
.silo .lab, .silo .pv{color:#c2c2c9; font-size:10px;}
.clarify .clbar-pct{color:#dcdce0;}

/* =====================================================================
   v0.37 — couture de sections : filet qui se dessine (la mire a été retirée)
   ===================================================================== */
/* Filet lime qui se dessine en tête des sections sombres de contenu (scanline signature) */
.sec-rule{position:absolute; top:0; left:0; height:1px; width:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, rgba(212,255,58,0), rgba(212,255,58,.5) 16%, rgba(212,255,58,.5) 84%, rgba(212,255,58,0));
  transition:width .85s cubic-bezier(.2,.8,.2,1);}
.sec-rule.on{width:100%;}
@media(prefers-reduced-motion:reduce){ .sec-rule{transition:none;} }

/* =====================================================================
   Écran de démarrage : conteneur commun (le scan surcharge via #splash.scan)
   ===================================================================== */
#splash{position:fixed; inset:0; z-index:1000; background:#08080a; display:grid; place-items:center;}
:root.splash-off #splash{display:none;}
#splash.done{opacity:0; visibility:hidden; transition:opacity .5s cubic-bezier(.2,.8,.2,1), visibility 0s .5s;}

/* v0.44 — accessibilité : contraste du lien Contact en négatif (olive sombre sur en-tête clair, WCAG AA) */
[data-theme="light"] .nav-cta{color:#46620a !important;}

/* v0.45 — négatif : accents lime de l'en-tête lisibles sur fond clair (mire du logo + soulignage actif) */
[data-theme="light"] .mark-lockon rect.core{fill:#4f6d0a;}
[data-theme="light"] nav.main a.active{border-bottom-color:#4f6d0a;}

/* =====================================================================
   Landing, page à intention unique (menu retiré, tout mène au formulaire)
   ===================================================================== */
.lp-note{font-family:var(--mono); color:var(--text3); font-size:11.5px;
  letter-spacing:.16em; text-transform:uppercase;}
@media(max-width:520px){ .lp-note{display:none;} }

/* Paragraphes justifiés (récit du cabinet, pages légales) */
.story-body p, .prose p{text-align:justify; hyphens:auto;}
@media(max-width:560px){ .story-body p, .prose p{text-align:left; hyphens:manual;} }

/* =====================================================================
   Accueil : scan de première visite, une ligne balaie la page de haut en bas
   (non bloquant, la page est visible et utilisable dessous)
   ===================================================================== */
#splash.scan{background:transparent; display:block; pointer-events:none;}
#splash.scan .scan-line{position:absolute; left:0; right:0; top:0; height:2px;
  background:linear-gradient(90deg,transparent 6%,rgba(212,255,58,.85) 50%,transparent 94%);
  box-shadow:0 0 26px 5px rgba(212,255,58,.28);
  transform:translateY(-12px); opacity:0;
  animation:scan-sweep 1.15s var(--ease) .1s forwards;}
#splash.scan .scan-line::before{content:""; position:absolute; left:0; right:0; bottom:100%; height:64px;
  background:linear-gradient(to top, rgba(212,255,58,.12), transparent);}
@keyframes scan-sweep{0%{transform:translateY(-12px); opacity:0;} 6%{opacity:1;} 90%{opacity:1;} 100%{transform:translateY(100vh); opacity:0;}}
#splash.scan.done{opacity:0; transition:opacity .3s ease, visibility 0s .3s;}
@media(prefers-reduced-motion:reduce){ #splash.scan{display:none;} }

/* =====================================================================
   Pied de page : signature centrée, copyright à gauche, filet parasite retiré
   ===================================================================== */
footer .sig{border-top:0; margin-top:0; padding-top:0;}
.foot{justify-content:flex-start; text-align:left; font-size:12.5px;}
footer .foot-meta{max-width:none; margin:0; padding:0; font-size:12.5px;}
.legal-links a{font-size:12.5px;}

/* Lisibilité : menu, logo et textes un cran plus grands */
nav.main a{font-size:14px;}
@media(max-width:900px){ nav.main a{font-size:12.5px;} }
.bar .logo{height:31px;}
.bar .vf svg{width:31px; height:31px;}
:root{ --fs-body:18px; }

/* Lien d'évitement (accessibilité : aller au contenu) */
.skip-link{position:absolute; left:8px; top:-48px; z-index:1200;
  background:var(--accent); color:var(--accent-ink); font-family:var(--mono); font-size:14px;
  padding:10px 16px; border-radius:6px; text-decoration:none; transition:top .16s var(--ease);}
.skip-link:focus{top:8px; outline:2px solid var(--accent-ink); outline-offset:2px;}


.fluent-form-shell { display:block; }
.fluent-form-shell .fluentform { color:var(--text); }
.fluent-form-shell .ff-el-group { margin-bottom:18px; }
.fluent-form-shell label { font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--text2); }
.fluent-form-shell input,
.fluent-form-shell textarea,
.fluent-form-shell select {
  width:100%;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  border-radius:8px;
  padding:13px 14px;
  font:inherit;
}
.fluent-form-shell textarea { min-height:138px; }
.fluent-form-shell input:focus,
.fluent-form-shell textarea:focus,
.fluent-form-shell select:focus {
  outline:2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  border-color:var(--accent);
}
.fluent-form-shell .ff-btn-submit {
  border:0 !important;
  border-radius:999px !important;
  background:var(--accent) !important;
  color:#0a0a0b !important;
  padding:13px 18px !important;
  font-family:var(--mono) !important;
  font-weight:700 !important;
}