/* Quadra Operations Systems — shared site stylesheet.
   Verbatim copy of the <style> blocks in /index.html (design tokens, components,
   consent banner, integrations update). Used by the static English solution pages.
   If the design in index.html changes, regenerate this file. Generated 2026-09-17. */

/* ============================================================
   QUADRA OPERATIONS SYSTEMS — DESIGN TOKENS
   Palette : papier / encre / espresso (logo) / cappuccino
   Type    : Cinzel (display) · Archivo (UI) · IBM Plex Mono (technique)

   ------------------------------------------------------------
   SOURCE DE VERITE DE LA MARQUE
   ------------------------------------------------------------
   Le brun canonique est extrait du logo lui-meme :
   assets/brand/qos-mark.png et assets/brand/icon-512.png ne
   contiennent qu'une seule encre — 432713 — et c'est aussi la
   couleur dominante non blanche de assets/Branding/logo brown.
   En TSL : hsl(25, 56%, 17%). Espresso, pas cuivre.

   La rampe ci-dessous garde la teinte 25 constante et fait
   DECROITRE la saturation quand la clarte monte. C'est ce qui
   distingue un espresso d'un orange : l'orange, c'est une forte
   saturation a clarte moyenne. Aucune valeur ne doit etre
   ajoutee en dur ailleurs dans la feuille — tout part d'ici.
   ============================================================ */
:root{
  /* — Rampe de marque : teinte 25, saturation decroissante — */
  --espresso-950:#1D1007;
  --espresso-900:#29170A;
  --espresso-800:#341E0E;
  --espresso-700:#432713;   /* LOGO — valeur canonique exacte */
  --espresso-600:#55331B;
  --espresso-500:#694226;
  --espresso-400:#7D5336;
  --taupe-300:#986F52;
  --taupe-250:#A88267;
  --capp-200:#C5A996;
  --capp-150:#D9C4B5;
  --capp-100:#EADCD2;
  --cream-050:#F7F1ED;
  --cream-025:#FBF8F6;

  /* Canaux bruts : voiles rgba() sans reintroduire de litteraux.
     Espresso sur fond clair, taupe pour les halos sur fond
     sombre, cappuccino pour le texte sur fond sombre. */
  --brand-rgb:67,39,19;
  --taupe-rgb:152,111,82;
  --capp-rgb:197,169,150;

  /* — Alias semantiques — */
  --brand-espresso:var(--espresso-700);
  --brand-espresso-dark:var(--espresso-900);
  --brand-espresso-soft:var(--espresso-400);
  --brand-cream:var(--cream-050);
  --surface:var(--paper);
  --surface-dark:var(--ink);
  --text-primary:var(--ink);
  --text-muted:var(--grey);
  --border:var(--line);

  --paper:#FFFFFF;
  --paper-2:#F4F2ED;
  --paper-3:#E7E3DA;
  --ink:#0D0D0D;
  --ink-2:#151310;
  --ink-3:#1C1815;
  --char:#1A1816;
  --glow:rgba(var(--brand-rgb),.20);
  --char-2:#262320;

  /* — Noms herites, rediriges vers la rampe —
     Les anciens tons (umber A9683A, bronze B97847) tiraient vers
     le cuivre : saturation ~48 % a clarte 45-50 %. Le contraste
     augmente partout : .sec-idx etait a 3,60:1 sur blanc, donc
     sous AA ; il est maintenant a 6,64:1. */
  --umber:var(--espresso-400);        /* 6,64:1 sur blanc */
  --umber-deep:var(--espresso-500);   /* 8,72:1 sur blanc */
  --umber-btn:var(--espresso-600);    /* blanc dessus : 11,20:1 */
  --umber-btn-h:var(--espresso-500);  /* blanc dessus :  8,72:1 */
  --umber-ink:var(--espresso-900);
  --bronze:var(--espresso-400);       /* voir la reprise sur fond sombre */
  --bronze-lt:var(--capp-200);        /* 8,78:1 sur encre */
  --bronze-soft:var(--capp-150);      /* 11,58:1 sur encre */
  --grey:#5E5750;
  --grey-2:#B3ABA1;

  --line:rgba(12,11,10,.15);
  --line-soft:rgba(12,11,10,.07);
  --line-dark:rgba(255,255,255,.17);
  --line-dark-soft:rgba(255,255,255,.09);

  --f-display:"Cinzel",Georgia,serif;
  --f-ui:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;

  --pad:clamp(20px,4.5vw,72px);
  --maxw:1560px;
  --ease:cubic-bezier(.22,.61,.24,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --nav-h:78px;
}

/* ============================================================
   REPRISE SUR FOND SOMBRE
   ------------------------------------------------------------
   --bronze est le seul accent utilise dans les deux sens : sur
   papier (.sec-idx, .hero-eyebrow, .kpi .d) et sur encre
   (.mmenu, .foot, .rtx, .app-side). Une seule valeur ne peut pas
   satisfaire les deux : un ton assez fonce pour etre lisible sur
   blanc disparait sur noir. Plutot que de dupliquer des couleurs
   dans le balisage, on rebranche le jeton dans les portees
   sombres. Le nom reste, la valeur s'adapte au support.

   .frame est volontairement absent : l'interieur de la demo est
   clair (--d-bg). Seuls .app-side et .frame-bar y sont sombres.
   ============================================================ */
.sec--dark,.frag,.infra,.cases,.foot,.mmenu,.bp-col,.rtx,.ysd-cell,
.calc-out,.rc-sticky,.hp-teaser,.bk-side,.ct-card--dark,.os-core,
.app-side,.frame-bar,.sw-side--after,.cs-nums .num--big,
.nav--on-dark:not(.stuck),html[data-qos] #pre{
  --bronze:var(--capp-200);
  --umber:var(--capp-200);
  --umber-deep:var(--capp-150);
}


/* Repli typographique CJK. Les polices latines restent en tête : le rendu
   FR / EN / ES est strictement identique. Seuls les idéogrammes, absents
   de Cinzel / Archivo / IBM Plex Mono, descendent la pile — et on distingue
   zh de ja pour éviter des glyphes chinois dans un texte japonais. */
html:lang(zh){
  --f-display:"Cinzel",Georgia,"Noto Serif SC","Songti SC","SimSun",serif;
  --f-ui:"Archivo","Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,"PingFang SC","Noto Sans SC",monospace;
}
html:lang(ja){
  --f-display:"Cinzel",Georgia,"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --f-ui:"Archivo","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",YuGothic,"Noto Sans JP",Meiryo,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,"Hiragino Kaku Gothic ProN","Noto Sans JP",monospace;
}
/* Les libellés capitales très espacés respirent mal en idéogrammes. */
html:lang(zh) .mono,html:lang(ja) .mono,
html:lang(zh) .tag,html:lang(ja) .tag{letter-spacing:.04em}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis{scroll-behavior:auto}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--f-ui);font-weight:400;font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.is-locked{overflow:hidden}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,figure,ul{margin:0;padding:0}
ul{list-style:none}
:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
::selection{background:var(--umber);color:var(--paper)}

/* --- utilities --------------------------------------------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.mono{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:400}
.rule{height:1px;background:var(--line);border:0;width:100%}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;top:8px;left:8px;z-index:400;background:var(--ink);color:var(--paper);padding:10px 16px;transform:translateY(-160%)}
.skip:focus{transform:none}

/* --- section chrome ---------------------------------------- */
.sec{position:relative;padding-block:clamp(84px,11vw,168px)}
.sec--dark{background:var(--ink);color:var(--paper)}
.sec--dark .rule{background:var(--line-dark)}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;margin-bottom:clamp(44px,6vw,88px)}
@media(min-width:900px){.sec-head{grid-template-columns:250px minmax(0,1fr);gap:0 48px;align-items:start}}
.sec-idx{color:var(--bronze);display:flex;align-items:center;gap:12px;padding-top:.5em}
.sec-idx::after{content:"";flex:1;height:1px;background:currentColor;opacity:.35;min-width:18px;max-width:56px}
.sec-title{
  font-family:var(--f-ui);font-weight:600;letter-spacing:-.028em;line-height:1.02;
  font-size:clamp(30px,4.6vw,62px);text-transform:uppercase;max-width:20ch;
}
.sec-title em{font-family:var(--f-display);font-style:normal;font-weight:500;text-transform:none;letter-spacing:-.005em;color:var(--umber-deep)}
.sec--dark .sec-title em{color:var(--bronze-lt)}
.sec-lede{margin-top:22px;max-width:56ch;color:var(--grey);font-size:clamp(15px,1.15vw,17px);line-height:1.72}
.sec--dark .sec-lede,.frag .sec-lede,.infra .sec-lede,.cases .sec-lede{color:#C9C2B9}

/* --- blueprint grid overlay -------------------------------- */
.grid-overlay{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.55}
.grid-overlay .gi{max-width:var(--maxw);height:100%;margin:0 auto;padding-inline:var(--pad);display:grid;grid-template-columns:repeat(4,1fr)}
.grid-overlay span{border-left:1px solid var(--line-soft)}
.grid-overlay span:last-child{border-right:1px solid var(--line-soft)}
@media(min-width:1100px){.grid-overlay .gi{grid-template-columns:repeat(8,1fr)}}

/* --- buttons ----------------------------------------------- */
.btn{
  position:relative;display:inline-flex;align-items:center;gap:16px;
  padding:17px 26px;font-family:var(--f-mono);font-size:11px;letter-spacing:.17em;
  text-transform:uppercase;border:1px solid var(--ink);overflow:hidden;isolation:isolate;
  transition:color .5s var(--ease),border-color .5s var(--ease);
}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);transform:translateY(101%);transition:transform .55s var(--ease-out)}
.btn:hover::before,.btn:focus-visible::before{transform:translateY(0)}
.btn:hover,.btn:focus-visible{color:var(--paper)}
.btn .ar{width:26px;height:7px;position:relative;overflow:hidden;flex:none}
.btn .ar svg{position:absolute;inset:0;transition:transform .5s var(--ease-out)}
.btn .ar svg+svg{transform:translateX(-110%)}
.btn:hover .ar svg{transform:translateX(110%)}
.btn:hover .ar svg+svg{transform:translateX(0)}
.btn--solid{background:var(--umber-btn);border-color:var(--umber-btn);color:#FFF}
.btn--solid::before{background:var(--umber-btn-h)}
.btn--solid:hover,.btn--solid:focus-visible{border-color:var(--umber-btn-h);color:#FFF}
.btn--light{border-color:var(--bronze);color:var(--paper)}
.btn--light:hover,.btn--light:focus-visible{border-color:var(--bronze-lt);color:var(--umber-ink)}
.btn--light::before{background:var(--bronze-soft)}
.btn--light:hover,.btn--light:focus-visible{color:var(--umber-ink);border-color:var(--bronze-lt)}
.btn--ghost{border-color:var(--umber);color:var(--umber-deep)}
.btn--ghost::before{background:var(--umber)}
.btn--ghost:hover,.btn--ghost:focus-visible{border-color:var(--umber);color:#fff}

.tlink{position:relative;display:inline-flex;align-items:center;gap:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.17em;text-transform:uppercase;padding-block:8px}
.tlink::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease-out)}
.tlink:hover::after,.tlink:focus-visible::after{transform:scaleX(1);transform-origin:left}
.tlink svg{transition:transform .45s var(--ease-out)}
.tlink:hover svg{transform:translateX(5px)}

/* --- preloader --------------------------------------------- */
#pre{position:fixed;inset:0;z-index:300;background:var(--paper);display:grid;place-items:center;transition:opacity .7s var(--ease),visibility .7s}
/* Dès que l'intro se retire, elle laisse passer les touchers : sans cela,
   le fondu (jusqu'à ~0,8 s) avalait les premiers clics sur la page. */
#pre.done{opacity:0;visibility:hidden;pointer-events:none}
/* Filet de securite : si boot() n'est jamais atteint (erreur JS en
   amont, script bloque), l'ecran d'intro se retire seul. En marche
   normale il est deja parti bien avant ce delai. */
#pre{animation:preFailsafe .01s linear 3.2s forwards}
@keyframes preFailsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
#pre .pl{display:flex;flex-direction:column;align-items:center;gap:20px}
#pre img{width:34px;opacity:0;animation:preIn .8s var(--ease-out) .1s forwards}
#pre .pn{font-family:var(--f-display);font-size:12px;letter-spacing:.42em;color:var(--umber);opacity:0;animation:preIn .8s var(--ease-out) .25s forwards}
#pre .pb{width:150px;height:1px;background:var(--line);position:relative;overflow:hidden}
#pre .pb i{position:absolute;inset:0;background:var(--umber);transform:scaleX(0);transform-origin:left;animation:preBar 1.15s var(--ease) .2s forwards}
@keyframes preIn{to{opacity:1}}
@keyframes preBar{to{transform:scaleX(1)}}

/* --- navigation -------------------------------------------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:120;transition:background .5s var(--ease),backdrop-filter .5s,border-color .5s}
.nav::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease-out)}
.nav.stuck{background:rgba(242,239,233,.82);backdrop-filter:blur(16px) saturate(1.2)}
.nav.stuck::after{transform:scaleX(1)}
.nav .ni{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad);height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;gap:24px;transition:height .5s var(--ease)}
.nav.stuck .ni{height:64px}
.brand{display:flex;align-items:center;gap:14px;flex:none}
.brand img{width:28px;transition:width .5s var(--ease)}
.nav.stuck .brand img{width:24px}
.brand .bt{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.2em;line-height:1.35;color:var(--grey);border-left:1px solid var(--line);padding-left:14px;text-transform:uppercase}
.brand .bt b{display:block;color:var(--ink);font-weight:500;letter-spacing:.24em}
@media(max-width:700px){.brand .bt{display:none}}
.nlinks{display:none;gap:clamp(18px,2.4vw,38px);align-items:center}
@media(min-width:1060px){.nlinks{display:flex}}
.nlinks a{font-family:var(--f-mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;position:relative;padding-block:6px;color:var(--char)}
.nlinks a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--umber);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease-out)}
.nlinks a:hover::after{transform:scaleX(1);transform-origin:left}
.nav-right{display:flex;align-items:center;gap:14px;flex:none}
.nav-cta{display:none}
@media(min-width:840px){.nav-cta{display:inline-flex;padding:13px 20px}}
.burger{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line)}
@media(min-width:1060px){.burger{display:none}}
.burger i{display:block;width:17px;height:1px;background:var(--ink);position:relative;transition:background .3s}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:17px;height:1px;background:var(--ink);transition:transform .45s var(--ease-out)}
.burger i::before{top:-5px}.burger i::after{top:5px}
body.menu-open .nav{background:transparent;backdrop-filter:none}
body.menu-open .nav::after{transform:scaleX(0)}
body.menu-open .brand img{filter:brightness(0) invert(.94)}
body.menu-open .burger{border-color:rgba(242,239,233,.28)}
body.menu-open .burger i{background:transparent}
body.menu-open .burger i::before,body.menu-open .burger i::after{background:var(--paper)}
body.menu-open .burger i::before{transform:translateY(5px) rotate(45deg)}
body.menu-open .burger i::after{transform:translateY(-5px) rotate(-45deg)}

.mmenu{position:fixed;inset:0;z-index:110;background:var(--ink);background-image:radial-gradient(90% 70% at 12% 8%,rgba(var(--taupe-rgb),.16),transparent 60%),linear-gradient(180deg,#161311,#0D0D0D);color:var(--paper);transform:translateY(-100%);transition:transform .8s var(--ease-out);display:flex;flex-direction:column;justify-content:center;padding:var(--nav-h) var(--pad) 40px}
body.menu-open .mmenu{transform:translateY(0)}
.mmenu ol{margin:0;padding:0;list-style:none}
.mmenu li{overflow:hidden;border-bottom:1px solid var(--line-dark-soft)}
.mmenu li a{display:flex;align-items:baseline;gap:18px;padding:18px 0;font-size:clamp(24px,7vw,40px);font-weight:500;letter-spacing:-.02em;text-transform:uppercase;transform:translateY(105%);transition:transform .7s var(--ease-out)}
body.menu-open .mmenu li a{transform:translateY(0)}
.mmenu li:nth-child(1) a{transition-delay:.12s}.mmenu li:nth-child(2) a{transition-delay:.18s}
.mmenu li:nth-child(3) a{transition-delay:.24s}.mmenu li:nth-child(4) a{transition-delay:.3s}
.mmenu li:nth-child(5) a{transition-delay:.36s}
.mmenu li a span{font-family:var(--f-mono);font-size:11px;color:var(--bronze);letter-spacing:.1em}
.mmenu .mfoot{margin-top:38px;display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between}

/* --- HERO --------------------------------------------------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding-top:calc(var(--nav-h) + 24px);padding-bottom:clamp(80px,11vh,132px);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1fr;gap:0;align-items:center;width:100%}
@media(min-width:1000px){.hero-grid{grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:36px}}
.hero-copy{position:relative;z-index:3;max-width:640px}
.hero-eyebrow{display:flex;align-items:center;gap:14px;color:var(--bronze);margin-bottom:clamp(22px,3vw,38px)}
.hero-eyebrow::before{content:"";width:clamp(28px,5vw,64px);height:1px;background:currentColor}
h1.hero-h{
  font-weight:600;letter-spacing:-.035em;line-height:.96;text-transform:uppercase;
  font-size:clamp(31px,4.3vw,64px);
}
h1.hero-h .l{display:block;overflow:hidden}
h1.hero-h .l i{display:block;font-style:normal;transform:translateY(105%);transition:transform 1.15s var(--ease-out)}
.ready h1.hero-h .l i{transform:translateY(0)}
h1.hero-h .l:nth-child(2) i{transition-delay:.1s}
h1.hero-h .l:nth-child(3) i{transition-delay:.2s}
h1.hero-h .cz{font-family:var(--f-display);font-weight:500;text-transform:none;letter-spacing:-.012em;color:var(--umber);font-size:.92em}
.hero-sub{margin-top:clamp(24px,3vw,38px);display:grid;gap:20px;max-width:44ch;opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease-out) .5s,transform .9s var(--ease-out) .5s}
.ready .hero-sub{opacity:1;transform:none}
.hero-sub .lead{font-size:clamp(16px,1.3vw,19px);line-height:1.55;font-weight:400;color:var(--char)}
.hero-sub p{color:var(--grey);font-size:15px;line-height:1.7}
.hero-actions{margin-top:clamp(30px,3.6vw,46px);display:flex;flex-wrap:wrap;gap:14px;opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease-out) .68s,transform .9s var(--ease-out) .68s}
.ready .hero-actions{opacity:1;transform:none}
.hero-meta{margin-top:clamp(28px,3.4vw,46px);display:flex;flex-wrap:wrap;gap:10px 30px;color:var(--grey);opacity:0;transition:opacity 1s var(--ease) .95s}
.ready .hero-meta{opacity:1}
.hero-meta span{display:flex;align-items:center;gap:9px}
.hero-meta span::before{content:"";width:4px;height:4px;background:var(--bronze);transform:rotate(45deg)}

.hero-stage{position:relative;min-height:min(74svh,660px);display:grid;place-items:center}
@media(max-width:999px){.hero-stage{min-height:46svh;margin-top:30px;order:2}}
#scene{width:100%;height:100%;position:absolute;inset:0;overflow:visible}
#scene text{font-family:var(--f-mono);letter-spacing:.1em}
.hero-scroll{position:absolute;left:var(--pad);bottom:26px;z-index:4;display:flex;align-items:center;gap:12px;color:var(--grey);opacity:0;transition:opacity 1s var(--ease) 1.2s}
.ready .hero-scroll{opacity:1}
.hero-scroll .track{width:1px;height:44px;background:var(--line);position:relative;overflow:hidden}
.hero-scroll .track i{position:absolute;left:0;top:0;width:1px;height:14px;background:var(--umber);animation:scrollDot 2.4s var(--ease) infinite}
@keyframes scrollDot{0%{transform:translateY(-16px)}60%,100%{transform:translateY(46px)}}
@media(max-width:999px){.hero-scroll{display:none}}

/* --- VALEUR : 4 axes ---------------------------------------- */
.value{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper);position:relative;z-index:2}
.value-grid{display:grid;grid-template-columns:1fr}
@media(min-width:720px){.value-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1180px){.value-grid{grid-template-columns:repeat(4,1fr)}}
.vcell{position:relative;padding:clamp(30px,3.4vw,52px) clamp(20px,2.4vw,38px);border-bottom:1px solid var(--line)}
@media(min-width:720px){.vcell{border-right:1px solid var(--line)}.vcell:nth-child(2n){border-right:0}.vcell:nth-child(n+3){border-bottom:0}}
@media(min-width:1180px){.vcell{border-bottom:0;border-right:1px solid var(--line)}.vcell:nth-child(2n){border-right:1px solid var(--line)}.vcell:last-child{border-right:0}}
.vcell::before{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:var(--umber);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease-out)}
.vcell:hover::before{transform:scaleX(1)}
.vcell .vn{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;color:var(--grey-2);position:absolute;top:clamp(30px,3.4vw,52px);right:clamp(20px,2.4vw,38px)}
.vcell svg.ico{width:36px;height:36px;stroke:var(--umber);fill:none;stroke-width:1.15;margin-bottom:26px;overflow:visible}
.vcell svg.ico *{transition:transform .8s var(--ease-out),opacity .6s}
.vcell:hover svg.ico .spin{transform:rotate(90deg);transform-origin:50% 50%}
.vcell:hover svg.ico .push{transform:translateX(3px)}
.vcell h3{font-size:13px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;margin-bottom:12px;line-height:1.35}
.vcell p{font-size:14.5px;color:var(--grey);line-height:1.66;max-width:34ch}

