:root{
  --red:#D42F34; --red-dark:#B02226; --ink:#1A1A1A; --navy:#0F043C;
  --bg:#FBFAF8; --card:#FFFFFF; --muted:#5F5F5F; --line:#E4E1DB; --soft:#F2F0EC;
  --font:"Figtree","Century Gothic","Questrial",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url("/%23n")'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.mono{font-family:var(--mono);font-size:.8125rem;letter-spacing:.02em;color:var(--muted)}
.eyebrow{display:inline-flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:32px;height:1px;background:currentColor;opacity:.5}
em{font-style:normal;color:var(--red)}
h1,h2,h3{font-weight:700;letter-spacing:-.03em;line-height:1}

/* nav */
nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
nav.scrolled{background:rgba(251,250,248,.88);backdrop-filter:blur(12px);border-color:var(--line)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:1.125rem}
.brand img{width:34px;height:34px}
.links{display:flex;gap:32px;font-size:.9rem;color:var(--muted)}
.links a:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 24px;border-radius:4px;font-weight:600;font-size:.95rem;border:1px solid var(--ink);transition:transform .4s var(--ease),background .2s,color .2s}
.btn:hover{transform:translateY(-3px)}
.btn.primary{background:var(--red);border-color:var(--red);color:#fff}
.btn.primary:hover{background:var(--red-dark)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn.small{padding:10px 18px;font-size:.875rem}
.arrow{transition:transform .3s var(--ease)}
.btn:hover .arrow{transform:translateX(4px)}

/* hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}
.hero canvas{position:absolute;right:-6%;top:50%;transform:translateY(-50%);width:min(820px,95vw);height:min(820px,95vw);opacity:.55;pointer-events:none}
.grid-lines{position:absolute;inset:0;pointer-events:none;opacity:.5}
.grid-lines i{position:absolute;background:var(--ink);opacity:.07}
.grid-lines i.h{height:1px;left:0;right:0}
.grid-lines i.v{width:1px;top:0;bottom:0}
.hero .wrap{position:relative;z-index:2;padding-top:140px;padding-bottom:100px}
.hero h1{font-size:clamp(3rem,10.5vw,9rem);line-height:.92;margin:28px 0 48px}
.hero h1 span.line{display:block}
.rot{position:relative;display:inline-block;color:var(--red)}
.rot::after{content:"";position:absolute;left:0;right:0;bottom:-.04em;height:.12em;background:var(--red);opacity:.15}
.rot .ch{display:inline-block;animation:chin .6s var(--ease) both}
@keyframes chin{from{opacity:0;transform:translateY(.4em) rotateX(60deg)}to{opacity:1;transform:none}}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,96px);align-items:end}
.hero p.lead{font-size:clamp(1.1rem,2vw,1.5rem);color:var(--muted);max-width:34em}
.cta-row{display:flex;flex-wrap:wrap;gap:16px}

/* reveal */
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}

/* stats strip */
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--card)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:40px 28px;border-left:1px solid var(--line)}
.stat:first-child{border-left:0;padding-left:0}
.stat b{display:block;font-size:clamp(2rem,4vw,3.25rem);letter-spacing:-.04em;line-height:1;margin-bottom:10px}
.stat span{color:var(--muted);font-size:.9rem}

/* marquee */
.marq{overflow:hidden;border-bottom:1px solid var(--line);padding:22px 0;white-space:nowrap}
.marq div{display:inline-block;animation:marq 38s linear infinite}
.marq span{font-size:clamp(1.5rem,3vw,2.5rem);font-weight:700;letter-spacing:-.02em;margin:0 28px;color:var(--ink)}
.marq span.f{color:var(--red)}
.marq span.dot{margin:0;color:var(--red);-webkit-text-stroke:0}
@keyframes marq{to{transform:translateX(-50%)}}

/* sections */
section{position:relative}
.sec{padding:clamp(72px,12vw,160px) 0}
.sec-head{display:grid;grid-template-columns:1fr 2fr;gap:clamp(24px,6vw,96px);margin-bottom:clamp(40px,7vw,88px)}
.sec-head h2{font-size:clamp(2.2rem,5.5vw,4.75rem)}
.sec-head p{color:var(--muted);font-size:1.15rem;max-width:36em;margin-top:24px}
.num{font-family:var(--mono);color:var(--red);font-size:.85rem}
.cards{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);background:var(--card)}
.card{padding:clamp(24px,3vw,40px);border-left:1px solid var(--line);transition:background .3s}
.card:first-child{border-left:0}
.card:hover{background:var(--soft)}
.card .num{display:block;margin-bottom:56px}
.card h3{font-size:1.6rem;margin-bottom:14px;letter-spacing:-.02em;line-height:1.1}
.card p{color:var(--muted)}

