:root{
  --forge:#081F2C; --acier:#253746; --ardoise:#57728B; --ardoise-brut:#506D85;
  --braise:#EE2737; --paper:#FAFAFA; --paper-warm:#F2F2F2;
  --ink-10:rgba(250,250,250,0.10); --ink-15:rgba(250,250,250,0.15);
  --paper-60:rgba(250,250,250,0.60);
  --forge-15:rgba(8,31,44,0.12); --forge-08:rgba(8,31,44,0.08);
  --ff-display:"Space Grotesk", sans-serif;
  --ff-body:"DM Sans", sans-serif;
  --ff-mono:"DM Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --gutter:clamp(20px, 4vw, 64px); --max:1440px;
}
*,*::before,*::after{box-sizing:border-box}
.ico{flex:none;display:block;color:currentColor}
.ico--16{width:16px;height:16px}
.ico--20{width:20px;height:20px}
.ico--24{width:24px;height:24px}
html,body{margin:0;padding:0;overflow-x:clip}
html{background:#081F2C}
body{background:transparent;color:var(--paper);font-family:var(--ff-body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:2px solid var(--braise);outline-offset:3px;border-radius:2px;}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding:0 var(--gutter);}
h1,h2,h3{font-family:var(--ff-display);font-weight:500;letter-spacing:-0.035em;line-height:0.98;margin:0;text-wrap:balance;}
p{margin:0;}

.sec{padding:clamp(72px,9vw,140px) 0;}
.sec.forge{background:var(--forge);color:var(--paper);}
.sec.paper{background:var(--paper);color:var(--forge);}

.srcnote{display:block;margin-top:24px;font-family:var(--ff-mono);font-size:12px;letter-spacing:0.01em;color:var(--ardoise-brut);}
.srcnote::before{content:"\00203b ";color:var(--braise);}

/* Header */
.page-hero{padding-top:clamp(190px,19vh,240px);padding-bottom:clamp(56px,7vw,96px);}
.page-hero-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(36px,5vw,80px);align-items:start;}
.page-title{font-family:var(--ff-display);font-weight:500;letter-spacing:-0.04em;line-height:0.94;font-size:var(--fs-display);color:var(--paper);}
.page-chapo{margin:0;font-family:var(--ff-body);font-size:var(--fs-lead);line-height:1.62;color:rgba(250,250,250,0.66);max-width:52ch;}
@media(max-width:900px){.page-hero-grid{grid-template-columns:1fr;gap:28px;align-items:start;}}

/* En-t\0000eate de section g\0000e9n\0000e9rique */
.sec-head{margin-bottom:var(--sp-head);max-width:64ch;}
.sec-head h2{font-size:var(--fs-h2);}
.paper .sec-head h2{color:var(--forge);}
.sec-head p{margin:22px 0 0;font-family:var(--ff-body);font-size:clamp(16px,1.25vw,18px);line-height:1.68;max-width:62ch;}
.forge .sec-head p{color:var(--paper-60);}
.paper .sec-head p{color:var(--acier);}