/* --- FRAGMENTATION ------------------------------------------ */
.frag{background:var(--ink);background-image:radial-gradient(120% 90% at 18% 0%,rgba(var(--taupe-rgb),.13),transparent 58%),linear-gradient(180deg,#151310 0%,#0D0D0D 46%,#100E0C 100%);color:var(--paper);overflow:hidden}
.frag .sec-idx,.infra .sec-idx,.cases .sec-idx{color:var(--bronze-lt)}
.frag .sec-title em,.infra .sec-title em,.cases .sec-title em{color:var(--bronze-soft)}
.fstage{position:relative;height:clamp(360px,52vw,600px);margin-top:clamp(30px,4vw,60px);border:1px solid var(--line-dark-soft)}
.fstage::before,.fstage::after{content:"";position:absolute;width:9px;height:9px;border:1px solid var(--bronze);opacity:.55}
.fstage::before{left:-5px;top:-5px}.fstage::after{right:-5px;bottom:-5px}
.fnode{position:absolute;transform:translate(-50%,-50%);will-change:transform}
.fnode .chip{
  display:flex;align-items:center;gap:9px;padding:9px 13px;white-space:nowrap;
  background:#141210;border:1px solid var(--line-dark);
  font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#CFC7BC;
}
.fnode .chip b{width:5px;height:5px;background:var(--bronze);flex:none;transform:rotate(45deg);font-size:0}
.fcore{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.fcore .box{width:clamp(112px,15vw,168px);aspect-ratio:1;border:1px solid var(--bronze);display:grid;place-items:center;position:relative;background:rgba(var(--taupe-rgb),.16)}
.fcore .box img{width:38%;opacity:.95}
.fcore .box i{position:absolute;width:7px;height:7px;background:var(--bronze)}
.fcore .box i:nth-child(1){left:-4px;top:-4px}.fcore .box i:nth-child(2){right:-4px;top:-4px}
.fcore .box i:nth-child(3){left:-4px;bottom:-4px}.fcore .box i:nth-child(4){right:-4px;bottom:-4px}
.fcore .cap{margin-top:16px;font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;color:var(--bronze-lt);text-transform:uppercase}
#flines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.fstates{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase}
.fstates div{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.fstates .a{color:var(--grey-2)}
.fstates .b{color:var(--bronze-lt);justify-content:flex-end;text-align:right}
.fprog{margin-top:20px;height:1px;background:var(--line-dark);position:relative}
.fprog i{position:absolute;inset:0;background:var(--bronze);transform:scaleX(0);transform-origin:left}

/* --- DEMO SYSTÈME ------------------------------------------- */
.demo{background:var(--paper-2)}
.demo-top{display:grid;gap:26px;align-items:end;margin-bottom:34px}
@media(min-width:1000px){.demo-top{grid-template-columns:1fr auto}}
.tabs{display:inline-flex;justify-self:start;max-width:100%;gap:0;overflow-x:auto;border:1px solid var(--line);background:var(--paper);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{
  position:relative;flex:none;padding:15px 20px;font-family:var(--f-mono);font-size:10.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--grey);border-right:1px solid var(--line);
  transition:color .35s var(--ease),background .35s var(--ease);
}
.tabs button:last-child{border-right:0}
.tabs button::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--umber);transform:scaleX(0);transition:transform .45s var(--ease-out)}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{color:var(--ink);background:var(--paper-3)}
.tabs button[aria-selected="true"]::after{transform:scaleX(1)}

.frame{border:1px solid var(--line);background:var(--ink);padding:10px;box-shadow:0 40px 90px -50px rgba(12,11,10,.6)}
.frame-bar{display:flex;align-items:center;gap:14px;padding:0 6px 10px}
.frame-bar .dots{display:flex;gap:6px}
.frame-bar .dots i{width:7px;height:7px;border-radius:50%;background:rgba(242,239,233,.2)}
.frame-bar .url{flex:1;font-family:var(--f-mono);font-size:10px;letter-spacing:.09em;color:var(--grey-2);background:rgba(242,239,233,.06);padding:6px 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frame-bar .badge{font-family:var(--f-mono);font-size:9px;letter-spacing:.16em;color:var(--bronze-lt);border:1px solid rgba(var(--capp-rgb),.4);padding:4px 8px;white-space:nowrap}
@media(max-width:600px){.frame-bar .badge{display:none}}
.app{background:var(--paper);min-height:clamp(430px,52vw,620px);display:grid;grid-template-columns:1fr;position:relative;overflow:hidden}
@media(min-width:860px){.app{grid-template-columns:216px 1fr}}
.app-side{background:#131110;color:var(--paper);padding:22px 0;display:none;flex-direction:column}
@media(min-width:860px){.app-side{display:flex}}
.app-side .lg{display:flex;align-items:center;gap:10px;padding:0 20px 22px;border-bottom:1px solid var(--line-dark-soft);margin-bottom:16px}
.app-side .lg img{width:19px}
.app-side .lg span{font-family:var(--f-mono);font-size:9px;letter-spacing:.17em;color:var(--grey-2);line-height:1.3}
.app-side .lg span b{display:block;color:var(--paper);letter-spacing:.2em;font-weight:500}
.app-side nav{display:flex;flex-direction:column;gap:1px;flex:1}
.app-side nav b{
  padding:10px 20px;font-family:var(--f-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:#8F8880;font-weight:400;display:flex;align-items:center;gap:11px;border-left:2px solid transparent;transition:all .3s var(--ease);
}
.app-side nav b s{width:4px;height:4px;background:currentColor;transform:rotate(45deg);text-decoration:none;flex:none}
.app-side nav b.on{color:var(--paper);background:rgba(242,239,233,.05);border-left-color:var(--bronze)}
.app-side .who{padding:16px 20px 0;border-top:1px solid var(--line-dark-soft);margin-top:16px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;color:var(--grey-2);line-height:1.6}
.app-side .who b{color:var(--paper);display:block;letter-spacing:.13em}
.app-main{padding:clamp(16px,2.1vw,28px);overflow:hidden}
.app-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:20px}
.app-head h4{font-size:19px;font-weight:600;letter-spacing:-.015em}
.app-head .sm{font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;color:var(--grey);text-transform:uppercase;margin-top:5px}
.app-head .act{display:flex;gap:8px}
.app-head .act u{text-decoration:none;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;border:1px solid var(--line);padding:8px 12px;color:var(--grey)}
.app-head .act u.p{background:var(--umber);border-color:var(--umber);color:var(--paper)}
.panel{display:none;animation:panelIn .55s var(--ease-out)}
.panel.on{display:block}
@keyframes panelIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:18px}
@media(min-width:700px){.kpis{grid-template-columns:repeat(4,1fr)}}
.kpi{background:var(--paper);padding:15px 16px}
.kpi .k{font-family:var(--f-mono);font-size:9px;letter-spacing:.15em;color:var(--grey);text-transform:uppercase}
.kpi .v{font-size:clamp(19px,2vw,25px);font-weight:600;letter-spacing:-.03em;margin-top:7px;line-height:1}
.kpi .d{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.06em;margin-top:6px;color:var(--bronze)}
.kpi .d.neg{color:#8A5A4A}
.two{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:980px){.two{grid-template-columns:1.45fr 1fr}}
.blk{border:1px solid var(--line);background:var(--paper)}
.blk-h{display:flex;align-items:center;justify-content:space-between;padding:12px 15px;border-bottom:1px solid var(--line);font-family:var(--f-mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--grey)}
.blk-h em{font-style:normal;color:var(--bronze)}
table.t{width:100%;border-collapse:collapse;font-size:12.5px}
table.t th{font-family:var(--f-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);text-align:left;font-weight:400;padding:10px 15px;border-bottom:1px solid var(--line)}
table.t td{padding:11px 15px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
table.t tr:last-child td{border-bottom:0}
table.t tbody tr{transition:background .3s}
table.t tbody tr:hover{background:var(--paper-2)}
table.t .num{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.02em;text-align:right;white-space:nowrap}
table.t .nm{font-weight:500}
table.t .nm s{display:block;text-decoration:none;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.08em;color:var(--grey);margin-top:3px}
@media(max-width:520px){table.t .hid{display:none}}
.tag{font-family:var(--f-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;padding:4px 8px;border:1px solid var(--line);color:var(--grey);white-space:nowrap;display:inline-block}
.tag.br{border-color:rgba(var(--brand-rgb),.45);color:var(--umber);background:rgba(var(--brand-rgb),.07)}
.tag.dk{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.bars{display:flex;align-items:flex-end;gap:clamp(4px,1vw,10px);height:132px;padding:16px 15px 0}
.bars .b{flex:1;background:var(--paper-3);position:relative;transition:background .3s}
.bars .b i{position:absolute;left:0;right:0;bottom:0;background:var(--ink);transform-origin:bottom;transform:scaleY(0);transition:transform .9s var(--ease-out)}
.on .bars .b i{transform:scaleY(1)}
.bars .b:nth-child(n) i{transition-delay:calc(var(--i,0) * .06s)}
.bars .b.hi i{background:var(--umber)}
.bars-x{display:flex;gap:clamp(4px,1vw,10px);padding:8px 15px 15px;font-family:var(--f-mono);font-size:8.5px;letter-spacing:.08em;color:var(--grey)}
.bars-x span{flex:1;text-align:center}
.lst{padding:4px 0}
.lst li{display:flex;gap:13px;padding:11px 15px;border-bottom:1px solid var(--line-soft);align-items:flex-start}
.lst li:last-child{border-bottom:0}
.lst .tm{font-family:var(--f-mono);font-size:10px;letter-spacing:.06em;color:var(--bronze);flex:none;padding-top:2px;width:52px}
.lst .tx{font-size:12.5px;line-height:1.5}
.lst .tx s{display:block;text-decoration:none;font-size:11.5px;color:var(--grey);margin-top:2px}
.prog-row{padding:12px 15px;border-bottom:1px solid var(--line-soft)}
.prog-row:last-child{border-bottom:0}
.prog-row .top{display:flex;justify-content:space-between;gap:12px;font-size:12.5px;margin-bottom:8px}
.prog-row .top s{text-decoration:none;font-family:var(--f-mono);font-size:10px;color:var(--grey)}
.prog-row .bar{height:3px;background:var(--paper-3);position:relative}
.prog-row .bar i{position:absolute;inset:0 auto 0 0;background:var(--umber);transform-origin:left;transform:scaleX(0);transition:transform 1s var(--ease-out)}
.on .prog-row .bar i{transform:scaleX(1)}
.cal{display:grid;grid-template-columns:46px repeat(5,1fr);border:1px solid var(--line);font-size:11px;overflow:hidden}
.cal .hd{font-family:var(--f-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);padding:9px 8px;border-bottom:1px solid var(--line);background:var(--paper-2)}
.cal .hr{font-family:var(--f-mono);font-size:9px;color:var(--grey-2);padding:8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line-soft);text-align:right}
.cal .cell{border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);min-height:46px;padding:3px;position:relative}
.cal .ev{position:absolute;inset:3px;padding:5px 6px;font-size:10px;line-height:1.3;overflow:hidden;background:var(--ink);color:var(--paper)}
.cal .ev.br{background:var(--umber)}
.cal .ev.gh{background:var(--paper-3);color:var(--char);border-left:2px solid var(--bronze)}
.cal .ev s{display:block;text-decoration:none;font-family:var(--f-mono);font-size:8px;letter-spacing:.08em;opacity:.75;margin-top:2px}
@media(max-width:760px){.cal{grid-template-columns:40px repeat(3,1fr)}.cal .c4,.cal .c5{display:none}}
.thread{display:flex;flex-direction:column;gap:12px;padding:15px}
.msg{max-width:78%;padding:11px 14px;font-size:12.5px;line-height:1.5;border:1px solid var(--line)}
.msg s{display:block;text-decoration:none;font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;color:var(--grey);margin-bottom:6px}
.msg.out{align-self:flex-end;background:var(--ink);color:var(--paper);border-color:var(--ink)}
.msg.out s{color:var(--grey-2)}
.msg.auto{border-style:dashed;border-color:rgba(var(--brand-rgb),.5);background:rgba(var(--brand-rgb),.06)}
.dnut{display:flex;align-items:center;gap:20px;padding:18px 15px}
.dnut svg{width:110px;height:110px;flex:none}
.dnut ul{display:grid;gap:9px;font-size:12px}
.dnut li{display:flex;align-items:center;gap:9px}
.dnut li i{width:8px;height:8px;flex:none}
.dnut li em{font-style:normal;font-family:var(--f-mono);font-size:11px;margin-left:auto;padding-left:14px}
.demo-note{margin-top:22px;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;color:var(--grey)}

/* --- INDUSTRIES --------------------------------------------- */
.ind-grid{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--line)}
@media(min-width:1000px){.ind-grid{grid-template-columns:300px 1fr}}
.ind-list{border-right:0;border-bottom:1px solid var(--line)}
@media(min-width:1000px){.ind-list{border-right:1px solid var(--line);border-bottom:0}}
.ind-list button{
  width:100%;text-align:left;display:flex;align-items:center;gap:14px;padding:17px 22px 17px 0;
  border-bottom:1px solid var(--line-soft);font-family:var(--f-mono);font-size:11px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--grey);transition:color .35s var(--ease),padding .45s var(--ease-out);position:relative;
}
.ind-list button:last-child{border-bottom:0}
.ind-list button em{font-style:normal;font-size:9.5px;color:var(--grey-2);width:22px;flex:none}
.ind-list button::before{content:"";position:absolute;left:-2px;top:50%;width:0;height:1px;background:var(--umber);transition:width .45s var(--ease-out);transform:translateY(-50%)}
.ind-list button:hover{color:var(--ink)}
.ind-list button[aria-selected="true"]{color:var(--ink);padding-left:26px}
.ind-list button[aria-selected="true"]::before{width:16px}
.ind-list button[aria-selected="true"] em{color:var(--umber)}
.ind-view{padding:clamp(24px,3vw,42px) 0 0;min-height:400px}
@media(min-width:1000px){.ind-view{padding:clamp(24px,3vw,42px) 0 0 clamp(28px,3.4vw,56px)}}
.ind-view h3{font-size:clamp(21px,2.3vw,30px);font-weight:600;letter-spacing:-.025em;margin-bottom:12px}
.ind-view .d{color:var(--grey);max-width:56ch;font-size:15px;line-height:1.7;margin-bottom:30px}
.mods{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media(min-width:760px){.mods{grid-template-columns:repeat(4,1fr)}}
.mod{background:var(--paper);padding:18px 16px;position:relative;min-height:110px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;transition:background .4s var(--ease)}
.mod:hover{background:var(--paper-2)}
.mod .mi{font-family:var(--f-mono);font-size:9px;letter-spacing:.14em;color:var(--grey-2)}
.mod .mn{font-size:13px;font-weight:500;letter-spacing:.01em;line-height:1.35;margin-top:auto}
.mod .mx{font-family:var(--f-mono);font-size:9px;color:var(--grey);letter-spacing:.08em;margin-top:6px}
.mod::after{content:"";position:absolute;right:0;top:0;width:0;height:2px;background:var(--umber);transition:width .5s var(--ease-out)}
.mod:hover::after{width:100%}
.mod.new{animation:modIn .55s var(--ease-out) backwards}
@keyframes modIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}

/* --- INFRASTRUCTURE ----------------------------------------- */
.infra{background:var(--ink);background-image:radial-gradient(120% 90% at 18% 0%,rgba(var(--taupe-rgb),.13),transparent 58%),linear-gradient(180deg,#151310 0%,#0D0D0D 46%,#100E0C 100%);color:var(--paper);overflow:hidden}
.infra .sec-idx{color:var(--bronze-lt)}
.infra-grid{display:grid;grid-template-columns:1fr;gap:clamp(40px,5vw,72px);align-items:center}
@media(min-width:1000px){.infra-grid{grid-template-columns:1fr 1.05fr}}
.infra-list{display:grid;gap:0;border-top:1px solid var(--line-dark-soft)}
.infra-list li{border-bottom:1px solid var(--line-dark-soft);padding:20px 0;display:grid;grid-template-columns:34px 1fr;gap:16px;align-items:baseline}
.infra-list li span{font-family:var(--f-mono);font-size:10px;color:var(--bronze);letter-spacing:.12em}
.infra-list li b{font-size:14px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;display:block;margin-bottom:6px}
.infra-list li p{font-size:14px;color:var(--grey-2);line-height:1.62;max-width:46ch}
.infra-vis{position:relative;aspect-ratio:1/.92;border:1px solid var(--line-dark-soft)}
.infra-vis svg{width:100%;height:100%;display:block}

/* --- SERVICES ----------------------------------------------- */
.srv{border-top:1px solid var(--line)}
.srv-row{display:grid;grid-template-columns:1fr;gap:clamp(26px,3.5vw,60px);padding-block:clamp(46px,6vw,92px);border-bottom:1px solid var(--line);align-items:center}
@media(min-width:1000px){.srv-row{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}.srv-row.rev .srv-txt{order:2}}
.srv-txt .n{display:flex;align-items:baseline;gap:14px;color:var(--bronze);margin-bottom:20px}
.srv-txt h3{font-size:clamp(26px,3.4vw,46px);font-weight:600;letter-spacing:-.03em;text-transform:uppercase;line-height:1.02;margin-bottom:18px}
.srv-txt>p{color:var(--grey);max-width:50ch;font-size:15.5px;line-height:1.7;margin-bottom:24px}
.srv-caps{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:30px}
.srv-caps span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line);padding:7px 11px;color:var(--grey);transition:.35s var(--ease)}
.srv-caps span:hover{border-color:var(--umber);color:var(--umber)}
.srv-vis{position:relative;aspect-ratio:16/10.4;background:var(--paper-2);border:1px solid var(--line);overflow:hidden}
.srv-vis svg{position:absolute;inset:0;width:100%;height:100%}

/* --- PROCESSUS ---------------------------------------------- */
.proc{background:var(--paper-2)}
.proc-track{position:relative;border-top:1px solid var(--line)}
.proc-track::before{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:var(--umber);transform:scaleX(var(--p,0));transform-origin:left;transition:transform .2s linear}
.pstep{display:grid;grid-template-columns:1fr;gap:14px;padding-block:clamp(26px,3.2vw,44px);border-bottom:1px solid var(--line);position:relative;transition:background .5s var(--ease)}
@media(min-width:820px){.pstep{grid-template-columns:104px 250px 1fr;gap:34px;align-items:start}}
.pstep:hover{background:rgba(var(--brand-rgb),.035)}
.pstep .pn{font-family:var(--f-display);font-size:clamp(26px,3vw,40px);font-weight:400;color:var(--paper-3);line-height:.9;transition:color .5s var(--ease)}
.pstep:hover .pn{color:var(--umber)}
.pstep h3{font-size:15px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding-top:.4em}
.pstep p{color:var(--grey);font-size:14.5px;line-height:1.68;max-width:60ch;padding-top:.35em}
.pstep .out{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px}
.pstep .out i{font-style:normal;font-family:var(--f-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);border-left:1px solid var(--bronze);padding-left:8px;margin-right:10px}

/* --- IMPACT ------------------------------------------------- */
.imp-grid{display:grid;grid-template-columns:1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media(min-width:640px){.imp-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.imp-grid{grid-template-columns:repeat(5,1fr)}}
.imp{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(24px,2.6vw,38px) clamp(18px,2vw,28px);position:relative;overflow:hidden;min-height:210px;display:flex;flex-direction:column}
.imp .ii{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.16em;color:var(--grey-2);margin-bottom:auto}
.imp h3{font-size:14px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;margin:26px 0 11px}
.imp p{font-size:13.5px;color:var(--grey);line-height:1.62}
.imp::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--umber);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease-out)}
.imp:hover::after{transform:scaleX(1)}

/* --- RÉALISATIONS ------------------------------------------- */
.cases{background:var(--ink);background-image:radial-gradient(120% 90% at 18% 0%,rgba(var(--taupe-rgb),.13),transparent 58%),linear-gradient(180deg,#151310 0%,#0D0D0D 46%,#100E0C 100%);color:var(--paper)}
.cases .sec-idx{color:var(--bronze-lt)}
.case{border-top:1px solid var(--line-dark-soft);padding-block:clamp(34px,4.4vw,66px);display:grid;grid-template-columns:1fr;gap:28px}
@media(min-width:1000px){.case{grid-template-columns:minmax(0,1fr) minmax(0,1.22fr);gap:clamp(34px,4vw,70px);align-items:center}}
.case:last-of-type{border-bottom:1px solid var(--line-dark-soft)}
.case .meta{display:flex;gap:16px;align-items:center;color:var(--bronze-lt);margin-bottom:18px}
.case .meta::after{content:"";flex:1;height:1px;background:var(--line-dark);max-width:70px}
.case h3{font-size:clamp(23px,2.9vw,38px);font-weight:600;letter-spacing:-.028em;text-transform:uppercase;line-height:1.04;margin-bottom:14px}
.case>div>p{color:var(--grey-2);font-size:15px;line-height:1.7;max-width:48ch;margin-bottom:22px}
.case .mlist{display:flex;flex-wrap:wrap;gap:6px}
.case .mlist span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-dark);padding:7px 10px;color:#B9B1A7;transition:.35s var(--ease)}
.case .mlist span:hover{border-color:var(--bronze);color:var(--bronze-lt)}
.case-vis{position:relative;aspect-ratio:16/10;background:#111}
.case-vis svg{position:absolute;inset:0;width:100%;height:100%}

/* --- WORDMARK BAND ------------------------------------------ */
.mark-band{background:var(--paper);padding-block:clamp(60px,8vw,120px);overflow:hidden;text-align:center;border-bottom:1px solid var(--line)}
.mark-band .mm{display:flex;justify-content:center;margin-bottom:clamp(26px,3.4vw,44px)}
.mark-band .mm img{width:clamp(46px,6vw,74px)}
.mark-band .wm{overflow:hidden}
.mark-band .wm .l1{
  display:block;font-family:var(--f-display);font-weight:500;color:var(--umber);
  font-size:clamp(52px,12.4vw,182px);line-height:.94;letter-spacing:.055em;
  text-indent:.055em;white-space:nowrap;
}
.mark-band .wm .l2{
  display:block;margin-top:clamp(12px,1.6vw,22px);font-family:var(--f-mono);
  font-size:clamp(8.5px,1.05vw,14px);letter-spacing:.52em;text-indent:.52em;
  color:var(--char);white-space:nowrap;
}
.mark-band .wm span{display:inline-block;transform:translateY(108%);opacity:0;transition:transform 1s var(--ease-out),opacity .8s var(--ease-out)}
.mark-band.in .wm span{transform:none;opacity:1}
.mark-band .sub{margin-top:clamp(22px,3vw,38px);display:flex;justify-content:center;flex-wrap:wrap;gap:10px 26px;color:var(--grey)}
.mark-band .sub s{text-decoration:none;display:flex;align-items:center;gap:9px}
.mark-band .sub s::before{content:"";width:5px;height:5px;border:1px solid var(--bronze);transform:rotate(45deg)}

/* --- CONTACT / FOOTER --------------------------------------- */
.foot{background:var(--ink);background-image:radial-gradient(120% 90% at 18% 0%,rgba(var(--taupe-rgb),.13),transparent 58%),linear-gradient(180deg,#151310 0%,#0D0D0D 46%,#100E0C 100%);color:var(--paper)}
.foot-cta{padding-block:clamp(60px,8vw,120px);border-bottom:1px solid var(--line-dark-soft);display:grid;gap:32px;align-items:end}
@media(min-width:900px){.foot-cta{grid-template-columns:1fr auto}}
.foot-cta h2{font-size:clamp(30px,5.2vw,72px);font-weight:600;letter-spacing:-.035em;text-transform:uppercase;line-height:1}
.foot-cta h2 em{font-family:var(--f-display);font-style:normal;font-weight:500;text-transform:none;letter-spacing:-.01em;color:var(--bronze-lt)}
.foot-cta p{color:var(--grey-2);max-width:44ch;margin-top:20px;font-size:15px;line-height:1.7}
.foot-main{padding-block:clamp(44px,5vw,74px);display:grid;grid-template-columns:1fr;gap:38px}
@media(min-width:760px){.foot-main{grid-template-columns:1.5fr 1fr 1fr}}
@media(min-width:1100px){.foot-main{grid-template-columns:1.7fr 1fr 1fr 1.1fr}}
.foot-main h4{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze);margin-bottom:20px}
.foot-main ul{display:grid;gap:11px}
.foot-main a{font-size:14px;color:#C9C1B7;position:relative;display:inline-block;transition:color .35s}
.foot-main a:hover{color:var(--paper)}
.foot-brand{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px}
.foot-brand img{width:32px}
.foot-brand div b{font-family:var(--f-display);font-size:15px;letter-spacing:.12em;display:block;line-height:1.4}
.foot-brand div s{text-decoration:none;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.16em;color:var(--grey-2);text-transform:uppercase}
.foot-note{color:var(--grey-2);font-size:13.5px;line-height:1.7;max-width:38ch}
.foot-bot{border-top:1px solid var(--line-dark-soft);padding-block:22px;display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;justify-content:space-between;color:var(--grey-2)}
.lang{display:flex;border:1px solid var(--line-dark);overflow:hidden}
.lang button{padding:7px 13px;font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;color:var(--grey-2);transition:.3s}
.lang button[aria-current="true"]{background:var(--paper);color:var(--ink)}

/* --- MODAL / INTAKE ----------------------------------------- */
.ov{position:fixed;inset:0;z-index:200;visibility:hidden;pointer-events:none}
.ov.open{visibility:visible;pointer-events:auto}
.ov .bg{position:absolute;inset:0;background:rgba(12,11,10,.68);backdrop-filter:blur(6px);opacity:0;transition:opacity .5s var(--ease)}
.ov.open .bg{opacity:1}
.sheet{
  position:absolute;right:0;top:0;bottom:0;width:min(700px,100%);background:var(--paper);
  transform:translateX(100%);transition:transform .78s var(--ease-out);display:flex;flex-direction:column;
}
.ov.open .sheet{transform:none}
.sheet-h{padding:22px var(--pad);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:18px;flex:none}
.sheet-h .t{display:flex;align-items:center;gap:12px}
.sheet-h .t img{width:22px}
.sheet-h .t span{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--grey);line-height:1.4}
.sheet-h .t span b{display:block;color:var(--ink);letter-spacing:.2em;font-weight:500}
.xbtn{width:40px;height:40px;border:1px solid var(--line);display:grid;place-items:center;transition:.35s var(--ease)}
.xbtn:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.steps-bar{display:flex;gap:0;flex:none;border-bottom:1px solid var(--line)}
.steps-bar div{flex:1;height:2px;background:var(--paper-3);position:relative}
.steps-bar div i{position:absolute;inset:0;background:var(--umber);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease-out)}
.steps-bar div.done i{transform:scaleX(1)}
.sheet-b{flex:1;overflow-y:auto;padding:clamp(26px,4vw,44px) var(--pad)}
.step{display:none}
.step.on{display:block;animation:panelIn .5s var(--ease-out)}
.step .sn{color:var(--bronze);margin-bottom:16px;display:flex;align-items:center;gap:12px}
.step .sn::after{content:"";flex:1;height:1px;background:var(--line)}
.step h3{font-size:clamp(22px,3vw,32px);font-weight:600;letter-spacing:-.028em;line-height:1.1;margin-bottom:10px}
.step>p{color:var(--grey);font-size:14.5px;line-height:1.65;margin-bottom:26px;max-width:48ch}
.opts{display:grid;gap:10px}
@media(min-width:560px){.opts.two-col{grid-template-columns:1fr 1fr}}
.opt{
  position:relative;display:flex;align-items:center;gap:14px;padding:17px 18px;border:1px solid var(--line);
  cursor:pointer;transition:border-color .35s var(--ease),background .35s var(--ease);background:var(--paper);
}
.opt:hover{border-color:var(--char)}
.opt input{position:absolute;opacity:0;width:0;height:0}
.opt .bx{width:15px;height:15px;border:1px solid var(--char);flex:none;position:relative;transition:.3s}
.opt .bx::after{content:"";position:absolute;inset:3px;background:var(--umber);transform:scale(0);transition:transform .3s var(--ease-out)}
.opt input:checked~.bx::after{transform:scale(1)}
.opt:has(input:checked){border-color:var(--umber);background:rgba(var(--brand-rgb),.06)}
.opt input:focus-visible~.bx{outline:2px solid var(--bronze);outline-offset:2px}
.opt .lb{font-size:14px;line-height:1.35}
.opt .lb s{display:block;text-decoration:none;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;color:var(--grey);margin-top:4px;text-transform:uppercase}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip-o{position:relative;cursor:pointer}
.chip-o input{position:absolute;opacity:0;width:0;height:0}
.chip-o span{display:block;font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line);padding:11px 14px;color:var(--grey);transition:.3s var(--ease)}
.chip-o input:checked+span{border-color:var(--umber);background:var(--umber);color:var(--paper)}
.chip-o input:focus-visible+span{outline:2px solid var(--bronze);outline-offset:2px}
.fields{display:grid;gap:18px}
@media(min-width:560px){.fields.two-col{grid-template-columns:1fr 1fr}}
.fld{position:relative}
.fld label{display:block;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--grey);margin-bottom:8px}
.fld input,.fld textarea,.fld select{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);padding:11px 0;
  font-family:var(--f-ui);font-size:15px;color:var(--ink);transition:border-color .4s var(--ease);
}
.fld textarea{resize:vertical;min-height:118px;line-height:1.6}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:none;border-bottom-color:var(--umber)}
.fld input::placeholder,.fld textarea::placeholder{color:var(--grey-2)}
.sheet-f{flex:none;padding:18px var(--pad);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--paper)}
.sheet-f .cnt{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;color:var(--grey)}
.sheet-f .grp{display:flex;gap:10px}
.done-msg{text-align:center;padding:40px 0}
.done-msg .ck{width:64px;height:64px;border:1px solid var(--umber);display:grid;place-items:center;margin:0 auto 26px;transform:rotate(45deg)}
.done-msg .ck svg{transform:rotate(-45deg)}
.done-msg h3{margin-bottom:12px}
.done-msg p{color:var(--grey);max-width:40ch;margin:0 auto 26px;font-size:15px;line-height:1.7}
.recap{border:1px solid var(--line);text-align:left;max-width:420px;margin:0 auto;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em}
.recap div{display:flex;justify-content:space-between;gap:16px;padding:11px 14px;border-bottom:1px solid var(--line-soft)}
.recap div:last-child{border-bottom:0}
.recap div b{color:var(--grey);font-weight:400;text-transform:uppercase;font-size:9.5px}
.recap div span{text-align:right;color:var(--ink)}
.recap .recap-sub{display:block;margin-top:3px;font-size:9.5px;letter-spacing:.04em;color:var(--grey)}