/* cycles */
.cycles{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cycle{padding:clamp(24px,3vw,40px);border:1px solid var(--line);background:var(--card)}
.cycle.after{background:var(--ink);color:#fff;border-color:var(--ink)}
.cycle h3{font-size:1.1rem;margin-bottom:28px;display:flex;justify-content:space-between;align-items:baseline}
.cycle h3 small{font-family:var(--mono);font-weight:400;font-size:.8rem;opacity:.6}
.steps{list-style:none;display:flex;flex-direction:column}
.steps li{display:flex;align-items:center;gap:16px;padding:14px 0;border-top:1px solid var(--line);font-size:1.05rem}
.after .steps li{border-color:rgba(255,255,255,.16)}
.steps li:first-child{border-top:0}
.steps li i{font-style:normal;font-family:var(--mono);font-size:.75rem;opacity:.5;width:24px}
.steps li.bad{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(212,47,52,.6)}
.steps li.good i{color:var(--red);opacity:1}
.verdict{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);font-weight:700;font-size:1.25rem}
.after .verdict{border-color:rgba(255,255,255,.16)}
.after .verdict em{color:#FF6B70}

/* demo (navy) */
.dark{background:var(--navy);color:#fff}
.dark .mono,.dark .sec-head p{color:rgba(255,255,255,.65)}
.dark .num{color:#FF6B70}
.dark em{color:#FF6B70}
.demo-big{display:flex;align-items:center;gap:clamp(16px,4vw,64px);flex-wrap:wrap;margin-bottom:56px}
.demo-big div b{display:block;font-size:clamp(4rem,14vw,12rem);letter-spacing:-.06em;line-height:.85}
.demo-big div span{display:block;margin-top:12px;font-family:var(--mono);font-size:.85rem;color:rgba(255,255,255,.6)}
.demo-big svg{flex:0 0 auto;width:clamp(48px,8vw,120px);color:var(--red)}
.demo-big .arrow-line path{stroke-dasharray:200;stroke-dashoffset:200;transition:stroke-dashoffset 1.4s var(--ease) .3s}
.demo-big.in .arrow-line path{stroke-dashoffset:0}
.demo-note{border-top:1px solid rgba(255,255,255,.16);padding-top:24px;max-width:46em;color:rgba(255,255,255,.7);font-size:1.05rem}

/* benefits */
.ben{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,64px)}
.ben h3{font-size:2rem;margin:20px 0 14px;letter-spacing:-.03em}
.ben p{color:var(--muted)}
.ben .bar{height:3px;background:var(--line);position:relative;overflow:hidden}
.ben .bar::after{content:"";position:absolute;inset:0;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease) .2s}
.ben .rv.in .bar::after{transform:scaleX(1)}

/* use cases */
.uses{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);background:var(--card)}
.use{padding:32px;border-top:1px solid var(--line);border-left:1px solid var(--line);min-height:170px;display:flex;flex-direction:column;justify-content:space-between;transition:background .3s,color .3s}
.use:nth-child(-n+3){border-top:0}
.use:nth-child(3n+1){border-left:0}
.use:hover{background:var(--red);color:#fff}
.use:hover .num{color:#fff}
.use h3{font-size:1.35rem;letter-spacing:-.02em;line-height:1.15}

/* table */
.tablewrap{overflow-x:auto;border:1px solid var(--line);background:var(--card)}
table{width:100%;border-collapse:collapse;min-width:680px}
th,td{text-align:left;padding:22px 28px;border-top:1px solid var(--line);font-size:1rem}
thead th{border-top:0;font-family:var(--mono);font-weight:400;font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
thead th.at{color:var(--red)}
td.at,th.at{background:rgba(212,47,52,.05)}
td.at{font-weight:700}
td.no{color:var(--muted)}
.limits{margin-top:28px;display:flex;gap:16px;align-items:baseline;flex-wrap:wrap;color:var(--muted)}
.limits b{color:var(--ink)}

/* governance */
.gov-stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(255,255,255,.16);margin-bottom:56px}
.gov-stats div{padding:32px 28px;border-left:1px solid rgba(255,255,255,.16)}
.gov-stats div:first-child{border-left:0}
.gov-stats b{display:block;font-size:clamp(2rem,4vw,3.5rem);letter-spacing:-.04em;line-height:1}
.gov-stats span{display:block;margin-top:10px;color:rgba(255,255,255,.65);font-size:.9rem}
.gov-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,96px)}
.gov-cols h3{font-size:1.4rem;margin-bottom:20px;letter-spacing:-.02em}
.gov-cols ul{list-style:none}
.gov-cols li{padding:14px 0;border-top:1px solid rgba(255,255,255,.16);display:flex;gap:14px;color:rgba(255,255,255,.85)}
.gov-cols li::before{content:"";flex:0 0 8px;height:8px;margin-top:9px;background:var(--red);border-radius:50%}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{padding:10px 16px;border:1px solid rgba(255,255,255,.28);border-radius:999px;font-size:.9rem;transition:background .2s,color .2s}
.chip:hover{background:#fff;color:var(--navy)}

/* proofs */
.proof-top{display:flex;align-items:flex-end;gap:clamp(24px,5vw,80px);flex-wrap:wrap;margin-bottom:56px}
.proof-top b{font-size:clamp(5rem,16vw,13rem);letter-spacing:-.06em;line-height:.8;color:var(--red)}
.proof-top p{max-width:28em;font-size:1.25rem;color:var(--muted)}
.proofs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:var(--card)}
.proof{padding:28px;border-top:1px solid var(--line);border-left:1px solid var(--line);min-height:150px;display:flex;flex-direction:column;justify-content:space-between}
.proof:nth-child(-n+4){border-top:0}
.proof:nth-child(4n+1){border-left:0}
.proof small{font-family:var(--mono);color:var(--red);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em}
.proof h3{font-size:1.15rem;letter-spacing:-.02em;line-height:1.2;margin-top:24px}

/* mise en place */
.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:0;position:relative}
.tl{padding:0 clamp(16px,3vw,40px) 0 0}
.tl .dotline{display:flex;align-items:center;margin-bottom:28px}
.tl .dotline span{flex:0 0 44px;height:44px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-family:var(--mono);font-size:.9rem}
.tl .dotline hr{flex:1;border:0;height:1px;background:var(--line);margin-left:16px}
.tl:last-child .dotline hr{display:none}
.tl h3{font-size:1.7rem;margin-bottom:12px;letter-spacing:-.02em}
.tl p{color:var(--muted)}
.tl-note{margin-top:56px;padding:24px 28px;border:1px solid var(--line);background:var(--card);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}

/* cta */
.cta{background:var(--red);color:#fff;text-align:center;padding:clamp(80px,13vw,180px) 0;overflow:hidden}
.cta h2{font-size:clamp(2.6rem,8vw,7rem);margin:24px auto 40px;max-width:11em}
.cta .eyebrow{color:rgba(255,255,255,.8)}
.cta .cta-row{justify-content:center}
.cta .btn{border-color:#fff}
.cta .btn.white{background:#fff;color:var(--red)}
.cta .btn.white:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.cta .btn.ghost:hover{background:#fff;color:var(--red)}
footer{padding:48px 0;background:var(--ink);color:rgba(255,255,255,.7);font-size:.9rem}
footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}
footer .brand{color:#fff}
.atlas-note{font-family:var(--mono);font-size:.78rem}


/* ===== interactions ===== */
#prog{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--red);transform-origin:left;transform:scaleX(0);z-index:60}
#glow{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(212,47,52,.10),transparent 65%);transition:opacity .4s;opacity:0}
@media(hover:none){#glow{display:none}}
#dots{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:14px}
#dots a{position:relative;width:10px;height:10px;border-radius:50%;border:1px solid #8a8a8a;background:transparent;transition:.3s}
#dots a.on{background:var(--red);border-color:var(--red);transform:scale(1.5)}
#dots a span{position:absolute;right:20px;top:50%;transform:translateY(-50%);white-space:nowrap;font-family:var(--mono);font-size:.75rem;background:var(--ink);color:#fff;padding:4px 8px;border-radius:3px;opacity:0;pointer-events:none;transition:opacity .2s}
#dots a:hover span{opacity:1}
@media(max-width:1100px){#dots{display:none}}
.btn{transform:translate(var(--tx,0px),var(--ty,0px))}
.btn:hover{transform:translate(var(--tx,0px),calc(var(--ty,0px) - 3px))}
.card,.use,.proof,.stat{transition:opacity .8s var(--ease),transform .8s var(--ease),background .3s,color .3s}
.card,.use,.proof{position:relative;overflow:hidden}
.card::after,.proof::after,.use::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(212,47,52,.12),transparent 60%)}
.use::after{background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.28),transparent 60%)}
.card:hover::after,.proof:hover::after,.use:hover::after{opacity:1}
.rot{cursor:pointer}
.cnt{font:inherit!important;color:inherit!important;display:inline!important;margin:0!important;letter-spacing:inherit!important}

/* cycles */
.cyc-ctl{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.track{height:4px;background:var(--line);margin:0 0 24px;position:relative;overflow:hidden}
.after .track{background:rgba(255,255,255,.16)}
.track i{position:absolute;inset:0;background:var(--red);transform:scaleX(0);transform-origin:left}
.cycle:not(.after) .track i{background:#8a8a8a}
.js .steps li{opacity:.3;transition:opacity .3s,transform .4s var(--ease)}
.js .steps li.on{opacity:1;transform:translateX(8px)}
.js .steps li.on i{color:var(--red);opacity:1}
.js .verdict{opacity:.2;transition:opacity .5s}
.js .cycle.done .verdict{opacity:1}

/* comparateur pdf -> page */
.cmp{margin-bottom:40px}
.stage{position:relative;aspect-ratio:16/9;max-width:980px;background:#fff;border-radius:6px;overflow:hidden;cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;box-shadow:0 30px 80px rgba(0,0,0,.4);color:var(--ink)}
.layer{position:absolute;inset:0;padding:clamp(14px,3vw,36px)}
.pdf{background:#f1f0ed;font-family:Georgia,serif}
.pdf .hd{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.7rem;color:#888;margin-bottom:14px}
.pdf h4{font-size:clamp(1rem,2.4vw,1.8rem);margin-bottom:10px;font-weight:700;color:#333;letter-spacing:0}
.pdf .ln{height:7px;background:#d7d5d0;border-radius:2px;margin:9px 0}
.pdf .tbl{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:16px}
.pdf .tbl i{height:22px;background:#e2e0db}
.pdf .pg{position:absolute;right:16px;bottom:10px;font-family:var(--mono);font-size:.7rem;color:#999}
.web{background:#fff;clip-path:inset(0 100% 0 0);font-family:var(--font)}
.web .wn{display:flex;align-items:center;gap:8px;margin-bottom:clamp(10px,2.5vw,26px);font-weight:700;font-size:clamp(.7rem,1.4vw,.95rem)}
.web .wn img{width:clamp(16px,2.4vw,26px);height:auto}
.web h4{font-size:clamp(1.2rem,3.6vw,3rem);letter-spacing:-.04em;line-height:.95;margin-bottom:clamp(8px,2vw,18px)}
.web .wb{display:inline-block;background:var(--red);color:#fff;padding:.5em 1em;border-radius:3px;font-size:clamp(.6rem,1.2vw,.85rem);font-weight:600}
.web .wc{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:clamp(10px,2.5vw,26px)}
.web .wc div{border:1px solid var(--line);padding:clamp(6px,1.4vw,14px);font-size:clamp(.55rem,1.1vw,.8rem);color:var(--muted)}
.web .wc b{display:block;color:var(--ink);font-size:clamp(.9rem,2.2vw,1.8rem);letter-spacing:-.04em}
.tag-il{position:absolute;left:12px;bottom:10px;font-family:var(--mono);font-size:.68rem;color:#888}
.handle{position:absolute;top:0;bottom:0;left:0;width:2px;background:var(--red);transform:translateX(-1px)}
.handle span{position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-size:1rem;box-shadow:0 4px 16px rgba(0,0,0,.3)}
.cmp-ctl{max-width:980px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:20px}
.cmp-ctl input[type=range]{flex:1;min-width:160px;accent-color:var(--red)}
.readout{font-family:var(--mono);font-size:.85rem;color:rgba(255,255,255,.7)}
.readout b{color:#fff;font-size:1.5rem;font-family:var(--font);letter-spacing:-.03em}

/* simulateur */
.sim{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);border:1px solid var(--line);background:var(--card);padding:clamp(24px,4vw,48px);margin-top:clamp(40px,6vw,72px)}
.sim h3{font-size:1.6rem;margin-bottom:24px;letter-spacing:-.02em}
.sim label{display:flex;justify-content:space-between;font-weight:600;margin-bottom:10px}
.sim label output{font-family:var(--mono);color:var(--red)}
.sim input[type=range]{width:100%;accent-color:var(--red);margin-bottom:28px}
.sim .out .mono{display:block;margin-bottom:8px}
.sim .out b{display:block;font-size:clamp(3.5rem,9vw,7rem);letter-spacing:-.05em;line-height:.9;color:var(--red)}
.sim .bars{margin-top:24px}
.sim .bars div{height:10px;background:var(--line);margin:6px 0 16px;position:relative}
.sim .bars i{position:absolute;left:0;top:0;bottom:0;background:var(--ink);transition:width .5s var(--ease)}
.sim .bars i.r{background:var(--red)}
.sim small{display:block;margin-top:8px;color:var(--muted);font-size:.8rem}

/* panneau gouvernance */
.panel{display:grid;grid-template-columns:340px 1fr;margin-top:56px;border:1px solid rgba(255,255,255,.16)}
.pc{padding:28px;border-right:1px solid rgba(255,255,255,.16);display:flex;flex-direction:column;gap:26px}
.panel h4{font-family:var(--mono);font-size:.75rem;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:10px}
.seg{display:flex;border:1px solid rgba(255,255,255,.28);border-radius:4px;overflow:hidden}
.seg button{flex:1;padding:10px 6px;background:transparent;color:#fff;border:0;font:inherit;font-size:.85rem;cursor:pointer;transition:background .2s,color .2s}
.seg button+button{border-left:1px solid rgba(255,255,255,.28)}
.seg button.on{background:#fff;color:var(--navy);font-weight:600}
.sw{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:.95rem}
.sw input{display:none}
.sw i{width:44px;height:24px;border-radius:12px;background:rgba(255,255,255,.25);position:relative;transition:background .2s;flex:0 0 auto}
.sw i::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .25s var(--ease)}
.sw input:checked+i{background:var(--red)}
.sw input:checked+i::after{transform:translateX(20px)}
.pv{padding:28px;min-width:0}
.browser{background:#fff;color:var(--ink);border-radius:6px;overflow:hidden}
.bar-url{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#eceae6;font-family:var(--mono);font-size:.75rem;color:#555}
.bar-url .lk{margin-left:auto;padding:2px 10px;border-radius:10px;background:#d7f3e5;color:#0a6b3c;font-size:.7rem;transition:background .3s,color .3s}
.bar-url .lk.lock{background:#ffe3e3;color:#a11}
.bpage{padding:clamp(20px,4vw,40px);transition:all .4s var(--ease)}
.bpage h5{font-size:clamp(1.4rem,3vw,2.4rem);letter-spacing:-.03em;margin-bottom:10px;line-height:1}
.bpage p{color:#666;margin-bottom:18px;max-width:30em}
.bpage .bt{display:inline-block;padding:10px 18px;color:#fff;border-radius:3px;font-size:.9rem;font-weight:600;background:var(--red);transition:all .4s var(--ease)}
.bpage .gate{display:none;margin-top:18px;padding:14px;border:1px dashed #c33;color:#a11;font-size:.85rem;border-radius:4px}
.bpage.locked .gate{display:block}
.bpage.off{font-family:"Times New Roman",serif;background:#fffbe6}
.bpage.off h5{color:#2a7;letter-spacing:0;font-style:italic}
.bpage.off .bt{background:#2b6cb0;border-radius:20px}
.log{list-style:none;font-family:var(--mono);font-size:.76rem;color:rgba(255,255,255,.78)}
.log li{padding:8px 0;border-top:1px solid rgba(255,255,255,.12);animation:login .5s var(--ease)}
@keyframes login{from{opacity:0;transform:translateY(-8px)}}

/* filtres preuves */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.fchip{padding:9px 16px;border:1px solid var(--line);border-radius:999px;background:var(--card);font:inherit;font-size:.9rem;cursor:pointer;transition:.2s}
.fchip:hover{border-color:var(--ink)}
.fchip.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.proof{transition:opacity .4s,transform .8s var(--ease),background .3s}
.proof.dim{opacity:.16}
.use{cursor:pointer}
.use .more{display:block;margin-top:10px;font-size:.85rem;opacity:0;transform:translateY(6px);transition:.3s}
.use:hover .more,.use:focus-visible .more{opacity:1;transform:none}

/* faq */
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;padding:26px 0;font-size:clamp(1.1rem,2vw,1.4rem);font-weight:700;letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;font-size:1.8rem;line-height:1;color:var(--red);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 26px;color:var(--muted);max-width:44em;animation:login .5s var(--ease)}
@media(max-width:960px){.sim,.panel{grid-template-columns:1fr}.pc{border-right:0;border-bottom:1px solid rgba(255,255,255,.16)}}


/* ===== hero narratif ===== */
.hero .wrap.hero-in{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(24px,4vw,64px);align-items:center}
.hero h1{font-size:clamp(2.8rem,6.6vw,6rem);margin:24px 0 32px}
.hero-grid{grid-template-columns:1fr;gap:28px}
.hero p.lead{max-width:30em}
.hero-right{min-width:0}
.story{position:relative;aspect-ratio:1.1;width:100%;max-width:600px;margin-left:auto}
.doc{position:absolute;left:0;width:20%;aspect-ratio:.85;background:#fff;border:1px solid var(--line);border-radius:4px;padding:5%;box-shadow:0 10px 30px rgba(0,0,0,.08);display:flex;flex-direction:column;gap:9%;transition:transform 1s var(--ease),opacity .7s}
.doc b{font:700 clamp(.5rem,1vw,.72rem)/1.1 var(--font);color:var(--red)}
.doc i{display:block;height:4px;background:var(--line);border-radius:2px}
.doc i:nth-child(3){width:70%}.doc i:nth-child(4){width:85%}.doc i:nth-child(5){width:55%}
.d-a{top:0;transform:rotate(-4deg)}.d-b{top:33%;transform:rotate(3deg)}.d-c{top:66%;transform:rotate(-2deg)}
.s1 .d-a{transform:translate(180%,130%) scale(.12);opacity:0}
.s1 .d-b{transform:translate(180%,11%) scale(.12);opacity:0;transition-delay:.18s}
.s1 .d-c{transform:translate(180%,-108%) scale(.12);opacity:0;transition-delay:.36s}
.core{position:absolute;left:36%;top:50%;width:20%;aspect-ratio:1;transform:translateY(-50%);display:grid;place-items:center}
.core img{width:100%;position:relative;z-index:2;transition:transform .5s var(--ease)}
.s1 .core img{transform:scale(1.12)}
.core .ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--red);opacity:0}
.s1 .core .ring{animation:ring 1.8s ease-out infinite}
.s1 .core .r2{animation-delay:.9s}
@keyframes ring{from{transform:scale(1);opacity:.7}to{transform:scale(2.4);opacity:0}}
.core em{position:absolute;bottom:-28px;font:normal 700 .85rem var(--font)}
.link{position:absolute;left:56%;top:50%;width:8%;height:2px;margin-top:-1px;background:repeating-linear-gradient(90deg,var(--red) 0 6px,transparent 6px 12px);background-size:12px 2px;opacity:.15;transition:opacity .4s}
.s1 .link{opacity:1;animation:flow .5s linear infinite}
@keyframes flow{to{background-position:12px 0}}
.page{position:absolute;left:64%;top:5%;width:36%;height:90%;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 20px 50px rgba(0,0,0,.12);overflow:hidden;display:flex;flex-direction:column}
.pb-url{display:flex;align-items:center;gap:6px;padding:7px 8px;background:#eceae6;font:.55rem var(--mono);min-height:26px;color:#555;white-space:nowrap;overflow:hidden}
.pb-url .lk{margin-left:auto;background:#d7f3e5;color:#0a6b3c;border-radius:8px;padding:1px 6px;opacity:0;transition:opacity .4s;font-size:.5rem}
.s3 .pb-url .lk{opacity:1}
.pb-body{padding:9%;display:flex;flex-direction:column;gap:7%;flex:1;min-height:0}
.pb-body>*{opacity:.15;transform:translateY(10px);transition:opacity .6s,transform .7s var(--ease),background .4s}
.pb-body>:nth-child(2){transition-delay:.12s}.pb-body>:nth-child(3){transition-delay:.24s}.pb-body>:nth-child(4){transition-delay:.36s}.pb-body>:nth-child(5){transition-delay:.48s}
.pb-h{height:12px;background:var(--ink);width:85%;border-radius:2px}
.pb-h2{height:12px;background:var(--ink);width:55%;border-radius:2px}
.pb-btn{height:16px;width:44%;background:var(--line);border-radius:3px}
.pb-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;height:16%}
.pb-cards i{border:1px solid var(--line);border-radius:2px}
.pb-chart{display:flex;align-items:flex-end;gap:4px;flex:1;min-height:0}
.pb-chart i{flex:1;height:100%;background:var(--line);transform:scaleY(.08);transform-origin:bottom;transition:transform .9s var(--ease),background .4s}
.s2 .pb-body>*{opacity:1;transform:none}
.s2 .pb-btn{background:var(--red)}
.s4 .pb-chart i{transform:scaleY(var(--h));background:var(--red)}
.badge{position:absolute;left:2%;padding:5px 11px;border-radius:999px;font:600 clamp(.6rem,1.1vw,.75rem) var(--font);background:var(--ink);color:#fff;opacity:0;transform:translateY(10px) scale(.92);transition:opacity .5s,transform .6s var(--ease);white-space:nowrap;z-index:3}
.b1{top:70%}.b2{top:80%;background:var(--red)}.b3{top:90%}
.s2 .b1,.s3 .b2,.s4 .b3{opacity:1;transform:none}
.steps5{list-style:none;display:flex;margin:18px 0 0 auto;max-width:600px;counter-reset:st}
.steps5 li{flex:1;position:relative;padding-top:14px;font:600 .78rem var(--font);color:var(--muted);transition:color .3s;counter-increment:st}
.steps5 li::before{content:"";position:absolute;top:0;left:0;right:6px;height:3px;background:var(--line);transition:background .4s}
.steps5 li.done::before{background:#c9a3a4}
.steps5 li.on{color:var(--ink)}
.steps5 li.on::before{background:var(--red)}
@media(max-width:960px){
  .hero .wrap.hero-in{grid-template-columns:1fr}
  .story,.steps5{margin-left:0;margin-right:auto}
}


/* ===== conversion narrative ===== */
.st2{container-type:inline-size;position:relative;aspect-ratio:16/9;max-width:980px;background:#f7f6f3;border-radius:6px;overflow:hidden;cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;box-shadow:0 30px 80px rgba(0,0,0,.4);color:var(--ink)}
.st2 .zl{z-index:1;position:absolute;left:0;top:0;bottom:0;width:30%;border-right:1px solid var(--line);background:#efede8}
.st2 .zm{z-index:2;position:absolute;left:30%;top:0;bottom:0;width:20%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5cqw;padding:0 1cqw}
.st2 .zr{position:absolute;left:50%;top:0;bottom:0;right:0;padding:4cqw 3cqw 3cqw}
.st2 .zt{position:absolute;left:1.6cqw;top:1.4cqw;font:.9cqw/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:#8a8a8a}
.stack{position:absolute;left:10%;top:16%;width:76%;height:68%}
.sheet{position:absolute;inset:0;background:#fff;border:1px solid #ddd;border-radius:3px;padding:7% 8%;display:flex;flex-direction:column;gap:6%;box-shadow:0 6px 18px rgba(0,0,0,.08);will-change:transform}
.sheet:nth-child(1){transform:translate(0,0) rotate(-1deg)}
.sheet b{font:700 1.5cqw/1.1 Georgia,serif;color:#333}
.sheet i{display:block;height:.6cqw;background:#dcdad5;border-radius:2px}
.sheet i:nth-child(3){width:80%}.sheet i:nth-child(5){width:60%}
.scan{position:absolute;left:-4%;right:-4%;height:3px;background:var(--red);box-shadow:0 0 14px 3px rgba(212,47,52,.5);opacity:0;top:0}
.pgc{position:absolute;left:0;right:0;bottom:2.4cqw;text-align:center;font:1.1cqw var(--mono);color:#666}
.atl{width:7cqw;height:7cqw;transition:transform .3s;filter:drop-shadow(0 6px 14px rgba(212,47,52,.35))}
.ext{opacity:0;transform:translateY(1cqw);width:100%}
.ext em{display:block;font:normal 600 1cqw var(--mono);color:#777;margin-bottom:.8cqw;text-transform:uppercase;letter-spacing:.04em;text-align:center}
.ext div{display:flex;justify-content:center;gap:.8cqw}
.ext i{display:block;width:2.4cqw;height:2.4cqw;border-radius:50%;background:var(--c)}
.ext ol{list-style:none;font:600 1.15cqw/1.7 var(--font);color:#444;padding-left:1.6cqw}
.ext ol li{position:relative}
.ext ol li::before{content:"";position:absolute;left:-1.3cqw;top:.65em;width:.6cqw;height:.6cqw;border-radius:50%;background:var(--red)}
.wp{position:relative;height:100%;background:#fff;border:1px solid #e1ded8;border-radius:5px;padding:0 0 2cqw;overflow:hidden;--acc:color-mix(in srgb,#0F4C81 calc(var(--c,0)*100%),#d3d3d3)}
.wp>*{opacity:.18;transition:none}
.wp-nav{display:flex;align-items:center;gap:1.2cqw;padding:1cqw 1.4cqw;background:var(--acc)}
.wp-nav b{width:1.8cqw;height:1.8cqw;border-radius:50%;background:#fff}
.wp-nav span{width:4cqw;height:.7cqw;border-radius:2px;background:rgba(255,255,255,.7)}
.wp h4{font:700 2.8cqw/1.05 var(--font);letter-spacing:-.03em;margin:2.2cqw 1.6cqw 1cqw}
.wp p{font:1.15cqw/1.4 var(--font);color:#666;margin:0 1.6cqw 1.6cqw}
.wp-btn{display:inline-block;margin:0 1.6cqw;padding:.9cqw 1.8cqw;border-radius:3px;background:var(--acc);color:#fff;font:600 1.2cqw var(--font);transition:transform .15s}
.wp-btn.press{transform:scale(.94)}
.wp-res{margin:1.4cqw 1.6cqw 0;padding:.9cqw 1.2cqw;border:1px dashed var(--acc);color:#0F4C81;border-radius:3px;font:600 1.1cqw var(--font);opacity:0;transform:translateY(.8cqw)}
.wp-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:.8cqw;margin:1.6cqw 1.6cqw 0}
.wp-kpi div{border:1px solid #e1ded8;border-radius:3px;padding:.9cqw;font:1cqw var(--font);color:#777}
.wp-kpi b{display:block;font:700 2cqw/1 var(--font);letter-spacing:-.04em;color:var(--ink)}
.st2 .tag-il{position:absolute;right:1.4cqw;bottom:1cqw;font:.85cqw var(--mono);color:#999}
.cur{position:absolute;opacity:0;pointer-events:none;z-index:5;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}
.cap{margin-top:16px;font:600 1.05rem var(--font);color:#fff;min-height:1.6em}
.cap::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);margin-right:10px;box-shadow:0 0 0 4px rgba(211,46,51,.3)}
@container (max-width:620px){
  .st2 .zm{display:none}
  .st2 .zl{width:38%}.st2 .zr{left:38%;padding:5cqw 2.5cqw 3cqw}
  .st2 .zt{font-size:1.6cqw}
  .wp h4{font-size:4.2cqw}.wp p{font-size:2.2cqw}.wp-btn{font-size:2.2cqw;padding:1.4cqw 2.6cqw}
  .wp-res{font-size:2cqw}.wp-kpi div{font-size:1.7cqw}.wp-kpi b{font-size:3.4cqw}
  .sheet b{font-size:2.8cqw}.pgc{font-size:2cqw}.wp-nav span{display:none}
}


/* ===== formulaire de contact ===== */
.cta{text-align:left}
.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.cta h2{margin:24px 0 24px;max-width:none;font-size:clamp(2.4rem,5.6vw,5rem)}
.cta-txt p{font-size:1.2rem;opacity:.9;max-width:28em}
.lead-form{background:#fff;color:var(--ink);padding:clamp(24px,3vw,40px);border-radius:6px;display:flex;flex-direction:column;gap:18px;box-shadow:0 30px 80px rgba(0,0,0,.25);position:relative}
.lead-form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:.9rem}
.lead-form .opt{font-weight:400;color:var(--muted)}
.lead-form .two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lead-form input:not([type=checkbox]),.lead-form textarea{font:inherit;font-weight:400;padding:12px 14px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--ink);transition:border-color .2s,box-shadow .2s;width:100%}
.lead-form textarea{resize:vertical}
.lead-form input:focus,.lead-form textarea:focus{outline:0;border-color:var(--red);box-shadow:0 0 0 3px rgba(212,47,52,.15)}
.lead-form input:user-invalid{border-color:var(--red)}
.lead-form .consent{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;font-size:.85rem;color:var(--muted)}
.lead-form .consent input{margin-top:3px;accent-color:var(--red);flex:0 0 auto}
.lead-form .btn{align-self:flex-start;border-color:var(--red);cursor:pointer;font-family:inherit}
.lead-form .btn[disabled]{opacity:.6;cursor:wait}
.lead-form #lead-msg{min-height:1.2em;font-size:.9rem;color:var(--red-dark)}
.lead-form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.lead-ok{text-align:center;padding:24px 0}
.lead-ok b{display:block;font-size:2rem;letter-spacing:-.03em;margin-bottom:8px}
.lead-ok span{color:var(--muted)}
@media(max-width:960px){.cta-grid{grid-template-columns:1fr}.lead-form .two{grid-template-columns:1fr}}

/* responsive */
@media(max-width:960px){
  .links{display:none}
  .hero-grid,.sec-head,.cycles,.gov-cols{grid-template-columns:1fr}
  .stats .wrap{grid-template-columns:1fr 1fr}
  .stat:nth-child(odd){border-left:0;padding-left:0}
  .stat:nth-child(n+3){border-top:1px solid var(--line)}
  .cards,.ben,.timeline{grid-template-columns:1fr}
  .card{border-left:0;border-top:1px solid var(--line)}.card:first-child{border-top:0}
  .ben{gap:48px}
  .uses{grid-template-columns:1fr 1fr}
  .use,.use:nth-child(-n+3){border-top:1px solid var(--line);border-left:1px solid var(--line)}
  .use:nth-child(-n+2){border-top:0}.use:nth-child(odd){border-left:0}
  .gov-stats{grid-template-columns:1fr 1fr}
  .gov-stats div:nth-child(odd){border-left:0}
  .gov-stats div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.16)}
  .proofs{grid-template-columns:1fr 1fr}
  .proof,.proof:nth-child(-n+4){border-top:1px solid var(--line);border-left:1px solid var(--line)}
  .proof:nth-child(-n+2){border-top:0}.proof:nth-child(odd){border-left:0}
  .tl{padding:0 0 40px}
  .tl .dotline hr{display:none}
  .hero canvas{opacity:.3;right:-30%}
}
@media(max-width:520px){
  .uses,.proofs{grid-template-columns:1fr}
  .use,.proof{border-left:0!important;border-top:1px solid var(--line)!important}
  .use:first-child,.proof:first-child{border-top:0!important}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  .ben .bar::after{transform:scaleX(1)}
  .demo-big .arrow-line path{stroke-dashoffset:0}
  html{scroll-behavior:auto}
}