/* Deux technologies */
.tech-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.4vw,32px);}
.tech{display:flex;flex-direction:column;background:var(--paper-warm);border:1px solid var(--forge-08);border-radius:12px;overflow:hidden;}
.tech-img{aspect-ratio:16/10;background:#fff;display:flex;align-items:center;justify-content:center;}
.tech-img img{width:100%;height:100%;object-fit:contain;}
.tech-body{padding:clamp(24px,2.6vw,36px);display:flex;flex-direction:column;gap:14px;}
.tech .series{font-family:var(--ff-mono);font-size:12px;letter-spacing:0.04em;color:var(--braise);}
.tech h3{font-family:var(--ff-body);font-weight:600;font-size:clamp(20px,1.7vw,25px);letter-spacing:-0.015em;color:var(--forge);line-height:1.15;}
.tech .cap{font-family:var(--ff-body);font-size:clamp(16px,1.25vw,18px);font-weight:500;line-height:1.5;letter-spacing:-0.005em;color:var(--ardoise);}
.tech p{font-family:var(--ff-body);font-size:16px;line-height:1.62;color:var(--acier);}
.tech .btn{align-self:flex-start;margin-top:6px;}
@media(max-width:760px){.tech-grid{grid-template-columns:1fr;gap:24px;}}

/* 6 technologies -- carrousel (fond Forge) */
.t6-head{display:block;margin-bottom:clamp(34px,4vw,54px);}
.t6-head h2{font-size:var(--fs-h2);color:var(--paper);}
/* Piste pilotée en JS par transform (même principe que le carrousel des
   familles de l'accueil, .fam-carousel) : pas de scroll natif ni de
   scroll-snap, la position est un état d'index explicite, jamais déduit
   d'une position de défilement. .t6-rail est la fenêtre qui rogne, .t6-track
   est le rail qui coulisse. */
.t6-rail{overflow:hidden;padding:0 max(var(--gutter),calc((100% - var(--max)) / 2 + var(--gutter))) 4px;}
.t6-track{position:relative;display:flex;gap:clamp(14px,1.6vw,24px);align-items:stretch;transition:transform .5s cubic-bezier(.16,1,.3,1);}
@media (prefers-reduced-motion:reduce){.t6-track{transition:none;}}
.t6-card{display:flex;flex-direction:column;flex:0 0 min(46%,660px);border:1px solid var(--ink-10);border-radius:clamp(14px,1.4vw,20px);padding:clamp(14px,1.2vw,18px);background:rgba(250,250,250,0.02);transition:border-color .25s ease,background .25s ease;}
.t6-card:hover{border-color:var(--ink-15);background:rgba(250,250,250,0.035);}
.t6-media{position:relative;aspect-ratio:4/3;border-radius:clamp(8px,0.8vw,12px);overflow:hidden;background:rgba(250,250,250,0.04);}
.t6-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.t6-media .lab{position:absolute;z-index:2;top:clamp(14px,1.4vw,20px);left:clamp(14px,1.4vw,20px);font-family:var(--ff-mono);font-size:11px;letter-spacing:0.06em;color:var(--braise);background:rgba(250,250,250,0.92);backdrop-filter:blur(6px);border-radius:999px;padding:8px 13px;}
.t6-card h3{margin:clamp(18px,1.9vw,24px) 0 0;font-family:var(--ff-display);font-weight:500;font-size:clamp(20px,1.6vw,24px);letter-spacing:-0.02em;line-height:1.1;color:var(--paper);}
.t6-card .lead{margin:clamp(9px,1vw,12px) 0 0;font-family:var(--ff-body);font-weight:500;font-size:16px;line-height:1.4;letter-spacing:-0.005em;color:var(--paper);max-width:none;}
.t6-card .body{margin:clamp(9px,1vw,12px) 0 0;font-family:var(--ff-body);font-size:16px;line-height:1.65;color:var(--paper-60);max-width:none;}
.t6-benefits{margin-top:auto;padding-top:clamp(18px,2vw,24px);display:flex;flex-wrap:wrap;gap:8px;}
.t6-benefits span{font-family:var(--ff-mono);font-size:11px;letter-spacing:0.01em;color:var(--paper);border:1px solid var(--ink-15);border-radius:999px;padding:7px 13px;}
@media(max-width:900px){.t6-card{flex:0 0 82%;}}

/* Controle du curseur (fleches + pastilles), identique a components/argane-slider.css de la V2 */
.arg-slider-ctrl{display:flex;align-items:center;gap:clamp(18px,2.4vw,34px);margin-top:clamp(22px,2.6vw,32px);}
.arg-nav{display:flex;gap:10px;}
.arg-nav button{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(250,250,250,0.08);color:var(--paper);transition:background .2s ease,opacity .2s ease,color .2s ease;}
.arg-nav button svg{width:20px;height:20px;}
.arg-nav button:hover{background:rgba(250,250,250,0.16);}
.arg-nav button[disabled]{opacity:0.32;cursor:default;}
.arg-nav button[disabled]:hover{background:rgba(250,250,250,0.08);}
.arg-dots{display:flex;align-items:center;gap:6px;}
.arg-dots button{width:22px;height:2px;border-radius:2px;background:rgba(250,250,250,0.26);transition:background .25s ease,width .35s cubic-bezier(.2,.8,.2,1);}
.arg-dots button:hover{background:rgba(250,250,250,0.5);}
.arg-dots button[aria-current="true"]{width:44px;background:var(--braise);}

/* Usages */
.usage-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,24px);}
.usage{display:flex;flex-direction:column;}
.usage .u-img{aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,var(--acier),var(--ardoise-brut));margin-bottom:20px;}.usage h3{font-family:var(--ff-body);font-weight:600;font-size:clamp(18px,1.4vw,21px);letter-spacing:-0.015em;color:var(--forge);margin:0 0 10px;}
.usage p{font-family:var(--ff-body);font-size:14px;line-height:1.6;color:var(--acier);}
@media(max-width:880px){.usage-grid{grid-template-columns:1fr 1fr;gap:32px 24px;}}
@media(max-width:480px){.usage-grid{grid-template-columns:1fr;}}