/* --- REVEAL ------------------------------------------------- */
[data-rv]{opacity:0;transform:translateY(26px);transition:opacity .95s var(--ease-out),transform .95s var(--ease-out)}
[data-rv].in{opacity:1;transform:none}
[data-rv][data-d="1"]{transition-delay:.08s}[data-rv][data-d="2"]{transition-delay:.16s}
[data-rv][data-d="3"]{transition-delay:.24s}[data-rv][data-d="4"]{transition-delay:.32s}
[data-rv][data-d="5"]{transition-delay:.4s}[data-rv][data-d="6"]{transition-delay:.48s}
.draw{stroke-dasharray:var(--len,1000);stroke-dashoffset:var(--len,1000);transition:stroke-dashoffset 1.7s var(--ease-out)}
.in .draw,.draw.in{stroke-dashoffset:0}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  [data-rv]{opacity:1;transform:none}
  h1.hero-h .l i{transform:none}
  .hero-sub,.hero-actions,.hero-meta,.hero-scroll{opacity:1;transform:none}
  .mark-band .wm span{transform:none;opacity:1}
  .draw{stroke-dashoffset:0}
}

/* ══════ SÉLECTEUR DE LANGUE ══════ */
.langsel{position:relative}
.langbtn{display:flex;align-items:center;gap:7px;padding:11px 12px;border:1px solid var(--line);font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;transition:border-color .35s var(--ease)}
.langbtn:hover{border-color:var(--ink)}
.langbtn svg{transition:transform .35s var(--ease)}
.langsel.open .langbtn svg{transform:rotate(180deg)}
.langmenu{position:absolute;top:calc(100% + 6px);right:0;min-width:158px;background:var(--paper);border:1px solid var(--line);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.35s var(--ease);z-index:5;box-shadow:0 24px 48px -30px rgba(12,11,10,.5)}
.langsel.open .langmenu{opacity:1;visibility:visible;transform:none}
.langmenu button{display:flex;align-items:baseline;gap:12px;width:100%;padding:12px 15px;text-align:left;border-bottom:1px solid var(--line-soft);transition:background .3s}
.langmenu li:last-child button{border-bottom:0}
.langmenu button:hover{background:var(--paper-2)}
.langmenu button b{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;color:var(--umber);font-weight:500}
.langmenu button span{font-size:13px}
.langmenu button[aria-selected="true"]{background:var(--paper-3)}
.mlang{display:flex;border:1px solid var(--line-dark)}
.mlang button{padding:9px 14px;font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;color:var(--grey-2)}
.mlang button[aria-current="true"]{background:var(--paper);color:var(--ink)}
.mmenu li a em{font-style:normal}
@media(max-width:1059px){.langsel{display:none}}

/* ══════ COMPARAISON ══════ */
.cmp{background:var(--paper-2)}
.proof{background:var(--paper-2)}
.cmp-grid{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--line)}
@media(min-width:800px){.cmp-grid{grid-template-columns:1fr 40px 1fr}}
.cmp-col{padding:clamp(26px,3vw,44px) 0}
@media(min-width:800px){.cmp-col{padding-right:clamp(20px,3vw,48px)}.cmp-col--q{padding-right:0;padding-left:clamp(20px,3vw,48px)}}
.cmp-col--q{background:linear-gradient(180deg,rgba(var(--brand-rgb),.05),transparent 62%)}
.cmp-h{margin-bottom:26px}
.cmp-h .mono{color:var(--grey-2);display:block;margin-bottom:12px}
.cmp-col--q .cmp-h .mono{color:var(--bronze)}
.cmp-h h3{font-size:clamp(19px,2.1vw,27px);font-weight:600;letter-spacing:-.024em;text-transform:uppercase;line-height:1.1}
.cmp-col--q .cmp-h h3{color:var(--umber)}
.cmp-col dl{margin:0}
.cmp-col dl>div{padding:17px 0;border-top:1px solid var(--line-soft);display:grid;gap:6px}
.cmp-col dt{font-size:13.5px;font-weight:600;letter-spacing:.03em;text-transform:uppercase}
.cmp-col dd{margin:0;font-size:14px;line-height:1.6;color:var(--grey);max-width:44ch}
.cmp-axis{display:none}
@media(min-width:800px){.cmp-axis{display:block;position:relative}.cmp-axis svg{position:absolute;inset:0;width:100%;height:100%}
.cmp-axis .ax{stroke:var(--line);stroke-width:1;stroke-dasharray:2 7}}
.cmp-note{margin-top:clamp(28px,3.4vw,48px);padding-top:26px;border-top:1px solid var(--line);max-width:74ch;font-size:15px;line-height:1.72;color:var(--char)}

/* ══════ CHAÎNE D'AUTOMATISATION ══════ */
.chain{display:grid;grid-template-columns:1fr;gap:0;border-top:1px solid var(--line);counter-reset:c;margin:0;padding:0;list-style:none}
@media(min-width:640px){.chain{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.chain{grid-template-columns:repeat(3,1fr)}}
.clink{display:flex;align-items:center;gap:16px;padding:20px 22px;border-bottom:1px solid var(--line);border-left:1px solid var(--line);position:relative}
.clink::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--umber);transition:width .6s var(--ease-out)}
.clink:hover::after{width:100%}
.clink .cn{color:var(--bronze);flex:none;width:26px}
.clink .cl{font-size:14.5px;font-weight:500;letter-spacing:.01em}
.clink .cl{flex:1}

/* ══════ SATISFACTION ══════ */
.proof{background:var(--paper-2)}
.proof-bar{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
@media(min-width:900px){.proof-bar{grid-template-columns:repeat(4,1fr)}}
.pb-cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(22px,2.6vw,34px);background:var(--paper)}
.pb-cell .stars{display:flex;gap:3px;margin-bottom:12px;min-height:13px}
.pb-v{font-size:clamp(26px,3.4vw,44px);font-weight:600;letter-spacing:-.035em;line-height:1;color:var(--umber)}
.pb-k{color:var(--grey);margin-top:10px}
.proof-flag{margin-top:14px;color:var(--grey-2);display:flex;align-items:center;gap:10px}
.proof-flag::before{content:"";width:6px;height:6px;border:1px solid var(--bronze);transform:rotate(45deg);flex:none}
.proof-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(30px,3.6vw,52px)}
@media(min-width:820px){.proof-grid{grid-template-columns:repeat(2,1fr)}}
.review{background:var(--paper);padding:clamp(24px,2.6vw,38px);display:flex;flex-direction:column;gap:18px;transition:background .4s var(--ease)}
.review:hover{background:var(--paper-2)}
.review-h{display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap}
.review-tag{border:1px solid var(--line);padding:5px 9px;color:var(--grey-2)}
.review-p{color:var(--bronze)}
.review-t{font-size:15.5px;line-height:1.68;color:var(--char);flex:1}
.review-f{border-top:1px solid var(--line-soft);padding-top:16px}
.review-f b{display:block;font-size:13.5px;font-weight:600;letter-spacing:.02em}
.review-f s{text-decoration:none;font-family:var(--f-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--grey);display:block;margin-top:5px}

/* ══════ CONSULTATION — FEUILLE ══════ */
.sheet{width:min(1080px,100%)}
.sheet-h-r{display:flex;align-items:center;gap:16px}
.sheet-h .t span em{font-style:normal;display:block;color:var(--grey);font-size:9.5px}
.sheet-h .cnt{color:var(--grey);letter-spacing:.16em}
.sheet-body{flex:1;display:grid;grid-template-columns:1fr;overflow:hidden;min-height:0}
@media(min-width:900px){.sheet-body{grid-template-columns:minmax(0,1fr) minmax(0,.82fr)}}
.q-col{overflow-y:auto;padding:clamp(26px,3.6vw,44px) clamp(22px,3vw,46px)}
.q-col .step{animation:panelIn .5s var(--ease-out)}
.q-col .sn{color:var(--bronze);margin-bottom:16px;display:flex;align-items:center;gap:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.18em}
.q-col .sn::after{content:"";flex:1;height:1px;background:var(--line)}
.q-col h3{font-size:clamp(21px,2.6vw,31px);font-weight:600;letter-spacing:-.028em;line-height:1.12;margin-bottom:10px}
.q-col .qh{color:var(--grey);font-size:14.5px;line-height:1.65;margin-bottom:26px;max-width:50ch}
.q-col .sub-l{margin:26px 0 12px;color:var(--grey)}
.q-col .err{margin-top:16px;color:#8A3B2A;font-size:13px;min-height:1em;opacity:0;transition:opacity .3s}
.q-col .err.on{opacity:1}
.q-col textarea{border:1px solid var(--line);padding:14px;background:var(--paper);width:100%;font-family:var(--f-ui);font-size:15px;line-height:1.6;resize:vertical}
.q-col textarea:focus{outline:none;border-color:var(--umber)}
.opts.two-col{display:grid;gap:10px}
@media(min-width:620px){.opts.two-col{grid-template-columns:1fr 1fr}}
.notice{border:1px solid rgba(var(--brand-rgb),.45);background:rgba(var(--brand-rgb),.07);padding:16px 18px;text-align:left;margin:24px auto 0;max-width:440px}
.notice b{display:block;color:var(--umber);margin-bottom:8px;letter-spacing:.16em;font-size:10px}
.notice p{font-size:13px;line-height:1.6;color:var(--char);margin:0;max-width:none;text-align:left}
.nextstep{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin:26px auto;max-width:440px;text-align:left}
.nextstep span{display:block;color:var(--bronze);font-size:10px;letter-spacing:.18em;margin-bottom:8px}
.nextstep p{font-size:14px;line-height:1.6;color:var(--char);margin:0}
.recap-t{margin:26px 0 12px;color:var(--grey);text-align:left;max-width:440px;margin-inline:auto}
.recap{max-width:440px}
.recap div b{white-space:nowrap}
.done-msg{padding:20px 0}
#next.is-busy{opacity:.65;pointer-events:none}

/* ══════ ARCHITECTURE DU PROJET ══════ */
.bp-col{background:var(--ink);color:var(--paper);display:flex;flex-direction:column;padding:clamp(20px,2.4vw,30px);overflow-y:auto}
@media(max-width:899px){.bp-col{order:-1;max-height:30vh;padding-block:16px}
#sheet-hint{display:none}
.sheet-f{justify-content:flex-end}}
.bp-h{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--line-dark-soft)}
.bp-h .mono{color:var(--bronze-lt);letter-spacing:.18em}
.bp-count{border:1px solid var(--line-dark);padding:4px 9px;color:var(--grey-2)}
.bp-stage{position:relative;width:100%;aspect-ratio:1;max-height:44vh;margin:auto}
#blueprint{width:100%;height:100%;display:block}
.bp-l{opacity:0;animation:bpIn .6s var(--ease-out) forwards}
.bp-n{opacity:0;animation:bpIn .6s var(--ease-out) forwards}
@keyframes bpIn{to{opacity:1}}
.bp-empty{color:var(--grey-2);text-align:center;line-height:1.7;max-width:30ch;margin:auto;letter-spacing:.06em;text-transform:none;font-size:10.5px}
.bp-legend{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line-dark-soft);list-style:none}
.bp-legend:empty{display:none}
.bp-legend li{font-family:var(--f-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-dark);padding:6px 9px;color:#B9B1A7}
.bp-legend li.svc{border-color:var(--bronze);color:var(--bronze-lt)}
@media(max-width:899px){.bp-stage{max-height:19vh;margin-block:6px}.bp-legend{display:none}}


/* ══════════════════════════════════════════════════════════
   DEMONSTRATION — RAIL EN FAMILLES, ECRANS PHARES, APPARENCE
   Tout est porte par les jetons --d-* de .frame : la demo peut
   changer de couleurs sans qu'une seule regle du site bouge.
   ══════════════════════════════════════════════════════════ */

/* Toute la demo suit le theme, en 180 ms, sans clignotement. */
.frame,.frame *{transition:background-color .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease)}
@media(prefers-reduced-motion:reduce){.frame,.frame *{transition:none}}

/* ── Rail lateral : quatre familles repliables ───────────── */
.app-side .ngrp{display:flex;flex-direction:column}
.app-side .ngh{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;
  background:0;border:0;cursor:pointer;padding:11px 10px 6px;
  font-family:var(--f-mono);font-size:8.6px;letter-spacing:.19em;text-transform:uppercase;
  color:#7E8794;transition:color .2s var(--ease)}
.app-side .ngh:hover{color:#B9C0CA}
.app-side .ngh svg{flex:none;transition:transform .22s var(--ease);opacity:.7}
.app-side .ngrp.open .ngh svg{transform:rotate(180deg)}
.app-side .ngh:focus-visible{outline:2px solid var(--d-ac,var(--br));outline-offset:2px;border-radius:4px}
.app-side .ngb{display:none;flex-direction:column;gap:1px;padding-bottom:4px}
.app-side .ngrp.open .ngb{display:flex}
.app-side nav{overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}
.app-side nav::-webkit-scrollbar{width:3px}
.app-side nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:3px}

/* ── Bandeau d'apparence ─────────────────────────────────── */
.demo-top{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.demo-top .tabs{flex:1 1 320px;min-width:0}
.appear{position:relative;flex:none}
.ap-t{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;cursor:pointer;
  background:var(--paper);border:1px solid var(--line);color:var(--ink);
  font-family:var(--f-mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  transition:border-color .2s var(--ease),color .2s var(--ease)}
.ap-t:hover{border-color:var(--umber);color:var(--umber)}
.ap-t:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}
.ap-p{position:absolute;right:0;top:calc(100% + 8px);z-index:30;width:min(310px,86vw);
  background:var(--paper);border:1px solid var(--line);padding:16px;
  box-shadow:0 30px 70px -40px rgba(12,11,10,.5);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s}
.appear.on .ap-p{opacity:1;visibility:visible;transform:none}
.ap-row{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.ap-row>s{text-decoration:none;font-family:var(--f-mono);font-size:8.8px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--grey)}
.ap-seg{display:flex;border:1px solid var(--line)}
.ap-seg button{flex:1;padding:7px 6px;cursor:pointer;background:0;border:0;color:var(--grey);
  font-family:var(--f-ui);font-size:11.5px;letter-spacing:.02em;
  transition:background .2s var(--ease),color .2s var(--ease)}
.ap-seg button+button{border-left:1px solid var(--line)}
.ap-seg button:hover{color:var(--ink)}
.ap-seg button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.ap-seg button:focus-visible{outline:2px solid var(--bronze);outline-offset:-2px}
.ap-sw{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ap-sw button,.ap-cst{width:30px;height:30px;padding:3px;cursor:pointer;background:0;
  border:1px solid var(--line);display:grid;place-items:center;position:relative;
  transition:border-color .2s var(--ease),transform .2s var(--ease)}
.ap-sw button:hover,.ap-cst:hover{transform:translateY(-1px)}
.ap-sw button[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.ap-sw button:focus-visible,.ap-cst:focus-within{outline:2px solid var(--bronze);outline-offset:2px}
.ap-sw i,.ap-cst i{display:block;width:100%;height:100%}
.ap-cst input[type=color]{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer;border:0;padding:0}
.ap-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding-top:12px;border-top:1px solid var(--line-soft)}
.ap-foot span{font-size:10.5px;line-height:1.45;color:var(--grey)}
.ap-foot button{flex:none;background:0;border:0;cursor:pointer;color:var(--umber);
  font-family:var(--f-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  border-bottom:1px solid transparent;transition:border-color .2s var(--ease)}
.ap-foot button:hover{border-bottom-color:var(--umber)}

/* L'accent choisi pilote l'etat actif du rail et les commandes. */
.frame .app-side nav b.on{border-left-color:var(--d-ac,var(--br))}
.frame .tabs button[aria-selected="true"]{background:var(--d-ac,var(--ink));color:var(--d-ac-ink,var(--paper))}

/* ── Scanner IA de depenses ──────────────────────────────── */
.scan{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:860px){.scan{grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:24px;align-items:start}}
.sc-rc{position:relative;background:var(--d-surf);border:1px solid var(--d-line);
  border-radius:var(--r-s);padding:16px 15px 14px;overflow:hidden;
  font-family:var(--f-mono);font-size:10.5px;color:var(--d-ink-2)}
.sc-rc-h b{display:block;font-family:var(--f-ui);font-size:12.6px;font-weight:600;color:var(--d-ink)}
.sc-rc-h s{text-decoration:none;display:block;font-size:9.6px;color:var(--d-mut);margin-top:2px}
.sc-rc-m{display:flex;justify-content:space-between;gap:10px;margin:10px 0 8px;
  padding-block:7px;border-block:1px dashed var(--d-line);font-size:9.4px;color:var(--d-mut)}
.sc-rc-t{width:100%;border-collapse:collapse}
.sc-rc-t td{padding:4px 0;vertical-align:top;font-size:10.2px}
.sc-rc-t td:last-child{text-align:right;white-space:nowrap;padding-left:8px}
.sc-rc-t b{display:block;font-family:var(--f-ui);font-size:11.2px;font-weight:500;color:var(--d-ink)}
.sc-rc-t s{text-decoration:none;font-size:9.2px;color:var(--d-mut)}
.sc-rc-f{margin-top:9px;padding-top:8px;border-top:1px dashed var(--d-line)}
.sc-rc-f div{display:flex;justify-content:space-between;gap:10px;padding:2.5px 0;font-size:10.2px}
.sc-rc-f .tot{margin-top:5px;padding-top:6px;border-top:1px solid var(--d-line);
  font-size:12px;font-weight:600;color:var(--d-ink)}
.sc-rc-p{margin-top:10px;font-size:9.4px;color:var(--d-mut);letter-spacing:.06em}
/* Le faisceau ne passe que pendant la lecture. */
.sc-beam{position:absolute;left:0;right:0;height:38%;top:-40%;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,transparent,var(--d-ac-s,rgba(125,83,54,.14)),transparent)}
.scan[data-state="busy"] .sc-beam{opacity:1;animation:scBeam 1.05s var(--ease) infinite}
@keyframes scBeam{from{top:-40%}to{top:104%}}
@media(prefers-reduced-motion:reduce){.scan[data-state="busy"] .sc-beam{animation:none;opacity:.5;top:32%}}
.sc-note{margin-top:9px;font-family:var(--f-mono);font-size:8.8px;line-height:1.55;
  letter-spacing:.05em;color:var(--d-mut-2)}
.sc-steps{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.sc-steps span{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;
  border:1px solid var(--d-line);border-radius:100px;
  font-family:var(--f-mono);font-size:8.8px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--d-mut-2);transition:color .2s var(--ease),border-color .2s var(--ease)}
.sc-steps span i{width:5px;height:5px;border-radius:50%;background:var(--d-mut-2);
  transition:background .2s var(--ease),transform .2s var(--ease)}
.sc-steps span.on{color:var(--d-ink);border-color:var(--d-ac,var(--br))}
.sc-steps span.on i{background:var(--d-ac,var(--br));transform:scale(1.25)}
.sc-steps span.done i{background:var(--em)}
.sc-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--d-line-2);border:1px solid var(--d-line);border-radius:var(--r-s);overflow:hidden}
@media(max-width:479px){.sc-fields{grid-template-columns:1fr}}
.sc-f{background:var(--d-surf);padding:10px 12px;min-height:52px;
  opacity:0;transform:translateY(4px);transition:opacity .24s var(--ease),transform .24s var(--ease)}
.sc-f.in{opacity:1;transform:none}
.scan[data-state="idle"] .sc-f{opacity:.24;transform:none}
.sc-f s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:8.4px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--d-mut-2);margin-bottom:3px}
.sc-f b{display:block;font-size:12.2px;font-weight:600;color:var(--d-ink);line-height:1.35;overflow-wrap:anywhere}
.sc-f[data-f="total"] b{color:var(--d-ac,var(--br))}
.sc-conf{display:flex;align-items:center;gap:10px;margin-top:12px;
  opacity:0;transition:opacity .3s var(--ease)}
.scan[data-state="read"] .sc-conf,.scan[data-state="saved"] .sc-conf{opacity:1}
.sc-conf s{text-decoration:none;font-family:var(--f-mono);font-size:8.4px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--d-mut)}
.sc-bar{flex:1;height:3px;background:var(--d-line);border-radius:3px;overflow:hidden;min-width:60px}
.sc-bar i{display:block;height:100%;width:0;background:var(--em);transition:width .7s var(--ease)}
.scan[data-state="read"] .sc-bar i,.scan[data-state="saved"] .sc-bar i{width:98%}
.sc-conf em{font-family:var(--f-mono);font-size:10px;font-style:normal;color:var(--d-ink);font-weight:600}
.sc-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.sc-act button{padding:9px 15px;cursor:pointer;border-radius:var(--r-s);
  font-family:var(--f-ui);font-size:11.6px;font-weight:500;letter-spacing:.01em;
  border:1px solid var(--d-line);background:var(--d-surf);color:var(--d-ink-2);
  transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),opacity .2s}
.sc-act button:hover:not(:disabled){border-color:var(--d-ac,var(--br));color:var(--d-ink)}
.sc-act button:focus-visible{outline:2px solid var(--d-ac,var(--br));outline-offset:2px}
.sc-act button:disabled{opacity:.55;cursor:default}
.sc-go{background:var(--d-ac,var(--br))!important;color:var(--d-ac-ink,#fff)!important;border-color:transparent!important}
.sc-save,.sc-again{display:none}
.scan[data-state="read"] .sc-save{display:inline-block}
.scan[data-state="read"] .sc-go,.scan[data-state="saved"] .sc-go{display:none}
.scan[data-state="saved"] .sc-again{display:inline-block}
.scan[data-state="saved"] .sc-save{display:none}
.sc-done{display:none;align-items:center;gap:8px;margin-top:14px;padding:10px 13px;
  border-radius:var(--r-s);background:var(--em-s);color:var(--em);
  font-family:var(--f-mono);font-size:9.6px;letter-spacing:.13em;text-transform:uppercase}
.scan[data-state="saved"] .sc-done{display:flex}

/* ── Propos : la personnalisation vient d'etre demontree ── */
.demo-pos{display:grid;grid-template-columns:1fr;gap:18px;
  margin-top:clamp(26px,3.4vw,44px);padding-top:clamp(24px,3vw,38px);
  border-top:1px solid var(--line)}
@media(min-width:860px){.demo-pos{grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,80px);align-items:start}}
.demo-pos-l{font-family:var(--f-display);font-size:clamp(19px,2.3vw,29px);line-height:1.28;
  letter-spacing:-.01em;color:var(--ink);margin:0}
.demo-pos-l em{display:block;font-style:normal;color:var(--umber);margin-top:.28em}
.demo-pos-r{margin:0;align-self:end}
.demo-pos-r b{display:block;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink);line-height:1.9}
.demo-pos-r s{text-decoration:none;display:block;margin-top:12px;font-size:12.6px;
  line-height:1.65;color:var(--grey);max-width:44ch}

