/* =====================================================================
   Charte BA Forge — alignée sur le teaser vidéo
   encre #15171C · orange signal #FF4F1A · carte #1D2027 · ligne #2C3039
   Newsreader (titres) · Inter (texte) · JetBrains Mono (codes, skills)
   ===================================================================== */
:root{
  --ink:#15171C;--ink-2:#2D3038;--card:#1D2027;--line:#2C3039;--line-2:#3A3E47;
  --mute-d:#A9AEB8;--muted:#565B66;--muted-2:#6B707A;
  --rule:#E3E3DE;--rule-2:#D5D7D2;--paper:#FFFFFF;--cream:#F4F1EA;
  --org:#FF4F1A;--org-text:#B93A0B;--org-soft:#FFE6DA;
  --blue:#7FA7FF;--green:#3DDC97;
  --serif:"Newsreader",Georgia,serif;--sans:"Inter",Arial,sans-serif;--mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1240px;--gut:32px;--ease:cubic-bezier(.34,1.56,.64,1)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--org-text)}a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--org);outline-offset:3px}
.hero-sec :focus-visible,.promo :focus-visible,.final :focus-visible{outline-color:var(--ink)}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:100;background:var(--ink);color:#fff;padding:10px 14px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.sec{padding-top:112px;padding-bottom:112px;position:relative}
.sec--rule{border-top:1px solid var(--rule)}
.sec--soft{background:var(--cream)}
.dark{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.dark>.wrap{position:relative;z-index:1}
.grid-bg::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:72px 72px;opacity:.55;-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse at 70% 40%,#000 0%,transparent 75%);pointer-events:none}
.stack{display:flex;flex-direction:column}
.eyebrow{margin:0;font-family:var(--mono);font-size:14px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--org-text)}
.dark .eyebrow{color:var(--org)}
.h1,.h2{font-family:var(--serif);font-weight:400;margin:0;color:inherit}
.h1 em,.h2 em,.final h2 em{font-style:italic}
.dark .h1 em,.dark .h2 em{color:var(--org)}
.h1{font-size:clamp(44px,6.4vw,82px);line-height:.98;letter-spacing:-.03em}
.h2{font-size:clamp(34px,4.2vw,50px);line-height:1.06;letter-spacing:-.022em}
.h2--xl{font-size:clamp(38px,5vw,66px);line-height:1.02;letter-spacing:-.026em}
.lead{margin:0;font-size:18px;color:var(--muted)}
.dark .lead{color:var(--mute-d)}
.head{gap:16px;max-width:860px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:14px 28px;border-radius:999px;font:600 16px var(--sans);text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background .15s,color .15s,transform .15s}
.btn:hover{transform:translateY(-1px)}
.btn--org{background:var(--org);color:var(--ink)}.btn--org:hover{background:#FF6A3D;color:var(--ink)}
.btn--ink{background:var(--ink);color:#fff}.btn--ink:hover{background:#000;color:#fff}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}.btn--ghost:hover{background:var(--ink);color:#fff}
.btn--ghost-w{background:transparent;color:#fff;border-color:#fff}.btn--ghost-w:hover{background:#fff;color:var(--ink)}
.link{color:inherit;font-weight:500;text-underline-offset:5px;padding:12px 6px;display:inline-flex;align-items:center;gap:10px}
.dark .link:hover{color:var(--org)}
.stamp{display:inline-block;font:600 13px var(--sans);letter-spacing:.18em;text-transform:uppercase;background:var(--org);color:var(--ink);padding:7px 14px;border-radius:7px;transform:rotate(-8deg);white-space:nowrap}
.cbar{display:flex;gap:8px;align-items:center;font:500 12px var(--mono);color:var(--mute-d);padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:4px}
.cbar i{width:9px;height:9px;border-radius:50%;background:var(--line-2)}
.cbar span{margin-left:8px}
.cbar b{margin-left:auto;color:var(--green);font-weight:500}

/* ---------- promo bar ---------- */
.promo{background:#fff;color:var(--ink);font-size:14px;line-height:1.4;border-bottom:1px solid var(--rule)}
.promo strong{color:var(--org-text)}
.promo .wrap{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 10px;padding-top:9px;padding-bottom:9px;text-align:center}
.promo strong{font-weight:600}
.promo__sep{opacity:.5}
.promo code{font:500 14px var(--mono);background:var(--ink);color:#fff;padding:2px 9px;border-radius:5px;letter-spacing:.04em;-webkit-user-select:all;user-select:all}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:50;background:var(--ink);color:#fff;border-bottom:1px solid var(--line);transition:box-shadow .2s}
.hdr.is-scrolled{box-shadow:0 8px 28px rgba(0,0,0,.25)}
.hdr__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-top:14px;padding-bottom:14px}
.logo{display:inline-flex;align-items:center;gap:12px;font-family:var(--serif);font-size:26px;font-weight:500;color:inherit;text-decoration:none;letter-spacing:-.01em}.logo img{display:block;flex:none}.logo em{font-style:italic;font-weight:500}
.logo:hover{color:inherit}
.nav{display:flex;flex-wrap:wrap;gap:4px 28px}.nav a{color:#E7E9EE;text-decoration:none;font-size:15px;padding:10px 0}.nav a:hover{color:var(--org)}
.hdr__act{display:flex;gap:14px;align-items:center}
.lang{display:flex;gap:4px}
.lang button{min-width:44px;min-height:44px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:#fff;font:500 14px var(--sans);cursor:pointer}
.lang button[aria-pressed="true"]{background:#fff;border-color:#fff;color:var(--ink)}
.hdr .btn{padding:11px 22px;min-height:44px;font-size:15px}

/* ---------- hero ---------- */
.hero-sec{position:relative;overflow:hidden;background:var(--org);color:var(--ink)}
.hero-sec::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(21,23,28,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(21,23,28,.09) 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse at 70% 40%,#000 0%,transparent 75%);pointer-events:none}
.hero-sec::after{content:"";position:absolute;top:-10%;bottom:-10%;right:-12%;width:34%;background:var(--ink);opacity:.07;transform:skewX(-12deg);pointer-events:none}
.hero-sec>.wrap{position:relative;z-index:1}
.hero-sec .eyebrow{color:var(--ink)}
.hero-sec .h1 em{color:#fff}
.hero-sec .hero__sub{color:#fff}
.hero-sec .link{color:var(--ink)}.hero-sec .link:hover{color:#fff}
.hero-sec .play-i{background:var(--ink)}.hero-sec .play-i::after{border-left-color:var(--org)}
.hero-sec .chips{color:var(--ink)}.hero-sec .chips li::before{background:var(--ink)}
.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));gap:72px;align-items:center;padding-top:104px;padding-bottom:72px}
.hero__txt{gap:28px}
.hero__sub{margin:0;font-size:19px;color:var(--mute-d);max-width:560px}
.row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.play-i{width:28px;height:28px;border-radius:50%;background:var(--org);display:inline-flex;align-items:center;justify-content:center;flex:none}
.play-i::after{content:"";border-left:9px solid var(--ink);border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}
.sheet{position:relative;margin:0;background:var(--card);border:1px solid var(--ink);border-radius:20px;box-shadow:0 50px 100px -40px rgba(21,23,28,.75);padding:26px 30px 30px;display:flex;flex-direction:column;gap:14px;color:#E7E9EE}
.sheet__top{display:flex;justify-content:space-between;gap:12px;font:500 12px var(--mono);color:var(--mute-d)}
.sheet__title{margin:0;font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.15;color:#fff}
.sheet__story{margin:0;font-family:var(--serif);font-style:italic;font-size:18px;color:#C9CDD5}
.sheet__rg{margin:0;font-size:14px;color:var(--mute-d);border-left:2px solid var(--org);padding-left:12px}
.sheet__gk{background:#15171C;border:1px solid var(--line);border-radius:12px;padding:16px 18px;font:400 13.5px/1.65 var(--mono);display:flex;flex-direction:column;gap:2px}
.sheet__gk p{margin:0;color:#E7E9EE}.sheet__gk strong{color:var(--blue);font-weight:500}.sheet__gk .t{color:var(--org)}
.sheet figcaption{font:400 12.5px/1.5 var(--mono);color:var(--mute-d);padding-right:110px}
.sheet .stamp{position:absolute;right:26px;bottom:22px;font-size:16px;padding:9px 18px}
.chips{display:flex;flex-wrap:wrap;gap:12px 36px;font:400 14px var(--mono);color:var(--mute-d);padding-bottom:88px;margin:0 auto;list-style:none}
.chips li{display:flex;align-items:center;gap:10px}.chips li::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--org)}

/* ---------- pain ---------- */
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:64px}
.olist{list-style:none;margin:0;padding:0}
.olist li{border-top:1px solid var(--rule);padding:26px 0;display:flex;gap:24px}
.olist .n{font:500 14px var(--mono);color:var(--org-text);flex:none;width:56px;padding-top:4px}
.olist h3{margin:0 0 6px;font-size:19px;font-weight:600}.olist p{margin:0;color:var(--muted)}

/* ---------- before / after ---------- */
.ba{display:flex;flex-wrap:wrap;gap:32px;align-items:center;margin-top:64px}
.ba__col{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:18px}
.ba__col--after{flex-basis:440px}
.label{margin:0;font:500 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
.mail{background:#fff;border:1px solid var(--rule);border-radius:14px;box-shadow:0 18px 40px rgba(21,23,28,.07);transform:rotate(-1.2deg);padding:28px 30px;display:flex;flex-direction:column;gap:14px}
.mail__hd{display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--muted-2);border-bottom:1px solid #EEEEEA;padding-bottom:12px}.mail__hd strong{color:var(--ink);font-weight:600}
.mail p{margin:0;font-size:17px;line-height:1.8;color:var(--ink-2)}
.mail mark{background:var(--org-soft);color:var(--ink);padding:2px 4px;border-radius:3px}
.mail sup{color:var(--org-text);font-weight:700;margin-left:3px}
.notes{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.notes li{display:flex;gap:12px;align-items:center;font-size:15px;color:var(--ink-2)}
.num{flex:none;width:26px;height:26px;border-radius:13px;border:1.5px solid var(--org-text);color:var(--org-text);font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.num--fill{background:var(--org);color:var(--ink);border-color:var(--org)}
.ba__mid{flex:0 1 160px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.ba__arrow{width:92px;height:92px;border-radius:46px;background:var(--org);display:flex;align-items:center;justify-content:center}
.ba__cmd{font:400 13px var(--mono)}.ba__note{font-size:13px;color:var(--muted-2)}
.outbox{position:relative;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px 28px 22px;box-shadow:0 40px 80px -30px rgba(21,23,28,.55)}
.out{list-style:none;margin:0;padding:0}
.out li{display:grid;grid-template-columns:108px 1fr 28px;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.out code{font:500 13px var(--mono);color:var(--org)}.out span{font-size:15px;color:#F2F3F5}
.out__ft{margin:16px 0 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--mute-d);padding-right:96px}.out__ft b{color:var(--green);font-weight:600}
.outbox .stamp{position:absolute;right:20px;bottom:-14px;font-size:15px}

/* ---------- teaser ---------- */
.teaser-sec{background:var(--cream);overflow:hidden}
.teaser-sec::before{content:"";position:absolute;inset:0;background-image:linear-gradient(#E4DFD3 1px,transparent 1px),linear-gradient(90deg,#E4DFD3 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:radial-gradient(ellipse at 70% 45%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse at 70% 45%,#000 0%,transparent 75%);pointer-events:none}
.teaser-sec>.wrap{position:relative}
.teaser-sec .h2 em{color:var(--org-text)}
.teaser-sec [data-video-other]{color:var(--ink)}.teaser-sec [data-video-other]:hover{color:var(--org-text)}
.teaser{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:56px;align-items:center}
.teaser .head{gap:20px}
.tv{position:relative;display:block;width:100%;aspect-ratio:16/9;border:1px solid var(--ink);border-radius:20px;overflow:hidden;background:var(--ink);cursor:pointer;padding:0;color:#fff;text-align:left;box-shadow:0 50px 90px -40px rgba(21,23,28,.65);transition:transform .25s,box-shadow .25s}
.tv:hover{transform:translateY(-4px);box-shadow:0 60px 100px -40px rgba(21,23,28,.75)}
.tv::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;opacity:.6}
.tv__wipe{position:absolute;top:-10%;bottom:-10%;right:-18%;width:34%;background:var(--org);transform:skewX(-12deg)}
.tv__hook{position:absolute;left:7%;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;font:400 clamp(26px,4.2vw,58px)/1.02 var(--serif);letter-spacing:-.03em}
.tv__hook span:last-child{font-style:italic;color:var(--org)}
.tv__logo{position:absolute;left:7%;top:8%;display:flex;align-items:center;gap:10px;font:500 18px var(--serif)}
.tv__logo em{font-style:italic}
.tv__play{position:absolute;right:9%;top:50%;width:clamp(64px,9vw,104px);height:clamp(64px,9vw,104px);margin-top:calc(clamp(64px,9vw,104px) / -2);border-radius:50%;background:var(--ink);border:2px solid #fff;box-sizing:border-box;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 0 rgba(255,255,255,.5);animation:pulse 2.4s infinite;transition:transform .25s}
.tv:hover .tv__play{transform:scale(1.06)}
.tv__play::after{content:"";border-left:clamp(18px,2.4vw,28px) solid #fff;border-top:clamp(11px,1.5vw,17px) solid transparent;border-bottom:clamp(11px,1.5vw,17px) solid transparent;margin-left:6px}
.tv__tag{position:absolute;left:7%;bottom:8%;font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute-d)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(21,23,28,.55)}70%{box-shadow:0 0 0 22px rgba(21,23,28,0)}100%{box-shadow:0 0 0 0 rgba(21,23,28,0)}}
.rail{position:relative;margin-top:72px;height:64px;list-style:none;padding:0}
.rail::before,.rail::after{content:"";position:absolute;left:0;right:0;top:9px;height:3px;background:var(--rule-2)}
.rail::after{right:auto;width:0;background:var(--org);transition:width 2.4s cubic-bezier(.65,0,.35,1)}
.rail.is-in::after{width:100%}
.rail li{z-index:1}
.rail li{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px}
.rail li::before{content:"";width:20px;height:20px;border-radius:50%;background:var(--cream);border:3px solid var(--rule-2);transition:background .3s,border-color .3s}
.rail.is-in li::before{background:var(--org);border-color:var(--org)}
.rail li span{font:600 11.5px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap}
.rail li:first-child{transform:none;align-items:flex-start}.rail li:last-child{transform:translateX(-100%);align-items:flex-end}
.dlg{width:min(1100px,calc(100vw - 32px),calc((100vh - 120px) * 16 / 9));max-width:none;padding:0;border:0;background:transparent;overflow:visible}
.dlg::backdrop{background:rgba(10,11,14,.88);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.dlg__frame{position:relative;aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden;border:1px solid var(--line-2)}
.dlg__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.dlg__bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;color:#fff;font:500 13px var(--mono);letter-spacing:.06em;text-transform:uppercase}
.dlg__yt{margin-left:auto;color:#fff;text-transform:none;letter-spacing:0;font:500 14px var(--sans);text-underline-offset:4px}.dlg__yt:hover{color:var(--org)}
.dlg__x{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);background:var(--ink);color:#fff;font:400 22px/1 var(--sans);cursor:pointer}
.dlg__x:hover{background:var(--org);color:var(--ink);border-color:var(--org)}

/* ---------- kit ---------- */
.kitgrp{margin-top:56px}
.kitgrp__hd{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;border-bottom:1.5px solid var(--ink);padding-bottom:14px}
.kitgrp__hd h3{margin:0;font-family:var(--serif);font-weight:400;font-size:30px}.kitgrp__hd span{font-size:15px;color:var(--muted)}
.dl{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr));column-gap:64px}
.dl>div{border-top:1px solid var(--rule-2);padding:22px 0;display:grid;grid-template-columns:230px 1fr;gap:20px}
.dl dt{font:500 13.5px var(--mono);color:var(--org-text);padding-top:3px;overflow-wrap:anywhere}
.dl dd{margin:0;display:flex;flex-direction:column;gap:4px}.dl dd strong{font-size:17px;font-weight:600}.dl dd span{font-size:15px;color:var(--muted)}
.after-cta{margin-top:56px}.after-cta span{font-size:15px;color:var(--muted)}

/* ---------- matrix ---------- */
.mx-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:32px 64px;align-items:end}
.mx-wrap{margin-top:40px;overflow-x:auto;border:1px solid var(--rule);border-radius:16px;box-shadow:0 24px 50px rgba(21,23,28,.06)}
.mx{width:100%;min-width:880px;border-collapse:collapse}
.mx th,.mx td{padding:14px 4px;text-align:center;border-bottom:1px solid #EEEEEA;font-weight:400}
.mx thead th{font:500 13px var(--mono);vertical-align:bottom;border-bottom:1.5px solid var(--ink);padding:18px 4px}
.mx thead th:first-child{font:500 12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2);text-align:left;padding-left:22px;width:280px}
.mx thead th.new{color:var(--org-text);font-weight:600}.mx thead th.new small{display:block;font:500 11px var(--sans)}
.mx tbody th{text-align:left;padding:16px 22px}.mx tbody th code{display:block;font:500 13px var(--mono);color:var(--org-text)}.mx tbody th span{font-size:15px}
.mx tr.gap{background:#FFF5F0}
.dot{display:inline-block;width:18px;height:18px;border-radius:9px;background:var(--ink);vertical-align:middle}
.dot--off{width:6px;height:6px;border-radius:3px;background:var(--rule-2)}
.dot--gap{width:34px;height:34px;border-radius:17px;border:2px dashed var(--org-text);background:transparent;color:var(--org-text);font-weight:700;font-size:15px;display:inline-flex;align-items:center;justify-content:center}
.mx-foot{margin-top:40px;display:flex;flex-wrap:wrap;gap:24px 48px;align-items:center;justify-content:space-between}
.legend{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:12px 28px;font-size:14px;color:var(--muted)}
.legend li{display:flex;align-items:center;gap:10px}.legend .dot{width:14px;height:14px}.legend .dot--gap{width:18px;height:18px}
.alert{flex:1 1 460px;max-width:640px;border:1.5px solid var(--org);border-radius:14px;background:#FFF8F4;padding:20px 22px;display:flex;gap:16px;align-items:flex-start}
.alert__i{flex:none;width:34px;height:34px;border-radius:9px;background:var(--org);color:var(--ink);font-weight:700;display:flex;align-items:center;justify-content:center;transform:rotate(-8deg)}
.alert p{margin:0;font-size:15px;color:var(--ink-2)}.alert p:first-child{font-weight:600;color:var(--ink);margin-bottom:4px}

/* ---------- steps ---------- */
.steps{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:40px}
.steps li{display:flex;flex-direction:column;gap:14px}
.steps .n{font:500 14px var(--mono);letter-spacing:.06em;color:var(--org-text)}
.steps .bar{height:3px;background:var(--rule);position:relative;overflow:hidden;border-radius:2px}
.steps .bar::after{content:"";position:absolute;inset:0;background:var(--org);transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.65,0,.35,1)}
.steps.is-in .bar::after{transform:scaleX(1)}
.steps.is-in li:nth-child(2) .bar::after{transition-delay:.25s}.steps.is-in li:nth-child(3) .bar::after{transition-delay:.5s}.steps.is-in li:nth-child(4) .bar::after{transition-delay:.75s}
.steps h3{margin:0;font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.1}.steps p{margin:0;font-size:15px;color:var(--muted)}

/* ---------- who ---------- */
.who{margin-top:48px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:24px}
.who>div{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:30px 28px}
.who h3{margin:0 0 10px;font-family:var(--serif);font-weight:400;font-size:28px;line-height:1.15}
.who p{margin:0;color:var(--mute-d)}

/* ---------- pricing ---------- */
.tiers{margin:56px auto 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px;max-width:1000px}
.tier{position:relative;padding:34px 32px;display:flex;flex-direction:column;gap:18px;border:1.5px solid var(--ink);border-radius:22px;background:#fff}
.tier--hl{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:0 50px 100px -50px rgba(21,23,28,.7)}
.tier__hd{display:flex;justify-content:space-between;align-items:center;gap:8px}
.tier h3{margin:0;font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.1}
.tier__desc{margin:0;font-size:15px;color:var(--muted)}.tier--hl .tier__desc{color:var(--mute-d)}
.tier__was{margin:0;display:flex;align-items:center;gap:10px;font-size:16px;color:var(--muted-2);min-height:26px}
.tier--hl .tier__was{color:var(--mute-d)}
.tier__was s{text-decoration-thickness:1.5px}
.tier__off{font:600 12px var(--mono);background:var(--org);color:var(--ink);padding:3px 8px;border-radius:5px}
.tier__price{margin:-8px 0 0;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}.tier__price b{font-family:var(--serif);font-weight:400;font-size:60px;line-height:1;letter-spacing:-.02em}.tier__price span{font-size:14px;color:var(--muted)}
.tier--hl .tier__price span{color:var(--mute-d)}
.tier__code{margin:0;font-size:14px;color:var(--ink-2);border:1.5px dashed var(--org-text);border-radius:10px;padding:9px 12px;line-height:1.5}
.tier--hl .tier__code{color:#E7E9EE;border-color:var(--org)}
.tier__code code{font:600 13.5px var(--mono);color:var(--org-text);letter-spacing:.04em;-webkit-user-select:all;user-select:all}
.tier--hl .tier__code code{color:var(--org)}
.tier ul{list-style:none;margin:0;padding:0;flex-grow:1}
.tier li{font-size:15px;border-top:1px solid var(--rule);padding:10px 0;display:flex;gap:10px}.tier--hl li{border-color:var(--line)}
.tier .ico{flex:none;margin-top:3px;color:var(--org-text)}.tier--hl .ico{color:var(--org)}
.tier .stamp{position:absolute;top:-14px;right:24px}
.free{margin:24px auto 0;max-width:1000px;border:1px solid var(--rule-2);border-radius:18px;background:var(--cream);padding:22px 26px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.2fr) auto;gap:16px 32px;align-items:center}
.free h3{margin:0;font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.15}
.free__desc{margin:4px 0 0;font-size:14px;color:var(--muted)}
.free ul{list-style:none;margin:0;padding:0;font-size:14px;color:var(--ink-2);display:flex;flex-direction:column;gap:6px}
.free li{display:flex;gap:8px}.free .ico{flex:none;margin-top:3px;color:var(--org-text)}
.free__act{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.free__price{margin:0;font-size:13px;color:var(--muted)}.free__price b{font-family:var(--serif);font-weight:400;font-size:30px;color:var(--ink);margin-right:6px}
.free .btn{padding:11px 22px;min-height:44px;font-size:15px}
.fine{margin:24px 0 0;font-size:14px;color:var(--muted)}
#pricing .head{margin:0 auto;align-items:center;text-align:center}
#pricing .fine{text-align:center}

/* ---------- founder ---------- */
.founder{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start;max-width:1040px}
.portrait{width:180px;height:220px;background:var(--cream);border:1px solid var(--rule);border-radius:16px;flex:none;box-sizing:border-box}
.founder__txt{flex:1 1 440px;display:flex;flex-direction:column;gap:18px}
.founder__body{margin:0;font-family:var(--serif);font-size:21px;line-height:1.55;color:var(--ink-2)}
.founder__pts{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}.founder__pts li{padding:12px 0;border-bottom:1px solid var(--rule);font-size:16px;color:var(--ink-2)}.founder__pts strong{font-weight:600;color:var(--ink)}

/* ---------- faq ---------- */
.faq{border-bottom:1px solid var(--rule)}
.faq details{border-top:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;min-height:64px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;font:400 21px var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";width:32px;height:32px;border-radius:50%;border:1.5px solid var(--ink);display:inline-flex;align-items:center;justify-content:center;font:400 20px/1 var(--sans);flex:none;transition:background .15s}
.faq details[open] summary::after{content:"−";background:var(--org);border-color:var(--org)}
.faq details p{margin:0;padding:0 0 22px;color:var(--muted);max-width:640px}

/* ---------- final ---------- */
.final{background:var(--org);color:var(--ink);overflow:hidden}
.final::before{content:"";position:absolute;top:-20%;bottom:-20%;right:-8%;width:30%;background:var(--ink);transform:skewX(-12deg);opacity:.06}
.final .wrap{position:relative;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.final h2{font-family:var(--serif);font-weight:400;font-size:clamp(44px,6.4vw,84px);line-height:1;letter-spacing:-.03em;margin:0;max-width:960px}
.final p{margin:0;font-size:19px;color:#fff;max-width:620px}
.final .stamp{background:var(--ink);color:var(--org);font-size:15px}
.btn--ghost-ink{background:transparent;color:var(--ink);border-color:var(--ink)}.btn--ghost-ink:hover{background:var(--ink);color:#fff}

/* ---------- footer ---------- */
.ftr{padding-top:48px;padding-bottom:48px;color:var(--muted)}
.ftr__top{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}
.ftr__brand{display:flex;flex-direction:column;gap:4px;font-size:14px}.ftr__brand .logo{font-size:24px;color:var(--ink)}
.ftr nav{display:flex;flex-wrap:wrap;gap:8px 28px}.ftr nav a{color:var(--muted);font-size:14px}
.ftr__legal{margin:24px 0 0;font-size:13px;color:var(--muted-2);border-top:1px solid var(--rule);padding-top:18px}

/* ---------- motion ---------- */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.js .rv.is-in{opacity:1;transform:none}
.js .rv .stamp,.js .stamp.rv{opacity:0;transform:rotate(-8deg) scale(2.2)}
.js .rv.is-in .stamp,.js .stamp.rv.is-in{opacity:1;transform:rotate(-8deg) scale(1);transition:opacity .15s ease .45s,transform .45s var(--ease) .45s}
[hidden]{display:none !important}

/* ---------- responsive ---------- */
@media (max-width:899px){.nav{order:3;width:100%;gap:0 24px}.hdr__in{padding-top:10px;padding-bottom:6px;row-gap:4px}.free{grid-template-columns:1fr}.free__act{align-items:flex-start;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px 20px}}
@media (max-width:720px){
  :root{--gut:16px}
  .sec{padding-top:72px;padding-bottom:72px}
  .hero{padding-top:56px;gap:48px}
  .sheet{padding:20px 20px 24px}
  .sheet figcaption{padding-right:0;padding-bottom:36px}
  .mail{transform:none;padding:22px}
  .ba__mid{flex-basis:100%;flex-direction:row;justify-content:center}
  .ba__arrow{width:56px;height:56px;transform:rotate(90deg)}
  .dl>div{grid-template-columns:1fr;gap:6px}
  .out li{grid-template-columns:86px 1fr 26px;gap:10px}
  .outbox{padding:18px 18px 22px}
  .out__ft{padding-right:0;padding-bottom:12px}
  html{scroll-padding-top:150px}
  .hdr__in{padding-top:8px;padding-bottom:4px;gap:4px 12px}
  .logo{font-size:22px;gap:10px}.hdr .logo img{width:32px;height:32px}
  .hdr__act{gap:8px}
  .hdr .btn{padding:10px 16px;font-size:14px}
  .nav{order:3;width:100%;gap:0 18px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a{white-space:nowrap;padding:8px 0;font-size:14px}
  .promo{font-size:13px}.promo code{font-size:13px}
  .rail{margin-top:48px;height:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px 8px}
  .rail::before,.rail::after{display:none}
  .rail li,.rail li:first-child,.rail li:last-child{position:static;transform:none;align-items:center;gap:8px}
  .rail li span{font-size:10px;letter-spacing:.06em}
  .tier{padding:30px 22px}
  .tier__price b{font-size:52px}
  .tv__logo{font-size:14px}.tv__tag{font-size:10px}
}
@media (max-width:440px){.hdr .logo__txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv,.js .rv .stamp,.js .stamp.rv{opacity:1;transform:none;transition:none}
  .js .rv .stamp,.js .stamp.rv{transform:rotate(-8deg)}
  .tv__play{animation:none}.rail::after,.steps .bar::after{transition:none}
}

/* =====================================================================
   Ajouts multi-pages
   ===================================================================== */
.wrap--narrow{max-width:1064px}
.sec--top{padding-top:48px}
.head--center{margin:0 auto;align-items:center;text-align:center}
.fine--center{text-align:center}
.link--arrow{padding-left:0;text-decoration:underline}
.link--btn{background:none;border:0;cursor:pointer;font:inherit;font-weight:500;text-decoration:underline;text-underline-offset:5px}

/* navigation */
.nav a[aria-current="page"]{color:var(--org);text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:2px}
.lang-sw{min-width:44px;min-height:44px;border-radius:999px;border:1px solid var(--line-2);color:#fff;font:500 14px var(--sans);display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.lang-sw:hover{background:#fff;color:var(--ink)}
.crumb{padding-top:20px;padding-bottom:0;font-size:14px;color:var(--muted)}
.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumb li+li::before{content:"›";margin-right:6px;color:var(--muted-2)}
.crumb a{color:var(--muted)}
.hero-sec .crumb,.hero-sec .crumb a{color:var(--ink)}
.hero-sec .crumb{position:relative;z-index:1}

/* bandeau de langue */
.langbar{background:var(--cream);border-bottom:1px solid var(--rule);font-size:14px}
.langbar__in{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;justify-content:center;padding-top:6px;padding-bottom:6px}
.langbar a{font-weight:600}
.langbar__x{min-width:44px;min-height:44px;border:0;background:transparent;font:400 22px/1 var(--sans);cursor:pointer;color:var(--ink)}

/* kit */
.kitgrp__hd h2{margin:0;font-family:var(--serif);font-weight:400;font-size:30px}
.dl>div{scroll-margin-top:120px}
.dl>div:target{background:var(--org-soft);margin:0 -16px;padding-left:16px;padding-right:16px;border-radius:8px}
.toc{margin-top:28px;display:flex;flex-wrap:wrap;gap:8px 28px;font-weight:500}
.steps--3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}

/* tarifs */
.tier__grow{flex-grow:1}
.tier__h{margin:0;font-family:var(--serif);font-weight:400;font-size:32px;line-height:1.1}
.cmp-wrap{margin-top:40px;overflow-x:auto;border:1px solid var(--rule);border-radius:16px;background:#fff}
.cmp{width:100%;border-collapse:collapse}
.cmp th,.cmp td{padding:14px 18px;border-bottom:1px solid #EEEEEA;text-align:center;font-weight:400}
.cmp thead th{font:500 13px var(--mono);border-bottom:1.5px solid var(--ink)}
.cmp thead th:first-child,.cmp tbody th,.cmp tfoot th{text-align:left}
.cmp tbody th code,.cmp tbody th span{display:block}.cmp tbody th span{margin-top:2px}.cmp td{width:22%}
.cmp tbody th code{font:500 13px var(--mono);color:var(--org-text)}
.cmp tbody th a{text-decoration:none}.cmp tbody th a:hover code{text-decoration:underline}
.cmp tbody th span{font-size:15px;color:var(--ink-2)}
.cmp .yes{color:var(--org-text);display:inline-flex}.cmp .no{color:var(--muted-2)}
.cmp tfoot th,.cmp tfoot td{font-weight:600;border-bottom:0}
.cmp tbody tr:nth-child(8) th,.cmp tbody tr:nth-child(8) td{border-bottom:1.5px solid var(--rule-2)}

/* faq */
.faq-groups{display:flex;flex-direction:column;gap:40px}
.faq-group__t{margin:0 0 8px;font:500 13px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--org-text)}

/* démo */
.demo-top{position:relative;overflow:hidden;padding-bottom:72px}
.demo-hero{display:flex;flex-direction:column;gap:32px;padding-top:32px}
.player{position:relative;max-width:1100px;width:100%}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.player.is-playing{aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:#000;border:1px solid var(--ink)}
.demo-links{gap:8px 24px}
.demo-links .link{color:var(--ink)}
.rail--links a{display:flex;flex-direction:column;align-items:inherit;gap:12px;text-decoration:none;color:inherit}
.rail--links li{cursor:pointer}
.rail--links a:hover span{color:var(--org-text);text-decoration:underline}
.rail li::before{flex:none}
.duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px;max-width:1000px;margin:0 auto}

/* échantillon */
.hero--sample{padding-top:56px}
.hero__price{font-size:15px;color:var(--ink)}.hero__price b{font:400 28px var(--serif)}
.sample-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.sample-list li{display:flex;gap:12px;font-size:16px;color:#E7E9EE}.sample-list .ico{color:var(--org);flex:none;margin-top:3px}
.example{margin-top:40px;background:var(--cream);border:1px solid var(--rule);border-radius:16px;padding:28px 32px;font-size:16px;line-height:1.7;color:var(--ink-2);max-width:860px}

/* pied de page */
.ftr__cols{display:flex;flex-wrap:wrap;gap:24px 64px}
.ftr__cols nav{display:flex;flex-direction:column;gap:8px}
.ftr__h{margin:0 0 4px;font-weight:600;color:var(--ink);font-size:14px}
.ftr__top{align-items:flex-start}

@media (max-width:720px){
  .rail--links{display:grid}
  .cmp th,.cmp td{padding:12px 8px}
  .cmp thead th{font-size:11.5px}
  .cmp tbody th code{font-size:12px;overflow-wrap:anywhere}
  .dl>div:target{margin:0;padding-left:8px;padding-right:8px}
}