/* CTA band */
.cta-band{text-align:left;}
.cta-band h2{font-size:var(--fs-h1);max-width:18ch;}
.cta-band .row{margin-top:clamp(32px,4vw,48px);display:flex;flex-wrap:wrap;gap:14px;}

/* ============================================================
   STORIES \002014 sections num\0000e9rot\0000e9es (reprises d'\0000c0 propos)
   ============================================================ */
.stories{padding:clamp(80px,9vw,150px) 0;}
.story-lead{max-width:840px;margin:0 0 clamp(56px,7vw,96px);}
.story-lead h2{font-size:var(--fs-h2);color:var(--paper);}
.story-lead p{margin:22px 0 0;font-family:var(--ff-body);font-size:clamp(16px,1.25vw,18px);line-height:1.68;color:var(--paper-60);max-width:58ch;}
.story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);align-items:center;}
.story + .story{margin-top:clamp(80px,9vw,140px);}
.story-media{aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,var(--acier),var(--ardoise-brut));}.story.flip .story-media{order:2;}
.story-body{display:flex;flex-direction:column;}
.story-index{display:flex;align-items:center;gap:18px;margin-bottom:clamp(20px,2.4vw,30px);}
.story-index .num{font-family:var(--ff-display);font-weight:500;font-size:clamp(20px,1.5vw,22px);letter-spacing:0.02em;color:var(--braise);font-variant-numeric:tabular-nums;line-height:1;}
.story-index .rule{flex:1;height:1px;background:var(--ink-10);max-width:120px;}
.story-body h3{font-family:var(--ff-display);font-weight:500;font-size:var(--fs-h2);letter-spacing:-0.035em;line-height:1.0;color:var(--paper);}
.story-body p{margin:clamp(18px,2vw,26px) 0 0;font-family:var(--ff-body);font-size:clamp(16px,1.25vw,18px);line-height:1.7;color:var(--paper-60);max-width:48ch;}
.story-body .meta{margin-top:clamp(24px,2.6vw,34px);display:flex;flex-wrap:wrap;gap:10px;}
.story-body .meta span{font-family:var(--ff-mono);font-size:12px;letter-spacing:0.02em;color:var(--paper);border:1px solid var(--ink-15);border-radius:999px;padding:9px 16px;}
@media(max-width:860px){
  .story{grid-template-columns:1fr;gap:28px;}
  .story.flip .story-media{order:0;}
  .story-body{order:1;}
}

/* ============================================================
   MARQUE ARGANE (reprise d'\0000c0 propos)
   ============================================================ */
.brand-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center;}
.brand-grid h2{font-size:var(--fs-h2);color:var(--forge);}
.brand-grid p{margin:24px 0 0;font-family:var(--ff-body);font-size:clamp(16px,1.25vw,18px);line-height:1.68;color:var(--acier);max-width:50ch;}
.brand-mark{display:flex;align-items:center;justify-content:center;}
.brand-mark img{width:min(100%,440px);height:auto;}
@media(max-width:900px){.brand-grid{grid-template-columns:1fr;gap:32px;}}

body > section:last-of-type{border-bottom-left-radius:clamp(16px,2.5vw,28px);border-bottom-right-radius:clamp(16px,2.5vw,28px);}