/* ── Bande d'exploitation du tableau de bord ─────────────── */
.mini{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;
  background:var(--d-line-2);border-radius:var(--r-s);overflow:hidden}
@media(max-width:900px){.mini{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){.mini{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mini .mn:last-child:nth-child(odd){grid-column:1/-1}}
.mn{background:var(--d-surf);padding:11px 13px;position:relative;
  transition:background .2s var(--ease)}
.mn:hover{background:var(--d-surf-2)}
.mn::before{content:"";position:absolute;left:0;top:11px;bottom:11px;width:2px;
  border-radius:2px;background:var(--d-mut-2);opacity:.55}
.mn[data-tone="em"]::before{background:var(--em);opacity:1}
.mn[data-tone="bl"]::before{background:var(--bl);opacity:1}
.mn[data-tone="rd"]::before{background:var(--rd);opacity:1}
.mn[data-tone="tl"]::before{background:var(--tl);opacity:1}
.mn[data-tone="br"]::before{background:var(--d-ac,var(--br));opacity:1}
.mn s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:8.2px;
  letter-spacing:.15em;text-transform:uppercase;color:var(--d-mut-2);
  margin-bottom:4px;line-height:1.3}
.mn b{font-size:19px;font-weight:600;letter-spacing:-.01em;color:var(--d-ink);line-height:1}
.mn em{font-style:normal;font-family:var(--f-mono);font-size:9.4px;color:var(--d-mut);margin-left:5px}

/* ── Optimisation des routes ─────────────────────────────── */
.rt{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:860px){.rt{grid-template-columns:minmax(0,1fr) minmax(0,278px);gap:22px;align-items:start}}
.rt-map-w{background:var(--d-surf);border:1px solid var(--d-line);border-radius:var(--r-s);padding:12px}
.rt-map{display:block;width:100%;aspect-ratio:100/66;max-width:100%;overflow:hidden}
.rt-grid line{stroke:var(--d-line-2);stroke-width:.35}
.rt-p{stroke-width:1.1;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;
  opacity:.9;transition:opacity .42s var(--ease)}
.rt-b{opacity:0;transition:opacity .42s var(--ease)}
.rt-a{opacity:1;transition:opacity .42s var(--ease)}
.rt[data-opt="1"] .rt-a{opacity:0}
.rt[data-opt="1"] .rt-b{opacity:1}
.rt-a .rt-p{stroke-dasharray:3 2.4}
.rt-pin circle{fill:var(--d-surf);stroke:var(--d-ink-2);stroke-width:.8;vector-effect:non-scaling-stroke}
.rt-pin text{font-family:var(--f-mono);font-size:3.2px;fill:var(--d-ink-2);text-anchor:middle;dominant-baseline:central}
.rt[data-opt="1"] .rt-pin circle{stroke:var(--d-ac,var(--br))}
.rt-lg{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid var(--d-line-2)}
.rt-lg span{display:inline-flex;align-items:center;gap:6px;font-size:10.4px;color:var(--d-mut)}
.rt-lg i{width:9px;height:2px;border-radius:2px;flex:none}
.rt-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--d-line-2);border:1px solid var(--d-line);border-radius:var(--r-s);overflow:hidden}
.rt-s{background:var(--d-surf);padding:9px 11px}
.rt-s:last-child{grid-column:1/-1}
.rt-s s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:8.2px;
  letter-spacing:.15em;text-transform:uppercase;color:var(--d-mut-2);margin-bottom:2px}
.rt-s b{font-size:14px;font-weight:600;color:var(--d-ink)}
.rt-s[data-k="after"] b,.rt-s[data-k="saved"] b{color:var(--d-mut-2);transition:color .3s var(--ease)}
.rt[data-opt="1"] .rt-s[data-k="after"] b{color:var(--d-ac,var(--br))}
.rt[data-opt="1"] .rt-s[data-k="saved"] b{color:var(--em)}
.rt-s[data-k="before"] b{text-decoration:none}
.rt[data-opt="1"] .rt-s[data-k="before"] b{text-decoration:line-through;color:var(--d-mut-2)}
.rt-seq{margin-top:12px;opacity:.4;transition:opacity .32s var(--ease)}
.rt[data-opt="1"] .rt-seq{opacity:1}
.rt-seq s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:8.2px;
  letter-spacing:.15em;text-transform:uppercase;color:var(--d-mut-2);margin-bottom:7px}
.rt-seq ol{list-style:none;display:flex;flex-direction:column;gap:5px}
.rt-seq li{display:flex;align-items:center;gap:9px;font-size:11.4px;color:var(--d-ink-2);
  padding:6px 9px;border:1px solid var(--d-line);border-radius:var(--r-s);background:var(--d-surf)}
.rt-seq em{flex:none;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;
  background:var(--d-ac,var(--br));color:var(--d-ac-ink,#fff);font-style:normal;
  font-family:var(--f-mono);font-size:8.4px}
.rt-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.rt-act button{padding:9px 15px;cursor:pointer;border-radius:var(--r-s);
  font-family:var(--f-ui);font-size:11.6px;font-weight:500;
  border:1px solid var(--d-line);background:var(--d-surf);color:var(--d-ink-2);
  transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),opacity .2s}
.rt-act button:hover:not(:disabled){border-color:var(--d-ac,var(--br));color:var(--d-ink)}
.rt-act button:focus-visible{outline:2px solid var(--d-ac,var(--br));outline-offset:2px}
.rt-act button:disabled{opacity:.55;cursor:default}
.rt-go{background:var(--d-ac,var(--br))!important;color:var(--d-ac-ink,#fff)!important;border-color:transparent!important}
.rt[data-opt="1"] .rt-go{display:none}
.rt-rs{display:none}
.rt[data-opt="1"] .rt-rs{display:inline-block}
.rt-note{margin-top:12px;font-family:var(--f-mono);font-size:8.6px;line-height:1.6;
  letter-spacing:.04em;color:var(--d-mut-2)}

/* ── Adaptation aux petits ecrans ────────────────────────── */
@media(max-width:859px){
  .demo-top{align-items:stretch}
  .appear{align-self:flex-end}
  .sc-act,.rt-act{gap:6px}
  .sc-act button,.rt-act button{flex:1 1 auto;min-width:0}
}
@media(max-width:639px){
  .ap-p{width:min(300px,calc(100vw - 40px))}
  .rt-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sc-rc{font-size:10px}
}

/* ══════ DIVERS ══════ */
.mark-band .mm{margin-bottom:clamp(20px,2.6vw,34px)}
.value-grid .vcell h3{min-height:2.6em}
@media(max-width:719px){.value-grid .vcell h3{min-height:0}}

/* ══════════════════════════════════════════════════════════
   ACCENTS CUIVRÉS ET PROFONDEUR
   ══════════════════════════════════════════════════════════ */
.sec-idx{color:var(--umber-deep)}
.sec-idx::after{background:var(--umber);opacity:.55}
.frag .sec-idx,.infra .sec-idx,.cases .sec-idx{color:var(--bronze-soft)}
.frag .sec-idx::after,.infra .sec-idx::after,.cases .sec-idx::after{background:var(--bronze-soft);opacity:.75}

/* séparateurs et lignes décoratives */
.cmp-col dl>div{border-top-color:rgba(var(--brand-rgb),.16)}
.cmp-col--q{background:linear-gradient(180deg,rgba(var(--brand-rgb),.075),transparent 62%)}
.cmp-col--q .cmp-h h3{color:var(--umber-deep)}
.cmp-axis .ax{stroke:rgba(var(--brand-rgb),.42)}
.cmp-note{border-top-color:rgba(var(--brand-rgb),.28)}
.clink::after{background:var(--umber)}
.clink .cn{color:var(--umber-deep)}
.vcell .vn{color:var(--umber-deep)}
.vcell .ico{stroke:var(--umber-deep)}
.pb-v{color:var(--umber-deep)}
.proof-flag::before{border-color:var(--umber)}
.review-p{color:var(--umber-deep)}
.review-tag{border-color:rgba(var(--brand-rgb),.4);color:var(--umber-deep)}
.mark-band .sub s::before{border-color:var(--umber)}
.tlink{color:var(--umber-deep)!important}
.langbtn:hover{border-color:var(--umber);color:var(--umber-deep)}
.langmenu button b{color:var(--umber-deep)}
.tabs button:hover{border-color:var(--umber);color:var(--umber-deep)}
.lifecycle button b{color:var(--umber-deep)}
.lifecycle button:hover{border-color:var(--umber);color:var(--umber-deep)}
.lifecycle button.on{background:var(--umber-btn);border-color:var(--umber-btn);color:#FFF}
.lifecycle button.on b{color:var(--capp-100)}

/* sections sombres : lisibilité et éclat cuivré */
.frag .fnode .chip{background:#171412;border-color:rgba(201,155,120,.30);color:#DED7CE}
.frag .fnode .chip b{background:var(--bronze-lt)}
.fcore .box{border-color:var(--bronze-lt);background:rgba(var(--taupe-rgb),.20);
  box-shadow:0 0 0 1px rgba(201,155,120,.14),0 24px 60px -28px rgba(var(--capp-rgb),.55)}
.fcore .box i{background:var(--bronze-lt)}
.fcore .cap{color:var(--bronze-soft)}
.fstage::before,.fstage::after{border-color:var(--bronze-lt);opacity:.85}
.fstates .a span,.fstates .b span{color:#CFC8BF}
.fstates .b span{color:var(--bronze-soft)}
.infra-list li span{color:var(--bronze-lt)}
.infra-list li p{color:#C3BCB3}
.case .meta{color:var(--bronze-lt)}
.case .mlist span{border-color:rgba(201,155,120,.28);color:#D6CFC6}
.foot-main h4{color:var(--bronze-lt)}
.foot-main a:hover{color:var(--bronze-soft)}
.foot-note,.foot-cta p{color:#C3BCB3}
.foot-bot{color:#A79F96}
.mmenu li a em{color:#F2EFE9}
.mmenu li span{color:var(--bronze-lt)}
.bp-h .mono{color:var(--bronze-soft)}
.bp-legend li.svc{border-color:var(--bronze);color:var(--bronze-soft)}

/* ══════════════════════════════════════════════════════════
   FLOTTAISON — le système est suspendu, pas posé
   ══════════════════════════════════════════════════════════ */
@keyframes quadraFloat{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-24px,0)}
  100%{transform:translate3d(0,0,0)}
}
@keyframes cardFloat{
  0%{transform:translate3d(0,0,0) rotate(0deg)}
  50%{transform:translate3d(0,-11px,0) rotate(var(--rot,.35deg))}
  100%{transform:translate3d(0,0,0) rotate(0deg)}
}
@keyframes coreFloat{
  0%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-4px,0)}
  100%{transform:translate3d(0,0,0)}
}
/* La courbe ralentit franchement aux extrémités : montée, suspension, descente. */
#scene{
  animation:quadraFloat 3.8s cubic-bezier(.45,.05,.55,.95) infinite;
  filter:drop-shadow(0 30px 52px rgba(120,70,35,.18));
  will-change:transform;
}
#scene .fl{animation:cardFloat 4.4s cubic-bezier(.42,0,.58,1) infinite;will-change:transform;transform-box:fill-box;transform-origin:center}
#scene .core-g .fl,#scene .core-g{animation:coreFloat 5.2s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){
  #scene,#scene .fl,#scene .core-g{animation:none}
}

/* ══════════════════════════════════════════════════════════
   SYSTÈME DE DÉMONSTRATION — langage visuel distinct
   Le site reste blanc / noir / brun. Le produit, lui, utilise
   la couleur pour transmettre de l'information.
   ══════════════════════════════════════════════════════════ */
.frame{
  --d-bg:#F6F7F9; --d-surf:#FFFFFF; --d-surf-2:#FBFBFC;
  --d-ink:#0E1116; --d-ink-2:#2C333D; --d-mut:#69717D; --d-mut-2:#9AA1AC;
  --d-line:rgba(14,17,22,.09); --d-line-2:rgba(14,17,22,.055);
  --d-nav:#12161C; --d-nav-2:#1B2029;
  --em:#0B9A6D; --em-s:rgba(11,154,109,.10);
  --am:#AB6B17; --am-s:rgba(171,107,23,.13);
  --rd:#CE4A3F; --rd-s:rgba(206,74,63,.11);
  --bl:#2E6BE6; --bl-s:rgba(46,107,230,.10);
  --tl:#0E93A3; --tl-s:rgba(14,147,163,.11);
  --vi:#6D53F0; --vi-s:rgba(109,83,240,.10);
  --br:var(--espresso-400); --br-s:rgba(var(--brand-rgb),.12);
  --r:12px; --r-s:9px; --r-l:16px;
  border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;
  background:var(--d-nav);box-shadow:0 40px 90px -60px rgba(12,11,10,.55);
}
.frame-bar{background:var(--d-nav);border-bottom:1px solid rgba(255,255,255,.08);border-radius:0}
.frame-bar .url{border-radius:100px;background:rgba(255,255,255,.06);border:0;color:#A7AEBA}
.frame-bar .badge{border-radius:100px;border-color:rgba(var(--capp-rgb),.5)}
.app{display:grid;grid-template-columns:1fr;background:var(--d-bg);min-height:600px}
@media(min-width:900px){.app{grid-template-columns:212px minmax(0,1fr)}}

/* ── Rail latéral ───────────────────────────────────────── */
.app-side{background:var(--d-nav);padding:16px 12px;display:none;flex-direction:column;gap:2px}
@media(min-width:900px){.app-side{display:flex}}
.app-side .lg{display:flex;align-items:center;gap:10px;padding:6px 10px 18px}
.app-side .lg img{width:22px}
.app-side .lg span{font-size:14px;line-height:1.2;color:#F2EFE9;letter-spacing:.01em}
.app-side .lg b{display:block;font-weight:600;letter-spacing:.02em}
.app-side .lg img{width:24px}
.app-side .lg span s{text-decoration:none;color:#767E8B;font-size:10px}
.app-side nav{display:flex;flex-direction:column;gap:1px;flex:1;overflow:hidden}
.app-side b[data-nav]{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:var(--r-s);
  font-size:12.2px;font-weight:400;color:#98A0AD;cursor:pointer;transition:background .22s,color .22s}
.app-side b[data-nav] i{width:14px;height:14px;flex:none;opacity:.75}
.app-side b[data-nav]:hover{background:rgba(255,255,255,.05);color:#DDE1E7}
.app-side b[data-nav].on{background:rgba(255,255,255,.10);color:#fff}
.app-side b[data-nav].on i{opacity:1}
.app-side .who{display:flex;align-items:center;gap:9px;margin-top:14px;padding:10px;border-top:1px solid rgba(255,255,255,.08)}
.app-side .who .av{width:26px;height:26px;border-radius:50%;background:linear-gradient(140deg,var(--espresso-400),var(--espresso-800));
  display:grid;place-items:center;font-size:10px;font-weight:600;color:#fff;flex:none}
.app-side .who span{font-size:11px;line-height:1.3;color:#98A0AD}
.app-side .who b{display:block;color:#E7EAEE;font-size:11.5px;font-weight:500}

/* ── Barre supérieure : recherche + actions + activité ──── */
.app-main{background:var(--d-bg);min-width:0;display:flex;flex-direction:column}
.app-top{display:flex;align-items:center;gap:10px;padding:11px 14px;background:var(--d-surf);
  border-bottom:1px solid var(--d-line);position:relative;z-index:6}
.usearch{flex:1;position:relative;min-width:0}
.usearch input{width:100%;border:1px solid var(--d-line);border-radius:100px;padding:8px 12px 8px 32px;
  font-family:var(--f-ui);font-size:12.5px;color:var(--d-ink);background:var(--d-surf-2);transition:border-color .22s,box-shadow .22s}
.usearch input::placeholder{color:var(--d-mut-2)}
.usearch input:focus{outline:none;border-color:var(--bl);box-shadow:0 0 0 3px var(--bl-s);background:#fff}
.usearch svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);opacity:.4;pointer-events:none}
.uresults{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--d-line);
  border-radius:var(--r);box-shadow:0 24px 50px -24px rgba(14,17,22,.28);overflow:hidden;display:none;z-index:9}
.uresults.on{display:block}
.uresults b{display:flex;align-items:center;gap:10px;padding:9px 12px;font-weight:400;font-size:12.5px;
  color:var(--d-ink-2);cursor:pointer;border-bottom:1px solid var(--d-line-2)}
.uresults b:last-child{border-bottom:0}
.uresults b:hover{background:var(--d-surf-2)}
.uresults b em{font-style:normal;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--d-mut);border:1px solid var(--d-line);border-radius:100px;padding:2px 7px;margin-left:auto;flex:none}
.uresults .none{color:var(--d-mut);font-size:12px;padding:12px}
.app-top .qa{position:relative;flex:none}
.qa-btn{display:flex;align-items:center;gap:6px;border-radius:100px;background:var(--d-ink);color:#fff;
  padding:8px 13px;font-size:12px;font-weight:500;transition:opacity .2s}
.qa-btn:hover{opacity:.86}
.qa-menu{position:absolute;top:calc(100% + 6px);right:0;background:#fff;border:1px solid var(--d-line);
  border-radius:var(--r);box-shadow:0 24px 50px -24px rgba(14,17,22,.28);min-width:184px;padding:5px;
  opacity:0;visibility:hidden;transform:translateY(-5px);transition:.22s var(--ease);z-index:9}
.qa.on .qa-menu{opacity:1;visibility:visible;transform:none}
.qa-menu b{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:var(--r-s);
  font-size:12.3px;font-weight:400;color:var(--d-ink-2);cursor:pointer}
.qa-menu b:hover{background:var(--d-surf-2)}
.qa-menu b s{text-decoration:none;width:5px;height:5px;border-radius:50%;flex:none}
.bell{position:relative;flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--d-line);
  display:grid;place-items:center;background:#fff;transition:background .2s}
.bell:hover{background:var(--d-surf-2)}
.bell i{position:absolute;top:6px;right:7px;width:6px;height:6px;border-radius:50%;background:var(--rd);border:1.5px solid #fff}
.bell-panel{position:absolute;top:calc(100% + 6px);right:0;width:min(320px,86vw);background:#fff;
  border:1px solid var(--d-line);border-radius:var(--r);box-shadow:0 24px 50px -24px rgba(14,17,22,.28);
  opacity:0;visibility:hidden;transform:translateY(-5px);transition:.22s var(--ease);z-index:9;overflow:hidden}
.bell-wrap{position:relative;flex:none}
.bell-wrap.on .bell-panel{opacity:1;visibility:visible;transform:none}
.bell-panel .h{padding:11px 13px;border-bottom:1px solid var(--d-line);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--d-mut);font-family:var(--f-mono)}
.bell-panel ul{max-height:280px;overflow-y:auto}
.bell-panel li{display:flex;gap:9px;padding:10px 13px;border-bottom:1px solid var(--d-line-2);align-items:flex-start}
.bell-panel li s{text-decoration:none;width:7px;height:7px;border-radius:50%;margin-top:5px;flex:none}
.bell-panel li div{min-width:0}
.bell-panel li b{display:block;font-size:12.3px;font-weight:500;color:var(--d-ink)}
.bell-panel li span{font-size:11px;color:var(--d-mut)}

/* ── Corps du panneau ───────────────────────────────────── */
.app-body{padding:16px;overflow:hidden}
@media(min-width:700px){.app-body{padding:20px}}
.panel{display:none;animation:pIn .42s var(--ease-out)}
.panel.on{display:block}
@keyframes pIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.ph{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.ph h4{font-size:20px;font-weight:600;letter-spacing:-.022em;color:var(--d-ink)}
.ph .sm{font-size:12px;color:var(--d-mut);margin-top:4px}
.ph .act{display:flex;gap:7px;flex-wrap:wrap}
.ph u{text-decoration:none;font-size:11.6px;font-weight:500;padding:7px 13px;border-radius:100px;
  border:1px solid var(--d-line);color:var(--d-ink-2);cursor:pointer;background:#fff;transition:.2s}
.ph u:hover{border-color:var(--d-ink);}
.ph u.p{background:var(--d-ink);color:#fff;border-color:var(--d-ink)}
.ph u.p:hover{opacity:.86}

/* ── Grille fluide ──────────────────────────────────────── */
.g{display:grid;gap:12px;grid-template-columns:repeat(12,1fr);margin-bottom:12px}
.g:last-child{margin-bottom:0}
.c{grid-column:span 12}
.c-3{grid-column:span 6}
@media(min-width:640px){
  .c-3{grid-column:span 6}.c-4{grid-column:span 6}.c-6{grid-column:span 12}
  .c-8{grid-column:span 12}.c-9{grid-column:span 12}
}
@media(min-width:980px){
  .c-3{grid-column:span 3}.c-4{grid-column:span 4}.c-5{grid-column:span 5}
  .c-6{grid-column:span 6}.c-7{grid-column:span 7}.c-8{grid-column:span 8}.c-9{grid-column:span 9}
}
.card{background:var(--d-surf);border:1px solid var(--d-line);border-radius:var(--r);
  padding:15px;transition:box-shadow .3s var(--ease),transform .3s var(--ease)}
.card:hover{box-shadow:0 14px 34px -22px rgba(14,17,22,.30)}
.card.flat{background:transparent;border:0;padding:0}
.ch{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:13px}
.ch b{font-size:12.6px;font-weight:600;color:var(--d-ink);letter-spacing:-.005em}
.ch em{font-style:normal;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--d-mut-2)}

/* ── Tuiles KPI ─────────────────────────────────────────── */
.tile{background:var(--d-surf);border:1px solid var(--d-line);border-radius:var(--r);padding:14px;
  display:flex;flex-direction:column;gap:9px;position:relative;overflow:hidden}
.tile .tk{font-size:11px;color:var(--d-mut);letter-spacing:.01em;display:flex;align-items:center;gap:6px}
.tile .tk s{text-decoration:none;width:6px;height:6px;border-radius:2px;flex:none}
.tile .tv{font-size:clamp(20px,2.3vw,27px);font-weight:600;letter-spacing:-.032em;color:var(--d-ink);line-height:1}
.tile .td{font-size:11px;display:flex;align-items:center;gap:5px;color:var(--d-mut)}
.tile .td .dl{font-weight:600;border-radius:100px;padding:2px 7px;font-size:10.5px}
.up{color:var(--em);background:var(--em-s)}
.dn{color:var(--rd);background:var(--rd-s)}
.wr{color:var(--am);background:var(--am-s)}
.tile .spk{position:absolute;right:0;bottom:0;width:56%;height:38px;opacity:.9}

/* ── Anneaux / jauges ───────────────────────────────────── */
.rings{display:flex;gap:14px;flex-wrap:wrap;justify-content:space-around}
.ring{text-align:center;flex:1;min-width:88px}
.ring svg{width:80px;height:80px;transform:rotate(-90deg)}
.ring .rv{font-size:15px;font-weight:600;color:var(--d-ink);margin-top:-52px;position:relative;letter-spacing:-.02em}
.ring .rk{font-size:10.5px;color:var(--d-mut);margin-top:34px}

/* ── Puces d'état ───────────────────────────────────────── */
.pill{display:inline-flex;align-items:center;gap:5px;border-radius:100px;padding:3.5px 9px;
  font-size:10.8px;font-weight:600;letter-spacing:.01em;white-space:nowrap}
.pill s{text-decoration:none;width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}
.p-em{color:var(--em);background:var(--em-s)}.p-am{color:var(--am);background:var(--am-s)}
.p-rd{color:var(--rd);background:var(--rd-s)}.p-bl{color:var(--bl);background:var(--bl-s)}
.p-tl{color:var(--tl);background:var(--tl-s)}.p-vi{color:var(--vi);background:var(--vi-s)}
.p-br{color:var(--br);background:var(--br-s)}
.p-gy{color:var(--d-mut);background:rgba(14,17,22,.055)}

/* ── Tables modernes ────────────────────────────────────── */
.dt{width:100%;border-collapse:collapse;font-size:12.4px}
.dt th{text-align:left;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--d-mut-2);font-weight:400;padding:0 10px 9px;border-bottom:1px solid var(--d-line)}
.dt td{padding:10px;border-bottom:1px solid var(--d-line-2);color:var(--d-ink-2);vertical-align:middle}
.dt tr:last-child td{border-bottom:0}
.dt tbody tr{transition:background .2s}
.dt tbody tr:hover{background:var(--d-surf-2)}
.dt td.num{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;color:var(--d-ink);white-space:nowrap}
.dt .nm{display:flex;align-items:center;gap:9px;min-width:0}
.dt .nm b{font-weight:600;color:var(--d-ink);font-size:12.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dt .nm s{text-decoration:none;display:block;font-size:10.8px;color:var(--d-mut);white-space:nowrap}
.av{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;font-size:10px;
  font-weight:600;color:#fff;flex:none;letter-spacing:.02em}
@media(max-width:820px){.dt .hid{display:none}}

/* ── Barres / aires / sparklines ────────────────────────── */
.chart{width:100%;display:block}
.lgnd{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:11px}
.lgnd span{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--d-mut)}
.lgnd i{width:8px;height:8px;border-radius:3px;flex:none}
.lgnd em{font-style:normal;color:var(--d-ink);font-weight:600;margin-left:2px}

/* ── Fil d'activité ─────────────────────────────────────── */
.feed{position:relative;padding-left:16px}
.feed::before{content:"";position:absolute;left:4px;top:5px;bottom:5px;width:1px;background:var(--d-line)}
.feed li{position:relative;padding:0 0 13px}
.feed li:last-child{padding-bottom:0}
.feed li s{text-decoration:none;position:absolute;left:-16px;top:4px;width:9px;height:9px;
  border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--d-line)}
.feed li b{display:block;font-size:12.4px;font-weight:500;color:var(--d-ink)}
.feed li span{font-size:11px;color:var(--d-mut)}
.feed li em{font-style:normal;font-family:var(--f-mono);font-size:9.5px;color:var(--d-mut-2);float:right}

/* ── Pipeline (colonnes) ────────────────────────────────── */
.pipe{display:grid;gap:9px;grid-auto-flow:column;grid-auto-columns:minmax(158px,1fr);
  overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.pcol{background:var(--d-surf-2);border:1px solid var(--d-line-2);border-radius:var(--r);padding:9px;min-width:0}
.pcol>.h{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:9px;padding:0 2px}
.pcol>.h b{font-size:11.4px;font-weight:600;color:var(--d-ink);display:flex;align-items:center;gap:6px}
.pcol>.h b i{width:6px;height:6px;border-radius:2px;flex:none}
.pcol>.h em{font-style:normal;font-size:10px;color:var(--d-mut);font-family:var(--f-mono)}
.pcard{background:#fff;border:1px solid var(--d-line);border-radius:var(--r-s);padding:10px;margin-bottom:7px;
  cursor:grab;transition:box-shadow .25s,transform .25s}
.pcard:last-child{margin-bottom:0}
.pcard:hover{box-shadow:0 10px 22px -14px rgba(14,17,22,.35);transform:translateY(-1px)}
.pcard b{display:block;font-size:12.2px;font-weight:600;color:var(--d-ink);margin-bottom:3px}
.pcard s{text-decoration:none;display:block;font-size:10.6px;color:var(--d-mut);margin-bottom:8px}
.pcard .f{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pcard .f em{font-style:normal;font-size:12px;font-weight:600;color:var(--d-ink);font-variant-numeric:tabular-nums}
.pbar{height:3px;border-radius:2px;background:var(--d-line);margin-top:8px;overflow:hidden}
.pbar i{display:block;height:100%;border-radius:2px}

/* ── Frise / échéancier ─────────────────────────────────── */
.tl-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--d-line-2)}
.tl-row:last-child{border-bottom:0}
.tl-row .lb{width:112px;flex:none;font-size:11.6px;color:var(--d-ink-2);font-weight:500}
.tl-row .tr{flex:1;height:16px;background:var(--d-surf-2);border-radius:100px;position:relative;overflow:hidden;min-width:0}
.tl-row .tr i{position:absolute;top:0;bottom:0;border-radius:100px;display:flex;align-items:center;
  padding:0 8px;font-size:9.5px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden}
.tl-row .st{width:74px;flex:none;text-align:right}
@media(max-width:700px){.tl-row .lb{width:84px;font-size:10.8px}.tl-row .st{display:none}}

/* ── Calendrier ─────────────────────────────────────────── */
.cv{display:flex;gap:6px;margin-bottom:11px}
.cv button{font-size:11.3px;font-weight:500;padding:6px 12px;border-radius:100px;border:1px solid var(--d-line);
  color:var(--d-mut);background:#fff;transition:.2s}
.cv button[aria-pressed="true"]{background:var(--d-ink);color:#fff;border-color:var(--d-ink)}
.cal2{display:grid;grid-template-columns:46px repeat(5,minmax(0,1fr));gap:1px;background:var(--d-line-2);
  border:1px solid var(--d-line);border-radius:var(--r);overflow:hidden}
.cal2>div{background:#fff;min-height:34px;padding:5px}
.cal2 .hd{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--d-mut);background:var(--d-surf-2);padding:8px 6px;text-align:center}
.cal2 .hr{font-family:var(--f-mono);font-size:9.5px;color:var(--d-mut-2);background:var(--d-surf-2);text-align:center;padding-top:8px}
.cal2 .ev{display:block;border-radius:6px;padding:5px 7px;font-size:10.5px;font-weight:600;line-height:1.25;
  cursor:grab;border-left:2.5px solid;transition:transform .2s}
.cal2 .ev:hover{transform:translateX(1px)}
.cal2 .ev s{text-decoration:none;display:block;font-weight:400;font-size:9.5px;opacity:.78;margin-top:1px}
@media(max-width:820px){.cal2{grid-template-columns:38px repeat(3,minmax(0,1fr))}.cal2 .c4,.cal2 .c5{display:none}}

/* ── Messagerie ─────────────────────────────────────────── */
.chat{display:flex;flex-direction:column;gap:9px;max-height:330px;overflow-y:auto;padding-right:4px}
.bub{max-width:82%;border-radius:14px;padding:9px 12px;font-size:12.4px;line-height:1.5;position:relative}
.bub s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:9px;letter-spacing:.06em;
  opacity:.62;margin-bottom:4px}
.bub.in{background:var(--d-surf-2);border:1px solid var(--d-line);color:var(--d-ink-2);border-bottom-left-radius:4px;align-self:flex-start}
.bub.out{background:var(--d-ink);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
.bub.auto{background:var(--vi-s);border:1px solid rgba(109,83,240,.22);color:#3B2C86;align-self:flex-start;border-bottom-left-radius:4px}
.convs li{display:flex;gap:9px;padding:9px;border-radius:var(--r-s);cursor:pointer;transition:background .2s;align-items:center}
.convs li:hover,.convs li.on{background:var(--d-surf-2)}
.convs li div{min-width:0;flex:1}
.convs li b{display:block;font-size:12.2px;font-weight:600;color:var(--d-ink)}
.convs li span{display:block;font-size:11px;color:var(--d-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.convs li em{font-style:normal;font-size:9.5px;color:var(--d-mut-2);font-family:var(--f-mono);flex:none}
.unread{width:7px;height:7px;border-radius:50%;background:var(--bl);flex:none}

/* ── Automatisations ────────────────────────────────────── */
.auto{border:1px solid var(--d-line);border-radius:var(--r);overflow:hidden;background:#fff}
.auto+.auto{margin-top:10px}
.auto .ah{display:flex;align-items:center;gap:9px;padding:11px 13px;background:var(--d-surf-2);border-bottom:1px solid var(--d-line)}
.auto .ah b{font-size:12.5px;font-weight:600;color:var(--d-ink);flex:1}
.sw{width:32px;height:18px;border-radius:100px;background:var(--em);position:relative;flex:none}
.sw::after{content:"";position:absolute;top:2px;right:2px;width:14px;height:14px;border-radius:50%;background:#fff}
.sw.off{background:var(--d-line)}.sw.off::after{right:auto;left:2px}
.auto .ab{padding:13px;display:grid;gap:11px}
@media(min-width:620px){.auto .ab{grid-template-columns:auto 1fr;align-items:start}}
.wh{display:flex;align-items:center;gap:8px}
.wh em{font-style:normal;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;color:var(--vi);
  background:var(--vi-s);border-radius:100px;padding:4px 9px;flex:none}
.wh span{font-size:12.3px;color:var(--d-ink);font-weight:500}
.thn{display:grid;gap:6px}
.thn div{display:flex;align-items:center;gap:8px;font-size:12.2px;color:var(--d-ink-2)}
.thn div i{width:14px;height:1px;background:var(--d-line);flex:none;position:relative}
.thn div i::after{content:"";position:absolute;right:0;top:-2px;width:4px;height:4px;border-top:1px solid var(--d-mut-2);
  border-right:1px solid var(--d-mut-2);transform:rotate(45deg)}

/* ── Documents ──────────────────────────────────────────── */
.docs{display:grid;gap:9px;grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}
.doc{border:1px solid var(--d-line);border-radius:var(--r-s);padding:11px;background:#fff;transition:.25s;cursor:pointer}
.doc:hover{box-shadow:0 12px 26px -18px rgba(14,17,22,.35);transform:translateY(-2px)}
.doc .ic{width:26px;height:32px;border-radius:3px;margin-bottom:9px;display:grid;place-items:center;
  font-family:var(--f-mono);font-size:8px;font-weight:600;color:#fff;letter-spacing:.04em}
.doc b{display:block;font-size:11.8px;font-weight:600;color:var(--d-ink);line-height:1.3;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc s{text-decoration:none;font-size:10.3px;color:var(--d-mut)}

/* ── Facture / devis (aperçu papier) ────────────────────── */
.paper{background:#fff;border:1px solid var(--d-line);border-radius:var(--r);padding:18px;font-size:12px;color:var(--d-ink-2)}
.paper .pt{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;
  padding-bottom:14px;border-bottom:1px solid var(--d-line);margin-bottom:13px;flex-wrap:wrap}
.paper .pt h5{font-size:16px;font-weight:600;color:var(--d-ink);letter-spacing:-.02em}
.paper .pt s{text-decoration:none;font-family:var(--f-mono);font-size:10px;color:var(--d-mut);letter-spacing:.08em}
.paper table{width:100%;border-collapse:collapse;font-size:11.8px}
.paper td{padding:7px 0;border-bottom:1px solid var(--d-line-2)}
.paper td:last-child{text-align:right;font-variant-numeric:tabular-nums}
.paper tfoot td{border-bottom:0;padding-top:9px;color:var(--d-mut)}
.paper tfoot tr:last-child td{font-size:14px;font-weight:600;color:var(--d-ink);border-top:1px solid var(--d-line);padding-top:10px}
.sig{margin-top:14px;padding:11px 13px;border:1px dashed rgba(11,154,109,.4);border-radius:var(--r-s);
  background:var(--em-s);display:flex;align-items:center;gap:10px}
.sig svg{flex:none}
.sig b{display:block;font-size:11.8px;color:#08644A;font-weight:600}
.sig span{font-size:10.6px;color:#3E7D6A}

/* ── Portails ───────────────────────────────────────────── */
.portal{border:1px solid var(--d-line);border-radius:var(--r);overflow:hidden;background:#fff}
.portal .pbar2{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--d-line)}
.portal .pbar2 b{font-size:11.6px;font-weight:600;color:var(--d-ink)}
.portal .pbar2 .pill{margin-left:auto}
.portal .pb2{padding:13px;display:grid;gap:9px}
.prow{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--d-line-2);border-radius:var(--r-s)}
.prow div{flex:1;min-width:0}
.prow b{display:block;font-size:12.1px;font-weight:600;color:var(--d-ink)}
.prow s{text-decoration:none;font-size:10.6px;color:var(--d-mut)}

/* ── Onglets du module (site) ───────────────────────────── */
.tabs{display:flex;justify-self:start;max-width:100%;overflow-x:auto;gap:5px;border:0;padding-bottom:4px;scrollbar-width:thin}
.tabs button{border:1px solid var(--line);border-radius:100px;padding:8px 15px;font-family:var(--f-mono);
  font-size:10.4px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);white-space:nowrap;
  background:transparent;transition:.25s var(--ease)}
.tabs button:hover{border-color:var(--ink);color:var(--ink)}
.tabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.tabs button::after{display:none}

/* ── Fil narratif du cycle de vie ───────────────────────── */
.lifecycle{display:flex;gap:6px;overflow-x:auto;padding:14px 0 4px;scrollbar-width:thin;margin-bottom:6px}
.lifecycle button{display:flex;align-items:center;gap:8px;flex:none;border:1px solid var(--line);
  border-radius:100px;padding:8px 14px;font-size:11.6px;color:var(--grey);transition:.25s var(--ease);background:transparent}
.lifecycle button b{font-family:var(--f-mono);font-size:9.5px;color:var(--bronze);font-weight:500}
.lifecycle button:hover{border-color:var(--ink);color:var(--ink)}
.lifecycle button.on{background:var(--umber);border-color:var(--umber);color:#fff}
.lifecycle button.on b{color:var(--bronze-lt)}
.lc-note{font-size:13.5px;color:var(--grey);margin-top:4px;min-height:1.5em}

.card .paper{border:0;padding:0;border-radius:0}
.tile .tv{position:relative;z-index:1}
.tile .td{position:relative;z-index:1}

/* ══════════════════════════════════════════════════════════
   VITRINES PRODUIT — vraies interfaces dans des appareils
   ══════════════════════════════════════════════════════════ */
.showcase{margin-top:clamp(30px,4vw,56px)}
.sw-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:18px;scrollbar-width:thin}
.sw-tabs button{flex:none;border:1px solid var(--line);border-radius:100px;padding:9px 16px;
  font-family:var(--f-mono);font-size:10.4px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--grey);background:transparent;transition:.25s var(--ease);white-space:nowrap}
.sw-tabs button:hover{border-color:var(--umber);color:var(--umber-deep)}
.sw-tabs button[aria-selected="true"]{background:var(--umber-btn);border-color:var(--umber-btn);color:#fff}
.sw-stage{position:relative}
.sw-view{display:none}
.sw-view.on{display:block;animation:swIn .5s var(--ease-out)}
@keyframes swIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.sw-head{display:grid;gap:14px;margin-bottom:18px}
@media(min-width:900px){.sw-head{grid-template-columns:1fr auto;align-items:end}}
.sw-head .mono{color:var(--umber-deep);display:block;margin-bottom:8px}
.sw-head h4{font-size:clamp(19px,2.2vw,27px);font-weight:600;letter-spacing:-.026em;text-transform:uppercase}
.sw-head p{color:var(--grey);font-size:14.5px;line-height:1.65;max-width:60ch;margin-top:8px}
.sw-feats{display:flex;flex-wrap:wrap;gap:6px}
.sw-feats span{border:1px solid var(--line);border-radius:100px;padding:5px 11px;
  font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.sw-feats span::before{content:"";display:inline-block;width:4px;height:4px;background:var(--umber);
  transform:rotate(45deg);margin-right:7px;vertical-align:middle}

/* ── Cadres d'appareils ────────────────────────────────── */
.dev{position:relative;display:grid;gap:16px}
@media(min-width:900px){.dev.both{grid-template-columns:minmax(0,1fr) 232px;align-items:end}}
.mac{border-radius:14px;overflow:hidden;border:1px solid rgba(14,17,22,.14);background:#12161C;
  box-shadow:0 44px 90px -52px rgba(12,11,10,.55)}
.mac-bar{display:flex;align-items:center;gap:9px;padding:9px 12px;background:#12161C}
.mac-bar i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.18);flex:none}
.mac-bar span{flex:1;text-align:center;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.06em;
  color:#8F97A3;background:rgba(255,255,255,.06);border-radius:100px;padding:4px 12px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mac-vp{height:clamp(330px,42vw,470px);overflow:hidden;position:relative;background:#fff}
.mac-scroll{position:absolute;inset:0;overflow:hidden}
.mac-scroll>div{transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
.mac:hover .mac-scroll>div{transform:translateY(var(--sy,-120px))}
.mac-hint{position:absolute;right:10px;bottom:10px;z-index:4;font-family:var(--f-mono);font-size:8.5px;
  letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(14,17,22,.62);
  border-radius:100px;padding:5px 10px;opacity:.85;transition:opacity .3s;backdrop-filter:blur(4px)}
.mac:hover .mac-hint{opacity:0}
.phone{justify-self:center;width:222px;border-radius:30px;border:1px solid rgba(14,17,22,.16);
  background:#12161C;padding:8px;box-shadow:0 40px 70px -44px rgba(12,11,10,.55);
  animation:phoneFloat 7.2s ease-in-out infinite}
@keyframes phoneFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-9px,0)}}
.phone-vp{border-radius:23px;overflow:hidden;background:#fff;height:434px;position:relative}
.phone-notch{position:absolute;left:50%;top:0;transform:translateX(-50%);width:74px;height:17px;
  background:#12161C;border-radius:0 0 11px 11px;z-index:5}
@media(prefers-reduced-motion:reduce){.phone{animation:none}.mac:hover .mac-scroll>div{transform:none}}

/* ── UI générique dans les maquettes ───────────────────── */
.u{--ui:#0E1116;--um:#69717D;--ul:rgba(14,17,22,.09);--us:#F6F7F9;
  font-family:var(--f-ui);color:var(--ui);background:#fff;min-height:100%}
.u *{box-sizing:border-box}
.u-nav{display:flex;align-items:center;gap:18px;padding:13px 20px;border-bottom:1px solid var(--ul)}
.u-nav b{font-size:13.5px;font-weight:700;letter-spacing:-.01em;flex:none}
.u-nav b s{text-decoration:none;color:var(--acc)}
.u-nav nav{display:flex;gap:15px;font-size:11px;color:var(--um);flex:1}
.u-nav .cta{font-size:10.5px;font-weight:600;color:#fff;background:var(--acc);border-radius:100px;padding:6px 13px;flex:none}
.u-hero{position:relative;padding:26px 20px;overflow:hidden}
.u-hero .u-h1{font-size:27px;line-height:1.05;letter-spacing:-.035em;font-weight:700;max-width:11ch}
.u-hero .u-h1 em{font-style:normal;color:var(--acc)}
.u-hero p{font-size:11.5px;color:var(--um);margin-top:9px;max-width:34ch;line-height:1.55}
.u-hero .btns{display:flex;gap:8px;margin-top:14px}
.u-hero .btns a{font-size:10.5px;font-weight:600;border-radius:100px;padding:8px 15px}
.u-hero .btns a:first-child{background:var(--acc);color:#fff}
.u-hero .btns a+a{border:1px solid var(--ul);color:var(--ui)}
.u-sec{padding:18px 20px;border-top:1px solid var(--ul)}
.u-lb{font-family:var(--f-mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc);margin-bottom:10px}
.u-h2{font-size:15px;font-weight:700;letter-spacing:-.02em;margin-bottom:12px}
.u-grid{display:grid;gap:9px}
.u-g2{grid-template-columns:1fr 1fr}.u-g3{grid-template-columns:repeat(3,1fr)}.u-g4{grid-template-columns:repeat(4,1fr)}
.u-card{border:1px solid var(--ul);border-radius:10px;overflow:hidden;background:#fff;transition:.35s var(--ease)}
.u-card:hover{box-shadow:0 16px 30px -20px rgba(14,17,22,.4);transform:translateY(-2px)}
.u-img{height:74px;background:linear-gradient(135deg,#E9E6E1,#CFC8C0);position:relative}
.u-img.a{background:linear-gradient(135deg,#DED5CB,#B49E88)}
.u-img.b{background:linear-gradient(140deg,#CBD3DC,#98A5B3)}
.u-img.c{background:linear-gradient(140deg,#E3DAD2,#C2A78E)}
.u-img.d{background:linear-gradient(140deg,#D6DCD8,#9FB0A7)}
.u-img i{position:absolute;left:8px;top:8px;font-style:normal;font-size:8.5px;font-weight:600;
  background:rgba(255,255,255,.9);border-radius:100px;padding:3px 8px;color:var(--ui)}
.u-card .b{padding:9px 10px}
.u-card .b b{display:block;font-size:11.5px;font-weight:600;letter-spacing:-.01em}
.u-card .b s{text-decoration:none;display:block;font-size:10px;color:var(--um);margin-top:2px}
.u-card .b em{font-style:normal;display:block;font-size:12px;font-weight:700;margin-top:6px;color:var(--acc)}
.u-row{display:flex;align-items:center;gap:9px;padding:9px 10px;border:1px solid var(--ul);border-radius:9px;background:#fff}
.u-row .av{width:24px;height:24px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-size:9px;font-weight:700;color:#fff;background:var(--acc)}
.u-row div{flex:1;min-width:0}
.u-row b{display:block;font-size:11.5px;font-weight:600}
.u-row s{text-decoration:none;display:block;font-size:10px;color:var(--um)}
.u-pill{font-size:9px;font-weight:700;border-radius:100px;padding:3px 8px;white-space:nowrap}
.u-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:11px}
.u-chips span{font-size:9.5px;font-weight:600;border:1px solid var(--ul);border-radius:100px;padding:5px 10px;color:var(--um)}
.u-chips span.on{background:var(--acc);border-color:var(--acc);color:#fff}
.u-stat{border:1px solid var(--ul);border-radius:10px;padding:10px}
.u-stat s{text-decoration:none;display:block;font-size:9.5px;color:var(--um)}
.u-stat b{display:block;font-size:17px;font-weight:700;letter-spacing:-.03em;margin-top:3px}
.u-stat em{font-style:normal;font-size:9px;font-weight:700;border-radius:100px;padding:2px 6px;margin-top:5px;display:inline-block}
.u-up{color:#0B9A6D;background:rgba(11,154,109,.11)}
.u-dn{color:#CE4A3F;background:rgba(206,74,63,.11)}
.u-wr{color:#AB6B17;background:rgba(171,107,23,.13)}
.u-side{background:#12161C;padding:13px 10px;display:flex;flex-direction:column;gap:2px}
.u-side b.lg{display:flex;align-items:center;gap:8px;color:#fff;font-size:12px;font-weight:700;padding:2px 8px 12px}
.u-side b.lg i{width:16px;height:16px;border-radius:5px;background:var(--acc);flex:none;display:block}
.u-side a{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:7px;font-size:11px;color:#98A0AD}
.u-side a i{width:11px;height:11px;border-radius:3px;border:1.2px solid currentColor;flex:none;opacity:.7}
.u-side a.on{background:rgba(255,255,255,.10);color:#fff}
.u-app{display:grid;grid-template-columns:148px minmax(0,1fr);min-height:100%;background:var(--us)}
.u-main{padding:14px;min-width:0}
.u-top{display:flex;align-items:center;gap:9px;margin-bottom:13px}
.u-top .sr{flex:1;border:1px solid var(--ul);border-radius:100px;padding:6px 12px;font-size:10.5px;color:var(--um);background:#fff}
.u-top .ic{width:26px;height:26px;border-radius:50%;border:1px solid var(--ul);background:#fff;flex:none;position:relative}
.u-top .ic::after{content:"";position:absolute;top:5px;right:6px;width:5px;height:5px;border-radius:50%;background:#CE4A3F}
.u-bars{display:flex;align-items:flex-end;gap:5px;height:64px}
.u-bars i{flex:1;border-radius:3px 3px 0 0;background:var(--acc);opacity:.85;
  transform-origin:bottom;animation:barRise 1s var(--ease-out) backwards}
@keyframes barRise{from{transform:scaleY(.15);opacity:0}to{transform:scaleY(1);opacity:.85}}
.u-line{width:100%;height:66px;display:block}
.u-dot{width:6px;height:6px;border-radius:50%;background:#0B9A6D;flex:none;
  box-shadow:0 0 0 0 rgba(11,154,109,.5);animation:pulseDot 2.4s ease-out infinite}
@keyframes pulseDot{0%{box-shadow:0 0 0 0 rgba(11,154,109,.45)}70%{box-shadow:0 0 0 7px rgba(11,154,109,0)}100%{box-shadow:0 0 0 0 rgba(11,154,109,0)}}
.u-map{position:relative;height:118px;border-radius:10px;overflow:hidden;background:#EDEFF2;border:1px solid var(--ul)}
.u-map svg{position:absolute;inset:0;width:100%;height:100%}
.u-map .pin{position:absolute;width:9px;height:9px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);
  background:var(--acc);box-shadow:0 2px 5px rgba(0,0,0,.25)}
.u-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.u-cal span{aspect-ratio:1;border-radius:6px;display:grid;place-items:center;font-size:9px;color:var(--um);background:var(--us)}
.u-cal span.on{background:var(--acc);color:#fff;font-weight:700}
.u-cal span.dim{opacity:.35}
.u-ai{border:1px solid rgba(109,83,240,.28);background:linear-gradient(160deg,rgba(109,83,240,.09),rgba(109,83,240,0));
  border-radius:10px;padding:11px}
.u-ai .h{display:flex;align-items:center;gap:7px;font-size:10.5px;font-weight:700;color:#5A3FE0;margin-bottom:7px}
.u-ai .h i{width:14px;height:14px;border-radius:4px;background:#6D53F0;flex:none}
.u-ai p{font-size:10.5px;line-height:1.55;color:var(--ui)}
.u-ai .tp{display:inline-flex;gap:3px;margin-top:7px}
.u-ai .tp i{width:4px;height:4px;border-radius:50%;background:#6D53F0;animation:tp 1.3s ease-in-out infinite}
.u-ai .tp i:nth-child(2){animation-delay:.18s}.u-ai .tp i:nth-child(3){animation-delay:.36s}
@keyframes tp{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
.u-flow{display:grid;gap:7px}
.u-flow .n{display:flex;align-items:center;gap:8px;border:1px solid var(--ul);border-radius:8px;padding:8px 10px;font-size:10.5px;background:#fff}
.u-flow .n i{width:16px;height:16px;border-radius:5px;flex:none;display:grid;place-items:center;
  font-size:8px;font-weight:700;color:#fff;font-style:normal}
.u-toast{display:flex;align-items:center;gap:8px;border:1px solid var(--ul);border-radius:9px;padding:8px 10px;
  background:#fff;font-size:10.5px;box-shadow:0 10px 22px -16px rgba(14,17,22,.4);
  animation:toastIn .6s var(--ease-out) backwards}
@keyframes toastIn{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

/* ── Phone UI ──────────────────────────────────────────── */
.p-top{padding:26px 15px 12px;background:var(--acc);color:#fff}
.p-top s{text-decoration:none;font-size:9.5px;opacity:.82;display:block}
.p-top b{display:block;font-size:16px;font-weight:700;letter-spacing:-.02em;margin-top:2px}
.p-body{padding:13px 13px 16px;display:grid;gap:9px}
.p-card{border:1px solid var(--ul);border-radius:11px;padding:11px;background:#fff}
.p-card .r{display:flex;justify-content:space-between;align-items:center;gap:8px}
.p-card b{font-size:11.8px;font-weight:700}
.p-card s{text-decoration:none;font-size:10px;color:var(--um);display:block;margin-top:2px}
.p-tab{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-around;
  padding:9px 0 13px;border-top:1px solid var(--ul);background:#fff}
.p-tab i{width:17px;height:17px;border-radius:5px;border:1.4px solid var(--um);opacity:.5;display:block}
.p-tab i.on{border-color:var(--acc);background:var(--acc);opacity:1}

/* ── Catégories « ce qu'on peut construire » ───────────── */
.cap-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(26px,3vw,42px)}
@media(min-width:560px){.cap-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.cap-grid{grid-template-columns:repeat(5,1fr)}}
.cap-cell{background:var(--paper);padding:18px 16px;text-align:left;transition:.3s var(--ease);position:relative}
.cap-cell:hover{background:var(--paper-2)}
.cap-cell[aria-pressed="true"]{background:var(--umber-btn);color:#fff}
.cap-cell b{display:block;font-size:12.5px;font-weight:600;letter-spacing:-.01em}
.cap-cell s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:9px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--umber-deep);margin-bottom:8px}
.cap-cell[aria-pressed="true"] s{color:var(--capp-150)}
.srv-vis--wide{display:none}
@media(min-width:1000px){.srv-row{grid-template-columns:1fr}.srv-vis--wide{display:none}}
.sw-cta{margin-top:16px;display:flex;justify-content:flex-start}
.cap-head{margin-top:clamp(40px,5vw,72px)}
.cap-head h3{font-size:clamp(18px,2.1vw,26px);font-weight:600;letter-spacing:-.024em;max-width:26ch;margin-top:14px}

/* ══════ RÉSERVATION ══════ */
.bk .sheet{width:min(1020px,100%)}
.bk-side{background:var(--ink);color:var(--paper);padding:clamp(20px,2.4vw,30px);overflow-y:auto;
  background-image:radial-gradient(110% 80% at 15% 0%,rgba(var(--taupe-rgb),.16),transparent 60%),linear-gradient(180deg,#151310,#0D0D0D)}
@media(max-width:899px){.bk-side{order:-1;padding-block:16px}}
.bk-sum-h .mono{color:var(--bronze-soft);letter-spacing:.18em}
.bk-card{margin-top:14px;border:1px solid var(--line-dark);border-radius:12px;padding:14px;background:rgba(255,255,255,.03)}
.bk-card-h{display:flex;align-items:center;gap:11px;padding-bottom:12px;border-bottom:1px solid var(--line-dark-soft);margin-bottom:10px}
.bk-card-h .av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:12px;font-weight:600;flex:none}
.bk-card-h b{display:block;font-size:14px;font-weight:600}
.bk-card-h s{text-decoration:none;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze-lt)}
/* Titre de la personne choisie : secondaire, lisible, en casse normale. */
.bk-card-h s.bk-role{display:block;margin-top:2px;font-family:var(--f-ui);font-size:11.5px;line-height:1.35;letter-spacing:0;text-transform:none;color:#A9A199}
.bk-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:12.5px}
.bk-row span{color:#A9A199}
.bk-row b{font-weight:600;text-align:right}
.bk-note{margin-top:14px;color:#8F8880;line-height:1.7;text-transform:none;letter-spacing:.04em;font-size:10.5px}
.hosts{display:grid;gap:10px}
.host{display:flex;align-items:center;gap:13px;border:1px solid var(--line);border-radius:12px;padding:14px 16px;
  background:var(--paper);text-align:left;transition:.28s var(--ease);width:100%}
.host:hover{border-color:var(--umber)}
.host.on{border-color:var(--umber);background:rgba(var(--brand-rgb),.06);box-shadow:0 0 0 1px var(--umber)}
.host .av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:600;flex:none}
.host .tx{flex:1;min-width:0}
.host .tx b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em}
.host .tx s{text-decoration:none;display:block;font-size:12.5px;color:var(--grey);margin-top:2px}
.host .ck{width:18px;height:18px;border-radius:50%;border:1px solid var(--line);flex:none;position:relative}
.host.on .ck{border-color:var(--umber);background:var(--umber)}
.host.on .ck::after{content:"";position:absolute;left:5px;top:4px;width:5px;height:9px;
  border-right:1.6px solid #fff;border-bottom:1.6px solid #fff;transform:rotate(42deg)}
.bk-cal{border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--paper)}
.bk-cal .dow{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:8px}
.bk-cal .dow span{text-align:center;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;color:var(--grey-2)}
.bk-cal .grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.bk-cal .pad{aspect-ratio:1}
.bk-cal .day{aspect-ratio:1;border-radius:9px;border:1px solid transparent;font-size:13px;
  color:var(--ink);background:var(--paper-2);transition:.22s var(--ease);display:grid;place-items:center}
.bk-cal .day:hover:not(.off){border-color:var(--umber);background:rgba(var(--brand-rgb),.08)}
.bk-cal .day.off{color:var(--grey-2);opacity:.4;background:transparent;cursor:not-allowed}
.bk-cal .day.on{background:var(--umber-btn);color:#fff;border-color:var(--umber-btn);
  animation:dayPop .3s var(--ease-out)}
@keyframes dayPop{from{transform:scale(.88)}to{transform:scale(1)}}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.slot{border:1px solid var(--line);border-radius:10px;padding:12px 8px;background:var(--paper);
  transition:.24s var(--ease);text-align:center}
.slot:hover{border-color:var(--umber);transform:translateY(-1px)}
.slot b{display:block;font-size:14px;font-weight:600;letter-spacing:-.01em}
.slot s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--grey);margin-top:3px}
.slot.on{background:var(--umber-btn);border-color:var(--umber-btn);color:#fff}
.slot.on s{color:var(--capp-150)}
.bk-tz{margin-top:16px;color:var(--grey-2)}
/* Lecture des disponibilités réelles : le pouls remplace une liste vide. */
.bk-loading{display:flex;align-items:center;gap:10px;color:var(--grey-2)}
.bk-loading::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--umber);
  flex:0 0 auto;animation:bkPulse 1.05s var(--ease) infinite}
@keyframes bkPulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}
#bk-slots[aria-busy="true"]{min-height:96px}
#bk-next.is-busy{opacity:.65;pointer-events:none}
#bk-next[disabled]{opacity:.55;cursor:not-allowed}
@media(prefers-reduced-motion:reduce){.bk-loading::before{animation:none;opacity:.7}}
.ck-big{width:52px;height:52px;border-radius:50%;border:1px solid rgba(11,154,109,.4);
  background:rgba(11,154,109,.08);display:grid;place-items:center;margin:0 auto 20px}
.bk-actions{margin-top:22px;display:flex;justify-content:center}

@media(max-width:899px){
  #bk-hint{display:none}
  .bk .sheet-f{justify-content:flex-end}
  .bk-side{max-height:32vh;padding-block:14px}
  .bk-note{display:none}
  .bk-card{margin-top:10px;padding:11px}
  .bk-card-h{padding-bottom:9px;margin-bottom:8px}
  .sheet-h .t span em{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:44vw}
  .sw-head h4{font-size:19px}
  .mac-vp{height:300px}
  .dev.both .phone{display:none}
}
@media(min-width:900px) and (max-width:1099px){.dev.both{grid-template-columns:minmax(0,1fr) 200px}.phone{width:196px}.phone-vp{height:384px}}

/* Sur petit écran, la maquette est réduite à l'échelle plutôt que rognée */
@media(max-width:700px){
  .mac-vp{height:340px}
  .mac-scroll{width:calc(100% / .34);height:calc(100% / .34);transform:scale(.34);transform-origin:top left}
  .mac-hint{display:none}
}
@media(min-width:701px) and (max-width:1099px){
  .mac-scroll{width:calc(100% / .62);height:calc(100% / .62);transform:scale(.62);transform-origin:top left}
}

/* ══════════════════════════════════════════════════════════
   PAGES, NAVIGATION ET GRILLES
   ══════════════════════════════════════════════════════════ */
#main{transition:opacity .22s var(--ease)}
#main.page-out{opacity:0}
@media(prefers-reduced-motion:reduce){#main{transition:none}}
[data-page][hidden]{display:none!important}

.soldrop{position:relative}
.solbtn{display:flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--grey);transition:color .3s var(--ease)}
.solbtn:hover,.soldrop.open .solbtn{color:var(--ink)}
.soldrop.open .solbtn svg{transform:rotate(180deg)}
.solbtn svg{transition:transform .3s var(--ease)}
.solpanel{position:absolute;top:calc(100% + 14px);left:-18px;width:326px;background:var(--paper);
  border:1px solid var(--line);padding:6px;opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:.3s var(--ease);z-index:8;box-shadow:0 30px 60px -34px rgba(12,11,10,.42)}
.soldrop.open .solpanel{opacity:1;visibility:visible;transform:none}
.solpanel a{display:block;padding:12px 14px;border-bottom:1px solid var(--line-soft);transition:background .25s}
.solpanel a:last-child{border-bottom:0}
.solpanel a:hover,.solpanel a.active{background:var(--paper-2)}
.solpanel a b{display:block;font-size:14px;font-weight:600;letter-spacing:-.012em;color:var(--ink)}
.solpanel a s{text-decoration:none;display:block;font-size:12px;color:var(--grey);margin-top:3px}
.solpanel a.active b{color:var(--umber-deep)}
.nlinks a.active{color:var(--ink)}
.nlinks a.active::after{transform:scaleX(1)}
.mm-lbl{color:var(--bronze-lt);padding:0 0 10px;margin-top:22px}
.mmenu ol:first-of-type{margin-top:0}

.cats-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:680px){.cats-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.cats-grid{grid-template-columns:repeat(3,1fr)}}
.cat-card{background:var(--paper);padding:clamp(22px,2.6vw,34px);display:flex;flex-direction:column;
  gap:10px;transition:background .35s var(--ease);position:relative;min-height:212px}
.cat-card:hover{background:var(--paper-2)}
.cat-card .cn{color:var(--bronze);font-size:10.5px;letter-spacing:.18em}
.cat-card h3{font-size:clamp(19px,2.1vw,25px);font-weight:600;letter-spacing:-.026em;text-transform:uppercase}
.cat-card .cs{font-family:var(--f-mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--umber-deep)}
.cat-card .cb{font-size:14px;line-height:1.62;color:var(--grey);flex:1}
.cat-card .cgo{display:flex;align-items:center;gap:9px;color:var(--umber-deep);font-size:10.5px;letter-spacing:.16em}
.cat-card:hover .cgo svg{transform:translateX(5px)}
.cat-card .cgo svg{transition:transform .35s var(--ease)}

.feat-grid,.work-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:760px){.feat-grid,.work-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.feat-grid{grid-template-columns:repeat(3,1fr)}.work-grid{grid-template-columns:repeat(3,1fr)}}
.feat-card,.work-card{background:var(--paper);padding:clamp(20px,2.4vw,30px);display:flex;flex-direction:column;
  gap:11px;transition:background .35s var(--ease)}
.feat-card:hover,.work-card:hover{background:var(--paper-2)}
.feat-card .fm,.work-card .wc-cat{color:var(--umber-deep);font-size:9.5px;letter-spacing:.13em}
.feat-card h3,.work-card h3{font-size:17px;font-weight:600;letter-spacing:-.02em}
.feat-card p,.work-card p{font-size:13.5px;line-height:1.6;color:var(--grey);flex:1}
.fchips{display:flex;flex-wrap:wrap;gap:5px}
.fchips i{font-style:normal;font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--line);padding:4px 8px;color:var(--grey)}
.work-card .wc-go{color:var(--umber-deep);font-size:10px;letter-spacing:.15em;text-transform:uppercase}
.sec-more{margin-top:clamp(24px,3vw,40px)}
.work-filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}
.work-filters button{border:1px solid var(--line);border-radius:100px;padding:9px 17px;font-family:var(--f-mono);
  font-size:10.4px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);transition:.25s var(--ease)}
.work-filters button:hover{border-color:var(--umber);color:var(--umber-deep)}
.work-filters button[aria-pressed="true"]{background:var(--umber-btn);border-color:var(--umber-btn);color:#fff}

.hp-stats{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:clamp(28px,3.4vw,48px)}
@media(min-width:620px){.hp-stats{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.hp-stats{grid-template-columns:repeat(4,1fr)}}
.hp-cell{background:var(--paper);padding:clamp(22px,2.6vw,32px)}
.hp-cell b{display:block;font-size:clamp(27px,3.6vw,44px);font-weight:600;letter-spacing:-.035em;
  line-height:1;color:var(--umber-deep);font-variant-numeric:tabular-nums}
.hp-cell .mono{display:block;color:var(--grey);margin-top:11px;line-height:1.5}

.est-flag{color:var(--grey-2);display:flex;gap:10px;margin-bottom:26px;line-height:1.7;
  text-transform:none;letter-spacing:.03em;font-size:11px}
.est-flag::before{content:"";width:6px;height:6px;border:1px solid var(--umber);transform:rotate(45deg);flex:none;margin-top:5px}
.cs-card{border:1px solid var(--line);margin-bottom:18px;background:var(--paper)}
.cs-meta{display:grid;gap:16px;padding:clamp(20px,2.4vw,30px);border-bottom:1px solid var(--line)}
@media(min-width:820px){.cs-meta{grid-template-columns:repeat(3,1fr) 1.6fr}}
.cs-meta .mono{display:block;color:var(--grey-2);font-size:9.5px;letter-spacing:.13em;margin-bottom:6px}
.cs-meta b{font-size:14.5px;font-weight:600;letter-spacing:-.012em}
.cs-mods .mlist{display:flex;flex-wrap:wrap;gap:5px}
.cs-mods i{font-style:normal;font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--line);padding:4px 8px;color:var(--grey)}
.cs-ba{display:grid;gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
@media(min-width:700px){.cs-ba{grid-template-columns:1fr 1fr}}
.ba-col{background:var(--paper);padding:clamp(18px,2.2vw,26px)}
.ba-col .mono{display:block;font-size:9.5px;letter-spacing:.16em;margin-bottom:12px}
.ba-before .mono{color:var(--grey-2)}
.ba-after .mono{color:var(--umber-deep)}
.ba-col ul{list-style:none;display:grid;gap:8px}
.ba-col li{font-size:14px;color:var(--char);padding-left:18px;position:relative;line-height:1.5}
.ba-before li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:1px;background:var(--grey-2)}
.ba-after li::before{content:"";position:absolute;left:0;top:5px;width:6px;height:6px;
  border:1px solid var(--umber);transform:rotate(45deg)}
.ba-before li{color:var(--grey)}
.cs-nums{display:grid;gap:1px;background:var(--line)}
@media(min-width:700px){.cs-nums{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1000px){.cs-nums{grid-template-columns:repeat(3,1fr) 1.3fr}}
.cs-nums .num{background:var(--paper);padding:clamp(18px,2.2vw,26px)}
.cs-nums .mono{display:block;color:var(--grey);font-size:9.5px;letter-spacing:.12em;margin-bottom:9px;line-height:1.5}
.cs-nums b{font-size:clamp(21px,2.6vw,30px);font-weight:600;letter-spacing:-.032em;font-variant-numeric:tabular-nums}
.cs-nums .num--big{background:var(--ink);color:var(--paper);
  background-image:radial-gradient(110% 90% at 20% 0%,rgba(var(--taupe-rgb),.20),transparent 62%),linear-gradient(180deg,#151310,#0D0D0D)}
.cs-nums .num--big .mono{color:var(--bronze-lt)}
.cs-nums .num--big b{color:#fff;font-size:clamp(27px,3.4vw,40px)}
.cs-nums .num--big s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:10.5px;
  letter-spacing:.1em;color:var(--bronze-soft);margin-top:9px}

.calc{background:var(--paper-2)}
.calc-grid{display:grid;gap:18px}
@media(min-width:900px){.calc-grid{grid-template-columns:minmax(0,1fr) minmax(0,.78fr);align-items:start}}
.calc-in{background:var(--paper);border:1px solid var(--line);padding:clamp(20px,2.6vw,30px);display:grid;gap:20px}
.calc-f label{display:block;font-size:13.5px;font-weight:500;margin-bottom:10px}
.calc-r{display:flex;align-items:center;gap:14px}
.calc-r input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:3px;background:var(--line);border-radius:2px}
.calc-r input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;
  background:var(--umber-btn);cursor:pointer;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--umber)}
.calc-r input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--umber-btn);
  cursor:pointer;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--umber)}
.calc-r output{font-family:var(--f-mono);font-size:13px;min-width:52px;text-align:right;font-variant-numeric:tabular-nums}
.calc-out{background:var(--ink);color:var(--paper);padding:clamp(22px,2.8vw,32px);
  background-image:radial-gradient(110% 80% at 15% 0%,rgba(var(--taupe-rgb),.18),transparent 60%),linear-gradient(180deg,#151310,#0D0D0D)}
.co-block .mono{display:block;color:var(--bronze-lt);font-size:9.5px;letter-spacing:.15em;margin-bottom:8px}
.co-block b{font-size:clamp(21px,2.4vw,28px);font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.co-rows{margin:20px 0;border-top:1px solid var(--line-dark-soft);border-bottom:1px solid var(--line-dark-soft);padding:14px 0}
.co-rows div{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-size:13.5px}
.co-rows span{color:#A9A199}
.co-rows b{font-weight:600;font-variant-numeric:tabular-nums}
.co-total .mono{display:block;color:var(--bronze-soft);font-size:9.5px;letter-spacing:.15em;margin-bottom:9px}
.co-total b{display:block;font-size:clamp(30px,4vw,46px);font-weight:600;letter-spacing:-.04em;
  color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.co-total s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:11px;
  letter-spacing:.1em;color:var(--bronze-soft);margin-top:10px}
.co-note{margin:18px 0 20px;color:#8F8880;line-height:1.7;text-transform:none;letter-spacing:.03em;font-size:10.5px}
.ct-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:820px){.ct-grid{grid-template-columns:repeat(3,1fr)}}
.ct-card{background:var(--paper);padding:clamp(24px,2.8vw,36px);display:flex;flex-direction:column;gap:12px}
.ct-card h3{font-size:18px;font-weight:600;letter-spacing:-.022em}
.ct-card p{font-size:14px;line-height:1.6;color:var(--grey);flex:1}
.ct-card .btn{align-self:flex-start}
.ct-card--dark{background:var(--ink);color:var(--paper);
  background-image:radial-gradient(110% 90% at 20% 0%,rgba(var(--taupe-rgb),.18),transparent 62%),linear-gradient(180deg,#151310,#0D0D0D)}
.ct-card--dark p{color:#C3BCB3}
.ct-card--dark a{color:var(--bronze-soft);word-break:break-all}
.ct-card--dark .mono{color:var(--grey-2);flex:none}
.mmenu{overflow-y:auto;-webkit-overflow-scrolling:touch;justify-content:flex-start;
  padding:clamp(90px,13vh,120px) var(--pad) 40px}
.mmenu .mm-lbl{margin-top:26px}
.mmenu>.mm-lbl:first-child{margin-top:0}
.mmenu li a{padding-block:clamp(14px,2.4vh,22px)}
.mmenu li a em{font-size:clamp(21px,5.4vw,30px)}
.mmenu .mfoot{margin-top:28px}
.cs-nums .num--big{display:flex;flex-direction:column;gap:0}
.big-year{border-top:1px solid var(--line-dark-soft);margin-top:14px;padding-top:12px}
.big-year .mono{display:block;color:var(--bronze-lt);font-size:9px;letter-spacing:.13em;margin-bottom:5px}
.big-year u{text-decoration:none;display:block;font-size:clamp(17px,2vw,22px);font-weight:600;
  letter-spacing:-.028em;color:#fff;font-variant-numeric:tabular-nums}
.big-year i{font-style:normal;display:block;font-family:var(--f-mono);font-size:10px;
  letter-spacing:.08em;color:var(--bronze-soft);margin-top:5px}
.co-exec{margin-top:22px;border-top:1px solid var(--line-dark-soft);padding-top:18px}
.co-exec>.mono{display:block;color:var(--bronze-soft);font-size:9.5px;letter-spacing:.15em;margin-bottom:14px}
.ce-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 14px}
.ce-grid s{text-decoration:none;display:block;font-size:11px;color:#A9A199;line-height:1.4;margin-bottom:5px}
.ce-grid b{display:block;font-size:clamp(17px,2vw,21px);font-weight:600;letter-spacing:-.028em;
  color:#fff;font-variant-numeric:tabular-nums}
.big-eq u{color:var(--bronze-soft)}
.co-equiv{margin-top:20px;border-top:1px solid var(--line-dark-soft);padding-top:18px}
.co-equiv>.mono{display:block;color:var(--bronze-soft);font-size:9.5px;letter-spacing:.15em;margin-bottom:9px}
.co-equiv b{display:block;font-size:clamp(24px,3.2vw,36px);font-weight:600;letter-spacing:-.035em;
  color:#fff;line-height:1;font-variant-numeric:tabular-nums}
.co-equiv s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:10.5px;
  letter-spacing:.08em;color:var(--bronze-lt);margin-top:9px;line-height:1.6}
@media(min-width:820px){.cs-meta{grid-template-columns:repeat(4,1fr) 1.4fr}}
.band-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:22px}
.band-tabs button{border:1px solid var(--line);border-radius:100px;padding:10px 18px;font-family:var(--f-mono);
  font-size:11px;letter-spacing:.1em;color:var(--grey);transition:.25s var(--ease)}
.band-tabs button:hover{border-color:var(--umber);color:var(--umber-deep)}
.band-tabs button[aria-pressed="true"]{background:var(--umber-btn);border-color:var(--umber-btn);color:#fff}
.band-h{padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:22px}
.band-h .mono{display:block;color:var(--grey-2);font-size:9.5px;letter-spacing:.14em;margin-bottom:8px}
.band-h b{display:block;font-size:clamp(17px,2vw,22px);font-weight:600;letter-spacing:-.024em}
.band-h s{text-decoration:none;display:block;font-size:13px;color:var(--grey);margin-top:5px}
.band-hours{margin-bottom:24px}
.band-hours>.mono{display:block;color:var(--umber-deep);font-size:10px;letter-spacing:.15em;margin-bottom:10px}
.band-hours>b{display:block;font-size:clamp(44px,7vw,86px);font-weight:600;letter-spacing:-.045em;
  line-height:.95;color:var(--ink);font-variant-numeric:tabular-nums}
.bh-sub{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px;
  border-top:1px solid var(--line);padding-top:18px}
.bh-sub s{text-decoration:none;display:block;font-size:11.5px;color:var(--grey);line-height:1.4;margin-bottom:6px}
.bh-sub em{font-style:normal;display:block;font-size:clamp(17px,2.1vw,23px);font-weight:600;
  letter-spacing:-.028em;color:var(--umber-deep);font-variant-numeric:tabular-nums}
.band-rows{border-top:1px solid var(--line);padding-top:16px}
.band-rows div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:13.5px;
  border-bottom:1px solid var(--line-soft)}
.band-rows div:last-child{border-bottom:0}
.band-rows span{color:var(--grey)}
.band-rows b{font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
@media(max-width:520px){.bh-sub{grid-template-columns:1fr;gap:12px}}

/* ══════════════════════════════════════════════════════════
   CALCULATEUR D'EFFICACITÉ
   ══════════════════════════════════════════════════════════ */
.rc-hero{padding-bottom:0}
.rc-sec{padding-top:clamp(34px,4vw,56px)}
.rc-grid{display:grid;gap:20px}
@media(min-width:1000px){.rc-grid{grid-template-columns:minmax(0,1fr) minmax(340px,.72fr);align-items:start}}
.rc-col{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.rc-step{background:var(--paper);padding:clamp(22px,2.8vw,34px)}
.rc-sh{margin-bottom:24px}
.rc-sh .mono{display:block;color:var(--umber-deep);font-size:10px;letter-spacing:.18em;margin-bottom:8px}
.rc-sh h3{font-size:clamp(19px,2.2vw,26px);font-weight:600;letter-spacing:-.026em;text-transform:uppercase}
.rc-f{padding:18px 0;border-top:1px solid var(--line-soft)}
.rc-f:first-of-type{border-top:0;padding-top:0}
.rc-ft{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:14px;flex-wrap:wrap}
.rc-ft label{font-size:14.5px;font-weight:500;line-height:1.45;flex:1;min-width:180px}
.rc-ft output{font-size:clamp(19px,2.2vw,25px);font-weight:600;letter-spacing:-.028em;color:var(--umber-deep);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.rc-hint{font-size:12.5px;line-height:1.55;color:var(--grey);margin-top:11px;max-width:62ch}
.rc-f input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:26px;background:transparent;cursor:pointer;display:block}
.rc-f input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:3px;
  background:linear-gradient(90deg,var(--umber) var(--fill,50%),var(--paper-3) var(--fill,50%))}
.rc-f input[type=range]::-moz-range-track{height:4px;border-radius:3px;
  background:linear-gradient(90deg,var(--umber) var(--fill,50%),var(--paper-3) var(--fill,50%))}
.rc-f input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-11px;
  border-radius:50%;background:var(--umber-btn);border:5px solid var(--paper);
  box-shadow:0 0 0 1px var(--umber),0 6px 16px -8px rgba(var(--brand-rgb),.9);transition:transform .18s var(--ease)}
.rc-f input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--umber-btn);
  border:5px solid var(--paper);box-shadow:0 0 0 1px var(--umber)}
.rc-f input[type=range]:active::-webkit-slider-thumb{transform:scale(1.14)}
.rc-f input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 1px var(--umber),0 0 0 5px rgba(var(--brand-rgb),.28)}

.rc-panel{position:relative}
@media(min-width:1000px){.rc-sticky{position:sticky;top:calc(var(--nav-h) + 18px)}}
.rc-sticky{background:var(--ink);color:var(--paper);padding:clamp(22px,2.6vw,32px);
  background-image:radial-gradient(120% 80% at 18% 0%,rgba(var(--taupe-rgb),.22),transparent 62%),linear-gradient(180deg,#151310,#0D0D0D);
  border:1px solid rgba(var(--taupe-rgb),.22);box-shadow:0 40px 80px -56px rgba(12,11,10,.7)}
.rc-plabel{display:block;color:var(--bronze-soft);font-size:10px;letter-spacing:.18em;margin-bottom:20px}
.rc-head{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding-bottom:20px;border-bottom:1px solid var(--line-dark-soft)}
.rc-big span{display:block;font-size:10px;letter-spacing:.12em;color:var(--bronze-lt);margin-bottom:8px;line-height:1.4}
.rc-big b{display:block;font-size:clamp(30px,4.4vw,44px);font-weight:600;letter-spacing:-.042em;
  line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.rc-big b i{font-style:normal;font-size:.44em;margin-left:4px;color:var(--bronze-soft)}
.rc-money{padding:18px 0;border-bottom:1px solid var(--line-dark-soft)}
.rc-m{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:7px 0}
.rc-m .mono{font-size:10.5px;letter-spacing:.06em;color:#A9A199;text-transform:none;line-height:1.4}
.rc-m b{font-weight:600;font-size:14.5px;font-variant-numeric:tabular-nums;white-space:nowrap}
.rc-m--tot{margin-top:10px;padding-top:14px;border-top:1px solid var(--line-dark-soft)}
.rc-m--tot .mono{color:var(--bronze-soft)}
.rc-m--tot b{font-size:clamp(23px,2.8vw,30px);letter-spacing:-.032em;color:#fff}
.rc-m--yr .mono{color:var(--bronze-lt)}
.rc-m--yr b{font-size:18px;color:var(--bronze-soft)}
.rc-score{padding:20px 0 0}
.sc-row{margin-bottom:16px}
.sc-row .mono{display:block;font-size:10px;letter-spacing:.12em;color:#A9A199;margin-bottom:7px}
.sc-row b{font-size:24px;font-weight:600;letter-spacing:-.032em;color:#fff;font-variant-numeric:tabular-nums}
.sc-row b i{font-style:normal;font-size:.5em;color:#7E766E;margin-left:2px}
.sc-bar{height:4px;border-radius:3px;background:rgba(255,255,255,.10);margin-top:9px;overflow:hidden}
.sc-bar u{display:block;height:100%;border-radius:3px;background:#6E6660;
  transition:width .7s cubic-bezier(.16,1,.3,1)}
.sc-row--up .mono{color:var(--bronze-soft)}
.sc-row--up .sc-bar u{background:linear-gradient(90deg,var(--umber),var(--bronze-lt));
  box-shadow:0 0 14px rgba(var(--brand-rgb),.5)}
.rc-disc{font-size:11px;line-height:1.65;color:#8F8880;margin:20px 0 18px}
.rc-sticky .btn{width:100%;justify-content:center}

.rc-break{border:1px solid var(--line);background:var(--paper)}
.bk-row{display:grid;grid-template-columns:minmax(140px,1.1fr) minmax(0,2fr) minmax(96px,auto);
  gap:16px;align-items:center;padding:15px clamp(16px,2vw,26px);border-bottom:1px solid var(--line-soft)}
.bk-row:last-child{border-bottom:0}
.bk-n{font-size:14px;font-weight:500}
.bk-bar{height:6px;border-radius:4px;background:var(--paper-3);overflow:hidden}
.bk-bar u{display:block;height:100%;border-radius:4px;background:var(--umber);
  transition:width .6s cubic-bezier(.16,1,.3,1)}
.bk-row b{text-align:right;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.bk-row--tot{background:var(--paper-2);border-top:1px solid var(--line)}
.bk-row--tot .bk-n{font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-size:12.5px}
.bk-row--tot b{font-size:clamp(19px,2.2vw,24px);color:var(--umber-deep)}
@media(max-width:640px){.bk-row{grid-template-columns:1fr auto;gap:8px 12px}.bk-bar{grid-column:1/-1;order:3}}

.rc-bottle{background:var(--paper-2)}
.rc-bottle-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:900px){.rc-bottle-grid{grid-template-columns:repeat(3,1fr)}}
.bn-card{background:var(--paper);padding:clamp(22px,2.6vw,32px);display:flex;flex-direction:column;gap:12px}
.bn-card>.mono{color:var(--bronze);font-size:11px;letter-spacing:.18em}
.bn-card h4{font-size:19px;font-weight:600;letter-spacing:-.024em}
.bn-h{font-size:clamp(17px,2vw,21px);font-weight:600;color:var(--umber-deep);letter-spacing:-.024em;
  font-variant-numeric:tabular-nums;line-height:1.3}
.bn-a{font-size:13.5px;line-height:1.62;color:var(--grey);flex:1}
.bn-mods{display:flex;flex-wrap:wrap;gap:5px;padding-top:14px;border-top:1px solid var(--line-soft)}
.bn-mods .mono{width:100%;color:var(--grey-2);font-size:9.5px;letter-spacing:.13em;margin-bottom:4px}
.bn-mods i{font-style:normal;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.08em;
  border:1px solid var(--line);padding:5px 9px;color:var(--umber-deep)}

.stat-band{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:clamp(26px,3vw,44px)}
.stat-band:empty{display:none}
@media(min-width:620px){.stat-band{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.stat-band{grid-template-columns:repeat(4,1fr)}}
.sb-cell{background:var(--paper);padding:clamp(22px,2.6vw,32px)}
.sb-cell b{display:block;font-size:clamp(28px,3.6vw,44px);font-weight:600;letter-spacing:-.035em;
  line-height:1;color:var(--umber-deep)}
.sb-cell .mono{display:block;color:var(--grey);margin-top:11px;line-height:1.5}

.hp-teaser{display:block;background:var(--ink);color:var(--paper);padding:clamp(26px,3.2vw,42px);
  background-image:radial-gradient(110% 90% at 18% 0%,rgba(var(--taupe-rgb),.20),transparent 62%),linear-gradient(180deg,#151310,#0D0D0D);
  transition:transform .4s var(--ease)}
.hp-teaser:hover{transform:translateY(-2px)}
.hp-teaser>.mono{display:block;color:var(--bronze-soft);font-size:10px;letter-spacing:.18em;margin-bottom:14px}
.hp-teaser b{display:block;font-size:clamp(21px,2.6vw,31px);font-weight:600;letter-spacing:-.028em;max-width:22ch}
.hp-teaser p{font-size:14.5px;line-height:1.65;color:#C3BCB3;margin-top:12px;max-width:62ch}
.hp-teaser .cgo{display:flex;align-items:center;gap:9px;color:var(--bronze-soft);font-size:10.5px;
  letter-spacing:.16em;margin-top:20px}
.hp-teaser:hover .cgo svg{transform:translateX(5px)}
.hp-teaser .cgo svg{transition:transform .35s var(--ease)}
@media(max-width:900px){
  .rc-f input[type=range]{height:40px}
  .rc-f input[type=range]::-webkit-slider-thumb{width:32px;height:32px;margin-top:-14px;border-width:6px}
  .rc-f input[type=range]::-moz-range-thumb{width:24px;height:24px;border-width:6px}
  .rc-ft output{font-size:20px}
  .rc-head{grid-template-columns:1fr;gap:18px}
  .rc-sticky{padding:22px 18px}
}

/* ── Bascule hebdomadaire avant / après ─────────────────── */
.rc-swap{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:20px}
@media(min-width:820px){.rc-swap{grid-template-columns:1fr auto 1fr;align-items:stretch}}
.sw-side{background:var(--paper);padding:clamp(24px,3vw,38px)}
.sw-side>.mono{display:block;color:var(--grey);font-size:10px;letter-spacing:.15em;margin-bottom:14px}
.sw-side b{display:block;font-size:clamp(38px,5.6vw,64px);font-weight:600;letter-spacing:-.045em;
  line-height:.95;color:var(--grey);font-variant-numeric:tabular-nums}
.sw-side b i{font-style:normal;font-size:.32em;letter-spacing:-.01em;margin-left:5px;color:var(--grey-2)}
.sw-side s{text-decoration:none;display:block;font-size:13px;line-height:1.55;color:var(--grey);margin-top:14px;max-width:34ch}
.sw-side--after{background:var(--ink);color:var(--paper);
  background-image:radial-gradient(120% 90% at 20% 0%,rgba(var(--taupe-rgb),.22),transparent 62%),linear-gradient(180deg,#151310,#0D0D0D)}
.sw-side--after>.mono{color:var(--bronze-soft)}
.sw-side--after b{color:#fff}
.sw-side--after b i{color:var(--bronze-soft)}
.sw-side--after s{color:#C3BCB3}
.sw-arrow{background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;padding:18px clamp(18px,2.4vw,30px);color:var(--umber)}
.sw-arrow svg{width:40px;height:12px}
.sw-arrow em{font-style:normal;font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;
  color:var(--umber-deep);white-space:nowrap;font-weight:500}
@media(max-width:819px){.sw-arrow{flex-direction:row;padding:14px}.sw-arrow svg{transform:rotate(90deg);width:28px}}

/* ── Tableau département par département ───────────────── */
.bk-row{grid-template-columns:minmax(120px,1.2fr) 84px 84px minmax(0,1.4fr) minmax(92px,auto)}
.bk-c{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--grey);white-space:nowrap}
.bk-c i{font-style:normal;font-size:.66em;font-weight:400;color:var(--grey-2);margin-left:2px}
.bk-c--after{color:var(--umber-deep)}
.bk-row--head{background:var(--paper-2);border-bottom:1px solid var(--line)}
.bk-row--head .bk-n,.bk-row--head .bk-c,.bk-row--head b{font-family:var(--f-mono);font-size:9.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--grey-2);font-weight:400}
.bk-row--head .bk-c--after{color:var(--umber-deep)}
.bk-row--owner{background:var(--paper-2)}
@media(max-width:820px){
  .bk-row{grid-template-columns:1fr auto auto;gap:6px 12px;padding-block:14px}
  .bk-row .bk-n{grid-column:1/-1;font-weight:600}
  .bk-bar{grid-column:1/-1;order:4}
  .bk-row b{order:3}
  .bk-row--head{display:none}
  .bk-c::after{content:attr(data-l)}
}
.rc-week{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;margin-top:18px;
  padding-top:16px;border-top:1px solid var(--line-dark-soft);font-size:12px}
.rc-week span{color:#A9A199;font-size:10.5px}
.rc-week b{font-weight:600;font-size:15px;color:#C4BCB3;font-variant-numeric:tabular-nums}
.rc-week b.up{color:#fff}
.rc-week i{font-style:normal;color:var(--bronze);margin:0 2px}
.sw-arrow u{text-decoration:none;font-family:var(--f-mono);font-size:19px;font-weight:600;
  letter-spacing:-.01em;color:var(--umber-btn);font-variant-numeric:tabular-nums}
@media(max-width:819px){.sw-arrow u{font-size:16px}}

/* ══════════════════════════════════════════════════════════
   CONSOLIDATION, SÉCURITÉ, ASSISTANT
   ══════════════════════════════════════════════════════════ */
.grid-overlay{display:none!important}
.onesys{background:var(--paper-2)}
.os-flow{display:grid;justify-items:center;gap:0}
.os-from{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:760px}
.os-from span{border:1px solid var(--line);border-radius:100px;padding:9px 16px;font-family:var(--f-mono);
  font-size:10.5px;letter-spacing:.1em;color:var(--grey);background:var(--paper);
  animation:osIn .6s var(--ease-out) backwards;animation-delay:var(--d)}
@keyframes osIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.os-arrow{color:var(--umber);margin:22px 0 20px}
.os-arrow svg{width:12px;height:44px}
.os-core{background:var(--ink);color:var(--paper);padding:clamp(26px,3.2vw,42px);width:min(760px,100%);
  text-align:center;background-image:radial-gradient(120% 90% at 50% 0%,rgba(var(--taupe-rgb),.24),transparent 64%),linear-gradient(180deg,#151310,#0D0D0D);
  border:1px solid rgba(var(--taupe-rgb),.3)}
.os-core img{width:30px;margin-bottom:14px}
.os-core b{display:block;font-size:clamp(19px,2.4vw,27px);font-weight:600;letter-spacing:.02em;text-transform:uppercase}
.os-mods{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:22px}
.os-mods i{font-style:normal;font-family:var(--f-mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  border:1px solid rgba(201,155,120,.34);padding:7px 12px;color:var(--bronze-soft)}
.os-punch{margin-top:clamp(28px,3.4vw,46px);text-align:center;font-size:clamp(17px,2.2vw,25px);
  font-weight:600;letter-spacing:-.024em;color:var(--umber-deep)}

.ysd-grid,.pba-grid,.roles-grid,.dr-grid{display:grid;gap:1px;background:var(--line)}
.ysd-grid{background:var(--line-dark);border:1px solid var(--line-dark)}
@media(min-width:640px){.ysd-grid,.pba-grid,.roles-grid{grid-template-columns:repeat(2,1fr)}.dr-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.ysd-grid,.pba-grid,.roles-grid{grid-template-columns:repeat(3,1fr)}.dr-grid{grid-template-columns:repeat(4,1fr)}}
.ysd-cell{background:var(--ink);padding:clamp(22px,2.6vw,32px)}
.ysd-cell .mono{display:block;color:var(--bronze);font-size:10px;letter-spacing:.18em;margin-bottom:12px}
.ysd-cell b{display:block;font-size:17px;font-weight:600;letter-spacing:-.02em;color:#fff}
.ysd-cell p{font-size:13.5px;line-height:1.62;color:#C3BCB3;margin-top:9px}
.pba-grid,.roles-grid,.dr-grid{border:1px solid var(--line);margin-top:clamp(26px,3vw,42px)}
.pba-card,.role-card,.dr-cell{background:var(--paper);padding:clamp(22px,2.6vw,32px)}
.pba-card b,.role-card b,.dr-cell b{display:block;font-size:16.5px;font-weight:600;letter-spacing:-.02em}
.pba-card p,.role-card p,.dr-cell p{font-size:13.5px;line-height:1.62;color:var(--grey);margin-top:9px}
.role-card .mono{display:block;color:var(--bronze);font-size:10px;letter-spacing:.18em;margin-bottom:12px}
.role-card--custom{background:var(--paper-2)}
.pba-stack{display:grid;justify-items:center;gap:0}
.pba-node{border:1px solid var(--line);padding:14px 26px;background:var(--paper);text-align:center;min-width:min(360px,86%)}
.pba-node span{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--char)}
.pba-node--core{background:var(--umber-btn);border-color:var(--umber-btn)}
.pba-node--core span{color:#fff;font-weight:500}
.pba-node--leaf{background:var(--paper-2)}
.pba-node--leaf span{color:var(--grey);letter-spacing:.1em}
.pba-link{width:1px;height:26px;background:var(--umber);opacity:.5}
.yd-split{display:grid;gap:clamp(22px,3vw,52px)}
@media(min-width:900px){.yd-split{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}}
.yd-split p{font-size:15px;line-height:1.72;color:#C9C2B9;margin-bottom:16px}
.yd-support{border:1px solid rgba(201,155,120,.28);padding:18px;margin-top:24px;background:rgba(var(--brand-rgb),.07)}
.yds-h{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}
.yds-h .mono{color:var(--bronze-soft);font-size:10.5px;letter-spacing:.15em}
.yds-sw{width:38px;height:21px;border-radius:100px;background:var(--umber);position:relative;flex:none}
.yds-sw i{position:absolute;top:3px;right:3px;width:15px;height:15px;border-radius:50%;background:#fff}
.yd-support p{font-size:11.5px;line-height:1.65;color:#A9A199;margin:0;text-transform:none;letter-spacing:.02em}
.yds-exp{margin-top:12px!important;color:var(--bronze-lt)!important;font-size:11px!important}

/* ── Assistant ─────────────────────────────────────────── */
.aiq-fab{position:fixed;right:20px;bottom:20px;z-index:150;display:flex;align-items:center;gap:9px;
  background:var(--umber-btn);color:#fff;border-radius:100px;padding:13px 20px;font-family:var(--f-mono);
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  box-shadow:0 18px 40px -18px rgba(var(--brand-rgb),.85);transition:.3s var(--ease)}
.aiq-fab:hover{background:var(--umber-btn-h);transform:translateY(-2px)}
body.is-locked .aiq-fab{display:none}
.aiq{position:fixed;right:20px;bottom:20px;z-index:151;width:min(376px,calc(100vw - 40px));
  background:var(--ink);color:var(--paper);border:1px solid rgba(var(--brand-rgb),.28);
  background-image:radial-gradient(110% 60% at 50% 0%,rgba(var(--brand-rgb),.16),transparent 62%),linear-gradient(180deg,#151310,#0D0D0D);
  box-shadow:0 40px 90px -40px rgba(12,11,10,.8);display:flex;flex-direction:column;max-height:min(620px,calc(100vh - 40px));
  opacity:0;visibility:hidden;transform:translateY(14px) scale(.98);transition:.32s var(--ease)}
.aiq.open{opacity:1;visibility:visible;transform:none}
.aiq-h{display:flex;align-items:center;gap:11px;padding:16px 18px;border-bottom:1px solid var(--line-dark-soft)}
.aiq-h img{width:22px}
.aiq-h b{display:block;font-size:14px;font-weight:600}
.aiq-h s{text-decoration:none;display:block;font-size:11px;color:#A9A199;margin-top:2px}
.aiq-h div{flex:1;min-width:0}
.aiq-x{width:28px;height:28px;border:1px solid var(--line-dark);display:grid;place-items:center;color:#C3BCB3;flex:none}
.aiq-x:hover{border-color:var(--bronze)}
.aiq-body{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:10px;min-height:160px}
.aiq-b{max-width:88%;border-radius:13px;padding:11px 14px;font-size:13.5px;line-height:1.6;
  animation:aiIn .4s var(--ease-out) backwards}
@keyframes aiIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.aiq-b--ai{background:rgba(255,255,255,.06);border:1px solid var(--line-dark-soft);align-self:flex-start;border-bottom-left-radius:4px}
.aiq-b--me{background:var(--umber-btn);align-self:flex-end;border-bottom-right-radius:4px;color:#fff}
.aiq-typing{display:inline-flex;gap:4px;padding:2px 0}
.aiq-typing i{width:5px;height:5px;border-radius:50%;background:var(--bronze-lt);animation:tp 1.3s ease-in-out infinite}
.aiq-typing i:nth-child(2){animation-delay:.18s}.aiq-typing i:nth-child(3){animation-delay:.36s}
.aiq-cta{display:block;margin-top:11px;background:var(--bronze);color:var(--umber-ink);border-radius:100px;
  padding:9px 15px;font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.aiq-cta:hover{background:var(--bronze-soft)}
.aiq-sug{display:flex;flex-wrap:wrap;gap:6px;padding:0 18px 12px}
.aiq-sug:empty{display:none}
.aiq-sug button{border:1px solid var(--line-dark);border-radius:100px;padding:7px 12px;font-size:11.5px;
  color:#C3BCB3;transition:.25s var(--ease);text-align:left}
.aiq-sug button:hover{border-color:var(--bronze);color:#fff}
.aiq-f{display:flex;gap:8px;padding:12px 18px;border-top:1px solid var(--line-dark-soft)}
.aiq-f input{flex:1;background:rgba(255,255,255,.06);border:1px solid var(--line-dark);border-radius:100px;
  padding:10px 15px;font-family:var(--f-ui);font-size:13.5px;color:#fff}
.aiq-f input::placeholder{color:#8F8880}
.aiq-f input:focus{outline:none;border-color:var(--bronze)}
.aiq-f button{width:38px;height:38px;border-radius:50%;background:var(--umber-btn);color:#fff;
  display:grid;place-items:center;flex:none}
.aiq-f button:hover{background:var(--umber-btn-h)}
.aiq-note{padding:0 18px 16px;color:#7E766E;font-size:9.5px;line-height:1.6;text-transform:none;letter-spacing:.03em}
@media(max-width:520px){
  .aiq-fab{right:14px;bottom:14px;padding:12px 16px}
  .aiq-fab span{display:none}
  .aiq{right:10px;left:10px;bottom:10px;width:auto;max-height:calc(100vh - 20px)}
}
/* Navigation lisible au-dessus d'une première section sombre */
.nav--on-dark:not(.stuck) .nlinks a,
.nav--on-dark:not(.stuck) .solbtn{color:#B9B1A7}
.nav--on-dark:not(.stuck) .nlinks a:hover,
.nav--on-dark:not(.stuck) .nlinks a.active,
.nav--on-dark:not(.stuck) .solbtn:hover{color:#fff}
.nav--on-dark:not(.stuck) .brand .bt b{color:#fff}
.nav--on-dark:not(.stuck) .brand .bt{color:#9C948B}
.nav--on-dark:not(.stuck) .brand img{filter:brightness(0) invert(.94)}
.nav--on-dark:not(.stuck) .langbtn{color:#B9B1A7;border-color:rgba(255,255,255,.2)}
.nav--on-dark:not(.stuck) .langbtn:hover{color:#fff;border-color:var(--bronze)}
.nav--on-dark:not(.stuck) .burger i::before,
.nav--on-dark:not(.stuck) .burger i::after{background:#F2EFE9}
.nav--on-dark:not(.stuck) .burger{border-color:rgba(255,255,255,.22)}
.nav--on-dark:not(.stuck)::after{background:rgba(255,255,255,.14)}

/* ══════════════════════════════════════════════════════════
   QUADRA — MISE À JOUR : MULTILINGUE · INTÉGRATIONS ·
   REGROUPEMENT GÉOGRAPHIQUE · DÉVELOPPEMENT SUR MESURE
   Reprend strictement les jetons de design existants.
   ══════════════════════════════════════════════════════════ */

/* ── Sélecteur de langue étendu ───────────────────────────── */
.langbtn .lg{width:13px;height:13px;flex:none;opacity:.72}
.langmenu{min-width:274px;width:274px;padding:0;overflow:hidden}
.lang-search{position:relative;border-bottom:1px solid var(--line);background:var(--paper-2)}
.lang-search input{
  width:100%;border:0;background:transparent;padding:13px 14px 13px 36px;
  font-family:var(--f-ui);font-size:13px;color:var(--ink);outline:0;
}
.lang-search input::placeholder{color:var(--grey-2)}
.lang-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:13px;height:13px;color:var(--grey-2);pointer-events:none}
.lang-list{max-height:min(52vh,360px);overflow-y:auto;overscroll-behavior:contain;margin:0;padding:0;list-style:none;scrollbar-width:thin}
.lang-list::-webkit-scrollbar{width:5px}
.lang-list::-webkit-scrollbar-thumb{background:var(--line)}
.lang-grp{font-family:var(--f-mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey-2);
  padding:13px 15px 7px;border-bottom:1px solid var(--line-soft);background:var(--paper)}
.lang-list li+li .lang-grp{margin-top:2px;border-top:1px solid var(--line-soft)}
.lang-list button{display:flex;align-items:baseline;gap:11px;width:100%;padding:11px 15px;text-align:left;
  border-bottom:1px solid var(--line-soft);transition:background .25s var(--ease)}
.lang-list button:hover,.lang-list button:focus-visible{background:var(--paper-2)}
.lang-list button b{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.15em;color:var(--umber);font-weight:500;
  flex:none;min-width:22px}
.lang-list button span{font-size:13px;line-height:1.35}
.lang-list button em{font-style:normal;display:block;font-size:11px;color:var(--grey-2);margin-top:2px}
.lang-list button[aria-selected="true"]{background:var(--paper-3)}
.lang-list button[data-soon]{opacity:.9}
.lang-list button[data-soon] b{color:var(--grey-2)}
.lang-empty{padding:18px 15px;font-size:12.5px;color:var(--grey-2);line-height:1.6}
.lang-note{border-top:1px solid var(--line);background:var(--paper-2);padding:14px 15px;display:none}
.lang-note.on{display:block}
.lang-note p{font-size:12.5px;line-height:1.62;color:var(--char)}
.lang-note .tlink{color:var(--umber-deep);font-size:10px;margin-top:6px}

/* — variante intégrée au menu mobile — */
.mlangbox{width:100%}
.mlang-top{display:flex;align-items:center;gap:10px;width:100%;border:1px solid var(--line-dark);
  padding:12px 14px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--paper)}
.mlang-top .lg{width:13px;height:13px;opacity:.7;flex:none}
.mlang-top .cur{margin-left:auto;color:var(--bronze-lt)}
.mlang-top svg.cv{transition:transform .35s var(--ease)}
.mlangbox.open .mlang-top svg.cv{transform:rotate(180deg)}
.mlang-panel{display:none;border:1px solid var(--line-dark);border-top:0;background:rgba(255,255,255,.04)}
.mlangbox.open .mlang-panel{display:block}
.mlang-panel .lang-search{background:transparent;border-bottom:1px solid var(--line-dark-soft)}
.mlang-panel .lang-search input{color:var(--paper)}
.mlang-panel .lang-search input::placeholder{color:var(--grey-2)}
.mlang-panel .lang-list{max-height:34vh}
.mlang-panel .lang-grp{background:transparent;color:var(--bronze-lt);border-bottom-color:var(--line-dark-soft)}
.mlang-panel .lang-list li+li .lang-grp{border-top-color:var(--line-dark-soft)}
.mlang-panel .lang-list button{border-bottom-color:var(--line-dark-soft);color:var(--paper)}
.mlang-panel .lang-list button:hover,.mlang-panel .lang-list button:focus-visible{background:rgba(255,255,255,.06)}
.mlang-panel .lang-list button b{color:var(--bronze-lt)}
.mlang-panel .lang-list button em{color:var(--grey-2)}
.mlang-panel .lang-list button[aria-selected="true"]{background:rgba(255,255,255,.1)}
.mlang-panel .lang-note{background:transparent;border-top-color:var(--line-dark-soft)}
.mlang-panel .lang-note p{color:#C9C2B9}
.mlang-panel .lang-note .tlink{color:var(--bronze-lt)}
.mlang-panel .lang-empty{color:var(--grey-2)}
@media(max-width:1059px){.mmenu{justify-content:flex-start;overflow-y:auto;padding-top:calc(var(--nav-h) + 12px)}}

/* Un caractère CJK n'a pas la même chasse : on relâche l'interlettrage
   des micro-titres pour éviter la bouillie typographique. */
html[lang="zh"] .mono,html[lang="ja"] .mono,
html[lang="zh"] .btn,html[lang="ja"] .btn,
html[lang="zh"] .tlink,html[lang="ja"] .tlink{letter-spacing:.06em}
html[lang="zh"] .sec-title,html[lang="ja"] .sec-title,
html[lang="zh"] h1.hero-h,html[lang="ja"] h1.hero-h{letter-spacing:0;line-height:1.18}
html[lang="zh"] .cat-card h3,html[lang="ja"] .cat-card h3,
html[lang="zh"] .cmp-h h3,html[lang="ja"] .cmp-h h3{letter-spacing:0}

/* ── Bandeau capacités (accueil) ──────────────────────────── */
.capband{background:var(--paper-2)}
.cap-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:700px){.cap-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1120px){.cap-grid{grid-template-columns:repeat(4,1fr)}}
.cap-card{background:var(--paper);padding:clamp(22px,2.6vw,32px);display:flex;flex-direction:column;gap:13px;
  min-height:230px;transition:background .35s var(--ease);text-align:left;width:100%}
.cap-card:hover{background:var(--paper-2)}
.cap-ico{width:30px;height:30px;color:var(--umber);flex:none}
.cap-card h3{font-size:16.5px;font-weight:600;letter-spacing:-.015em;text-transform:uppercase}
.cap-card p{font-size:13.5px;line-height:1.62;color:var(--grey);flex:1}
.cap-card .cgo{display:flex;align-items:center;gap:9px;color:var(--umber-deep);font-family:var(--f-mono);
  font-size:10px;letter-spacing:.15em;text-transform:uppercase}
.cap-card:hover .cgo svg{transform:translateX(5px)}
.cap-card .cgo svg{transition:transform .35s var(--ease)}

/* ══════ MULTILINGUE ══════════════════════════════════════ */
.mlx{background:var(--paper)}
.mlx-grid{display:grid;grid-template-columns:1fr;gap:clamp(34px,4.4vw,64px);align-items:center}
@media(min-width:1000px){.mlx-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}}
.mlx-quote{font-size:clamp(18px,2.1vw,26px);line-height:1.4;font-weight:500;letter-spacing:-.02em;
  color:var(--ink);max-width:22ch;margin-bottom:22px}
.mlx-quote em{font-family:var(--f-display);font-style:normal;font-weight:500;color:var(--umber-deep);letter-spacing:-.005em}
.mlx-body{font-size:15px;line-height:1.72;color:var(--grey);max-width:50ch}
.mlx-body+.mlx-body{margin-top:16px}
.mlx-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:26px}
.mlx-chips span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--line);padding:7px 11px;color:var(--grey);transition:.35s var(--ease)}
.mlx-chips span.on{border-color:var(--umber);color:var(--umber-deep)}
.mlx-note{margin-top:22px;font-size:12.5px;line-height:1.65;color:var(--grey-2);max-width:46ch}

/* fenêtre système multilingue */
.mlw{border:1px solid var(--line);background:var(--paper);box-shadow:0 40px 80px -60px rgba(12,11,10,.45)}
.mlw-bar{display:flex;align-items:center;gap:11px;padding:11px 14px;border-bottom:1px solid var(--line);background:var(--paper-2)}
.mlw-bar .dots{display:flex;gap:5px;flex:none}
.mlw-bar .dots i{width:7px;height:7px;border:1px solid var(--line);border-radius:50%;display:block}
.mlw-bar .host{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.1em;color:var(--grey-2);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mlw-bar .flagcode{margin-left:auto;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.16em;
  color:var(--umber);border:1px solid var(--line);padding:4px 8px;flex:none}
.mlw-in{display:grid;grid-template-columns:minmax(0,118px) minmax(0,1fr)}
@media(min-width:480px){.mlw-in{grid-template-columns:minmax(0,150px) minmax(0,1fr)}}
.mlw-side{border-right:1px solid var(--line);padding:14px 0;background:var(--paper-2)}
.mlw-side b{display:block;font-family:var(--f-mono);font-size:8.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--grey-2);padding:0 14px 10px}
.mlw-side u{display:block;text-decoration:none;font-size:12px;padding:8px 14px;color:var(--char);
  border-left:2px solid transparent;line-height:1.3}
.mlw-side u.on{border-left-color:var(--umber);color:var(--umber-deep);background:var(--paper);font-weight:500}
.mlw-main{padding:16px 16px 18px;min-width:0}
.mlw-h{font-size:15px;font-weight:600;letter-spacing:-.015em;margin-bottom:3px;line-height:1.25}
.mlw-s{font-family:var(--f-mono);font-size:9px;letter-spacing:.11em;text-transform:uppercase;color:var(--grey-2);margin-bottom:16px}
.mlw-kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:560px){.mlw-kpis{grid-template-columns:repeat(3,1fr)}}
.mlw-kpis div{background:var(--paper);padding:11px 12px;min-width:0}
.mlw-kpis s{text-decoration:none;display:block;font-family:var(--f-mono);font-size:8.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--grey-2);line-height:1.35}
.mlw-kpis span{display:block;font-size:15px;font-weight:600;letter-spacing:-.02em;margin-top:5px;color:var(--ink)}
.mlw-rows{margin-top:14px;border-top:1px solid var(--line-soft)}
.mlw-rows div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;
  border-bottom:1px solid var(--line-soft);font-size:12.5px}
.mlw-rows div i{font-style:normal;color:var(--char);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mlw-rows div em{font-style:normal;font-family:var(--f-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--umber-deep);border:1px solid var(--line);padding:3px 7px;flex:none}
.mlw-btn{margin-top:16px;display:inline-flex;align-items:center;gap:10px;border:1px solid var(--umber);
  color:var(--umber-deep);font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;padding:9px 14px}
.mlx-swap{transition:opacity .5s var(--ease),transform .5s var(--ease-out)}
.mlx-swap.out{opacity:0;transform:translateY(-5px)}
@media(prefers-reduced-motion:reduce){.mlx-swap{transition:none}.mlx-swap.out{opacity:1;transform:none}}
.mlw-dots{display:flex;gap:5px;justify-content:center;margin-top:16px}
.mlw-dots button{width:22px;height:3px;background:var(--line);transition:background .35s var(--ease)}
.mlw-dots button[aria-current="true"]{background:var(--umber)}

/* ══════ INTÉGRATIONS ═════════════════════════════════════ */
.intg{background:var(--paper-2)}
.intg-feature{display:grid;grid-template-columns:1fr;gap:clamp(24px,3vw,44px);align-items:center;
  border:1px solid var(--line);background:var(--paper);padding:clamp(24px,3vw,40px);margin-bottom:clamp(28px,3.4vw,48px)}
@media(min-width:900px){.intg-feature{grid-template-columns:minmax(0,1fr) minmax(0,320px)}}
.intg-feature .qb-tag{display:inline-flex;align-items:center;gap:9px;font-family:var(--f-mono);font-size:9.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--umber);margin-bottom:14px}
.intg-feature .qb-tag::before{content:"";width:6px;height:6px;border:1px solid currentColor;transform:rotate(45deg);flex:none}
.intg-feature h3{font-size:clamp(20px,2.4vw,30px);font-weight:600;letter-spacing:-.028em;text-transform:uppercase;line-height:1.08}
.intg-feature p{margin-top:14px;font-size:14.5px;line-height:1.7;color:var(--grey);max-width:56ch}
.qb-flow{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.qb-flow div{background:var(--paper-2);padding:11px 13px;display:flex;align-items:center;gap:11px;font-size:12.5px;color:var(--char)}
.qb-flow div s{text-decoration:none;font-family:var(--f-mono);font-size:9px;letter-spacing:.12em;color:var(--bronze);flex:none;min-width:20px}
.intg-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:620px){.intg-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:980px){.intg-grid{grid-template-columns:repeat(4,1fr)}}
.intg-card{background:var(--paper);padding:clamp(15px,1.8vw,20px);display:flex;flex-direction:column;gap:9px;
  min-height:126px;transition:background .35s var(--ease)}
.intg-card:hover{background:var(--paper-2)}
.intg-card svg{width:22px;height:22px;color:var(--umber);flex:none}
.intg-card b{font-size:13.5px;font-weight:600;letter-spacing:-.005em;line-height:1.25}
.intg-card s{text-decoration:none;font-family:var(--f-mono);font-size:8.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--grey-2);margin-top:auto;line-height:1.4}
.intg-cols{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);
  border-top:0;margin-bottom:clamp(28px,3.4vw,44px)}
@media(min-width:860px){.intg-cols{grid-template-columns:repeat(2,1fr)}}
.intg-cols article{background:var(--paper);padding:clamp(22px,2.6vw,34px)}
.intg-cols .mono{color:var(--umber-deep);display:block;margin-bottom:12px}
.intg-cols h4{font-size:17px;font-weight:600;letter-spacing:-.02em;line-height:1.25;margin-bottom:12px}
.intg-cols p{font-size:14px;line-height:1.7;color:var(--grey);max-width:52ch}
.intg-cols ul{margin-top:14px;display:grid;gap:8px}
.intg-cols li{font-size:13.5px;line-height:1.55;color:var(--char);display:flex;gap:10px;align-items:baseline}
.intg-cols li::before{content:"";width:5px;height:5px;border:1px solid var(--bronze);transform:rotate(45deg);flex:none;position:relative;top:-1px}
.intg-cols .tlink{color:var(--umber-deep);margin-top:16px}
.intg-note{margin-top:clamp(24px,3vw,38px);padding-top:22px;border-top:1px solid var(--line);
  font-size:13px;line-height:1.7;color:var(--grey);max-width:78ch}

/* ══════ ROUTES / REGROUPEMENT GÉOGRAPHIQUE ═══════════════ */
.rtx{background:var(--ink);color:var(--paper)}
.rtx .sec-lede{color:#C9C2B9}
.rtx-grid{display:grid;grid-template-columns:1fr;gap:clamp(34px,4vw,60px);align-items:start}
@media(min-width:1000px){.rtx-grid{grid-template-columns:minmax(0,1.06fr) minmax(0,1fr)}}
.rtx-stage{border:1px solid var(--line-dark);background:rgba(255,255,255,.025);padding:clamp(16px,2vw,24px)}
.rtx-toggle{display:inline-flex;border:1px solid var(--line-dark);margin-bottom:18px}
.rtx-toggle button{padding:9px 15px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--grey-2);transition:.3s var(--ease)}
.rtx-toggle button[aria-pressed="true"]{background:var(--bronze-soft);color:var(--umber-ink)}
.rtx-map{width:100%;height:auto;display:block;overflow:visible}
.rtx-map .zone{fill:none;stroke:rgba(255,255,255,.1);stroke-dasharray:3 6}
.rtx-map .halo{fill:rgba(var(--taupe-rgb),.13);stroke:rgba(var(--capp-rgb),.42);stroke-dasharray:4 5;
  opacity:0;transition:opacity .6s var(--ease)}
.rtx-map.grouped .halo{opacity:1}
.rtx-map .path{fill:none;stroke:var(--bronze);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.5s var(--ease-out)}
.rtx-map.drawn .path{stroke-dashoffset:0}
.rtx-map .node{fill:var(--ink);stroke:var(--bronze-lt);stroke-width:1.3;transition:fill .5s var(--ease)}
.rtx-map.grouped .node{fill:var(--bronze-lt)}
.rtx-map .lbl{fill:#C9C2B9;font-family:var(--f-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.rtx-map .cnt{fill:var(--bronze-lt);font-family:var(--f-mono);font-size:8px;letter-spacing:.06em}
@media(prefers-reduced-motion:reduce){.rtx-map .path{transition:none;stroke-dashoffset:0}.rtx-map .halo{transition:none}}
.rtx-read{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line-dark-soft)}
.rtx-read div{display:grid;gap:3px}
.rtx-read s{text-decoration:none;font-family:var(--f-mono);font-size:8.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--grey-2)}
.rtx-read b{font-size:17px;font-weight:600;letter-spacing:-.02em;color:var(--bronze-lt)}
.rtx-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px}
.rtx-chips span{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--line-dark);padding:7px 11px;color:#C9C2B9}
.rtx-days{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line-dark);border:1px solid var(--line-dark);
  margin-top:clamp(30px,3.6vw,50px)}
@media(min-width:640px){.rtx-days{grid-template-columns:repeat(3,1fr)}}
.rtx-day{background:var(--ink);padding:clamp(18px,2.2vw,26px);display:grid;gap:9px;align-content:start}
.rtx-day s{text-decoration:none;font-family:var(--f-mono);font-size:9px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--bronze)}
.rtx-day b{font-size:clamp(17px,2vw,22px);font-weight:600;letter-spacing:-.022em;text-transform:uppercase}
.rtx-day u{text-decoration:none;display:flex;gap:16px;flex-wrap:wrap;margin-top:2px}
.rtx-day u i{font-style:normal;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;color:#C9C2B9}
.rtx-day u i b{font-size:13px;color:var(--paper);letter-spacing:0;margin-right:5px;font-weight:600}
.rtx-bar{height:2px;background:rgba(255,255,255,.13);position:relative;margin-top:6px;overflow:hidden}
.rtx-bar i{position:absolute;inset:0;background:var(--bronze);transform-origin:left;transform:scaleX(0);
  transition:transform 1s var(--ease-out)}
.rtx-days.in .rtx-bar i{transform:scaleX(var(--v,.5))}
@media(prefers-reduced-motion:reduce){.rtx-bar i{transition:none;transform:scaleX(var(--v,.5))}}
.rtx-out{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:clamp(26px,3vw,40px);
  padding-top:22px;border-top:1px solid var(--line-dark)}
.rtx-out span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--paper)}
.rtx-out svg{color:var(--bronze);flex:none}
.rtx-disc{margin-top:22px;font-size:12.5px;line-height:1.7;color:var(--grey-2);max-width:80ch}

/* ══════ DÉVELOPPEMENT SUR MESURE ═════════════════════════ */
.cxb-lead{font-size:clamp(19px,2.3vw,29px);line-height:1.34;font-weight:500;letter-spacing:-.024em;
  max-width:30ch;margin-bottom:clamp(28px,3.2vw,44px)}
.cxb-lead em{font-family:var(--f-display);font-style:normal;font-weight:500;color:var(--umber-deep);letter-spacing:-.005em}
.cxb-grid{display:grid;grid-template-columns:1fr;gap:clamp(30px,3.6vw,56px)}
@media(min-width:960px){.cxb-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr)}}
.cxb-q{display:grid;gap:0;border-top:1px solid var(--line)}
.cxb-q li{border-bottom:1px solid var(--line);padding:15px 0;display:flex;align-items:baseline;gap:14px;
  font-size:15px;line-height:1.5;color:var(--char)}
.cxb-q li svg{color:var(--bronze);flex:none;position:relative;top:1px}
.cxb-a{margin-top:20px;font-size:clamp(16px,1.7vw,20px);font-weight:500;letter-spacing:-.018em;color:var(--umber-deep)}
.cxb-side p{font-size:14.5px;line-height:1.72;color:var(--grey);max-width:52ch}
.cxb-side p+p{margin-top:14px}
.cxb-caps{display:flex;flex-wrap:wrap;gap:6px;margin-top:24px}
.cxb-caps span{font-family:var(--f-mono);font-size:9px;letter-spacing:.11em;text-transform:uppercase;
  border:1px solid var(--line);padding:6px 10px;color:var(--grey);transition:.3s var(--ease)}
.cxb-caps span:hover{border-color:var(--umber);color:var(--umber-deep)}
.cxb-punch{margin-top:clamp(28px,3.4vw,46px);padding-top:26px;border-top:1px solid var(--line);
  font-size:clamp(16px,1.9vw,22px);font-weight:500;letter-spacing:-.02em;max-width:40ch;line-height:1.4}
.cxb-note{margin-top:16px;font-size:12.5px;line-height:1.7;color:var(--grey-2);max-width:74ch}

/* ══════ FLUX DE BOUT EN BOUT ═════════════════════════════ */
.wfx{background:var(--paper-2)}
.wfx-rail{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
@media(min-width:700px){.wfx-rail{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.wfx-rail{grid-template-columns:repeat(3,1fr)}}
.wfx-step{background:var(--paper);padding:clamp(17px,2vw,22px);display:grid;grid-template-columns:30px 1fr;
  gap:14px;align-items:start;position:relative;transition:background .35s var(--ease)}
.wfx-step:hover{background:var(--paper-2)}
.wfx-step .n{font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;color:var(--bronze);padding-top:2px}
.wfx-step b{display:block;font-size:14px;font-weight:600;letter-spacing:-.008em;line-height:1.3}
.wfx-step s{text-decoration:none;display:block;font-size:12.5px;line-height:1.55;color:var(--grey);margin-top:5px}
.wfx-step[data-hl] b{color:var(--umber-deep)}
.wfx-step[data-hl]::after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--umber)}
.wfx-punch{margin-top:clamp(26px,3vw,40px);font-size:clamp(15px,1.7vw,19px);line-height:1.5;
  color:var(--char);max-width:62ch}

/* ══════ ÉCOSYSTÈME ═══════════════════════════════════════ */
.ecx-grid{display:grid;grid-template-columns:1fr;gap:clamp(32px,4vw,58px);align-items:center}
@media(min-width:1000px){.ecx-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.ecx-map{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.ecx-node{background:var(--paper);padding:clamp(18px,2.2vw,26px);display:grid;gap:8px;align-content:start;min-height:132px}
.ecx-node.core{background:var(--ink);color:var(--paper)}
.ecx-node svg{width:22px;height:22px;color:var(--umber)}
.ecx-node.core svg{color:var(--bronze-lt)}
.ecx-node b{font-size:14px;font-weight:600;letter-spacing:.02em;text-transform:uppercase}
.ecx-node s{text-decoration:none;font-size:12.5px;line-height:1.55;color:var(--grey)}
.ecx-node.core s{color:#C9C2B9}
.ecx-rows{display:grid;gap:0;border-top:1px solid var(--line)}
.ecx-rows div{border-bottom:1px solid var(--line);padding:14px 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ecx-rows i{font-style:normal;font-size:14px;color:var(--char)}
.ecx-rows svg{color:var(--bronze);flex:none}
.ecx-rows b{font-size:14px;font-weight:600;color:var(--umber-deep);letter-spacing:-.005em}

/* ── Débordement horizontal : garde-fou global ────────────── */
.mlw,.rtx-stage,.intg-feature{min-width:0}
.mlw *,.rtx-stage *{min-width:0}

/* ══════ CONSENTEMENT ══════ */
.qc{position:fixed;left:16px;bottom:16px;z-index:190;max-width:440px;width:calc(100% - 32px)}
.qc-card{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:20px 20px 18px;
  box-shadow:0 18px 50px rgba(12,11,10,.16);font-family:var(--f-ui);max-height:calc(100vh - 32px);overflow:auto}
.qc-k{margin:0 0 8px;color:var(--grey)}
.qc-p{margin:0 0 14px;font-size:14px;line-height:1.55}
.qc-prefs{border-top:1px solid var(--line-soft);margin:0 0 12px}
.qc-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--line-soft)}
.qc-rt b{display:block;font-size:14px;font-weight:600}
.qc-rt span{display:block;font-size:12.5px;line-height:1.45;color:var(--grey);margin-top:2px}
.qc-on{font-size:10px;color:var(--grey);white-space:nowrap}
.qc-sw{position:relative;flex:none;width:42px;height:24px;cursor:pointer}
.qc-sw input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.qc-sw span[aria-hidden]{position:absolute;inset:0;border-radius:24px;background:var(--line);transition:background .2s}
.qc-sw span[aria-hidden]::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.qc-sw input:checked+span[aria-hidden]{background:var(--umber-btn)}
.qc-sw input:checked+span[aria-hidden]::after{transform:translateX(18px)}
.qc-sw input:focus-visible+span[aria-hidden]{outline:2px solid var(--umber-btn);outline-offset:2px}
.qc-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.qc-b{flex:1 1 150px;border:1px solid var(--ink);background:var(--paper);color:var(--ink);border-radius:999px;padding:11px 14px;
  font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.qc-b:hover,.qc-b:focus-visible{background:var(--ink);color:var(--paper)}
.qc-l{background:none;border:0;padding:8px 2px;color:var(--ink);font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
@media(max-width:599px){.qc{left:0;right:0;bottom:0;width:100%;max-width:none}
  .qc-card{border-radius:14px 14px 0 0;border-left:0;border-right:0;border-bottom:0;padding:16px 16px calc(14px + env(safe-area-inset-bottom))}
  .qc-p{font-size:13.5px}}
.foot-consent{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.bk-save-note{margin-top:16px;font-size:12.5px;line-height:1.5;color:var(--grey)}
.qc-pl{margin:-6px 0 14px;font-size:13px}
.qc-pl a{text-decoration:underline;text-underline-offset:3px}