:root{--svg-icon-color-1:#1966FF;--svg-icon-color-2:#4D8BFF;--svg-icon-color-3:#D5E2FF;--svg-icon-color-4:#FFFFFF;--svg-illustration-gray-w:#16181D;--svg-illustration-gray-1:#1C1F25;--svg-illustration-gray-2:#23262D;--svg-illustration-gray-3:#2C3038;--svg-illustration-gray-4:#373B45;--svg-illustration-gray-5:#434854;--svg-illustration-gray-6:#525866;--svg-illustration-gray-7:#666C7A;--svg-illustration-gray-8:#7C8392;--svg-illustration-primary-0:#0B2B6E;--svg-illustration-primary-1:#1966FF;--svg-illustration-primary-2:#3378FF;--svg-illustration-primary-3:#0B47C9;--svg-illustration-primary-4:#8FD3FF;--svg-illustration-yellow-1:#009AFF;--svg-illustration-yellow-2:#8FD3FF;--svg-illustration-yellow-3:#0070D6}
:root{color-scheme:dark;--bg:#08090B;--card:rgba(20,21,25,.62);--card2:rgba(14,15,18,.8);--l:rgba(255,255,255,.07);--l2:rgba(255,255,255,.12);--t:#F3F4F6;--d:#8D929B;--m:#5A5F68;--a:#1966FF;--a2:#4D8BFF;--a3:#8FD3FF;--ink:#04070F;--ok:#3DDC97}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--t);font:15px/1.55 Inter,system-ui,-apple-system,sans-serif;letter-spacing:-.011em;-webkit-font-smoothing:antialiased;padding-inline:16px;overflow-x:hidden}
a{color:inherit;text-decoration:none}
::selection{background:var(--a);color:#fff}
.mono{font-family:"Fragment Mono",ui-monospace,Menlo,monospace;letter-spacing:0}
.it{font-style:normal;color:var(--a2)}
#fx{position:fixed;inset:0;width:100vw;height:100vh;z-index:-1;pointer-events:none}
.dots{position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.2px);background-size:34px 34px}
.w1{max-width:1200px;margin:0 auto;position:relative}

/* boutons */
.btn{position:relative;display:inline-flex;font-family:inherit;line-height:inherit;border:0;cursor:pointer;align-items:center;gap:8px;height:38px;padding:0 18px;border-radius:6px;font-size:13.5px;font-weight:500;white-space:nowrap;transition:transform .25s,background .25s,box-shadow .25s,border-color .25s}
.btn-a{background:var(--a);color:#fff;box-shadow:0 0 0 1px rgba(143,211,255,.22) inset,0 8px 28px -10px rgba(25,102,255,.9)}
.btn-a:hover{background:#2E74FF;transform:translateY(-1px);box-shadow:0 0 0 1px rgba(143,211,255,.35) inset,0 12px 36px -10px rgba(25,102,255,1)}
.btn-g{border:1px solid var(--l2);background:rgba(255,255,255,.035);color:var(--t)}
.btn-g:hover{background:rgba(255,255,255,.07)}
.btn-g .pl{width:0;height:0;border-left:6px solid var(--t);border-top:4px solid transparent;border-bottom:4px solid transparent}
.btn-s{height:32px;padding:0 14px;font-size:12.5px}

/* animations reprises du thème RS Themes (Lagom) */
@keyframes elementLoopVertical{0%{transform:translateZ(0)}50%{transform:translate3d(0,-15px,0)}to{transform:translateZ(0)}}
@keyframes elementLoopVerticalSm{0%{transform:translateZ(0)}50%{transform:translate3d(0,-8px,0)}to{transform:translateZ(0)}}
@keyframes lagomCubeLoop{0%{transform:translate3d(0,var(--cubeStart,30px),0);opacity:0}10%,60%{opacity:1}to{transform:translate3d(0,var(--cubeGap,-20px),0);opacity:0}}
@keyframes svgIconsPackagesAnimations{0%{transform:translateY(16px);opacity:0}48%{opacity:1}to{transform:translateY(0);opacity:1}}
.ill [data-animation-vertical-loop]{animation:elementLoopVertical 3.5s ease-in-out infinite}
.ill [data-animation-vertical-loop-sm]{animation:elementLoopVerticalSm 3.5s ease-in-out infinite}
.ill [data-animation-lagom-cube]{animation:lagomCubeLoop 2.2s ease-in-out infinite}
.ill [data-animation-delay-1]{animation-delay:.8s}.ill [data-animation-delay-2]{animation-delay:.2s}.ill [data-animation-delay-4]{animation-delay:1s}.ill [data-animation-delay-5]{animation-delay:.24s}.ill [data-animation-delay-6]{animation-delay:.56s}.ill [data-animation-delay-7]{animation-delay:1s}.ill [data-animation-delay-8]{animation-delay:.72s}
.ill svg{display:block;width:100%;height:auto}
.lic{display:block;width:56px;height:56px;opacity:0}.lic svg{width:100%;height:100%}
.on .lic,.lic.on{animation:svgIconsPackagesAnimations .56s ease-in forwards,elementLoopVerticalSm 3.5s ease-in-out .6s infinite}
html.done .lic{opacity:1}

/* nav */

.sys{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 13px;border-radius:6px;border:1px solid var(--l2);background:rgba(255,255,255,.02);font-size:11.5px;color:var(--t)}
.dot{width:6px;height:6px;border-radius:50%;background:var(--a2);box-shadow:0 0 8px var(--a2)}
.sys .dot{background:var(--ok);box-shadow:0 0 8px var(--ok);animation:pu 2.4s infinite}
@keyframes pu{50%{opacity:.35}}


/* curseur */
#cur{position:fixed;left:0;top:0;width:28px;height:28px;margin:-14px 0 0 -14px;border:1px solid rgba(255,255,255,.4);border-radius:50%;pointer-events:none;z-index:90;display:none;transition:width .25s,height .25s,margin .25s,border-color .25s,background .25s}
#cur.on{width:46px;height:46px;margin:-23px 0 0 -23px;border-color:var(--a);background:rgba(25,102,255,.1)}
@media (pointer:fine){#cur{display:block}}

/* révélations */
.bl{opacity:0;filter:blur(12px);transform:translateY(14px);transition:opacity 1.1s cubic-bezier(.2,.8,.2,1),filter 1.1s cubic-bezier(.2,.8,.2,1),transform 1.1s cubic-bezier(.2,.8,.2,1)}
.bl.on{opacity:1;filter:none;transform:none}
.wd{display:inline-block;opacity:0;filter:blur(10px);transform:translateY(.18em);transition:opacity .9s cubic-bezier(.2,.8,.2,1),filter .9s,transform .9s cubic-bezier(.2,.8,.2,1)}
.on .wd,.wd.on{opacity:1;filter:none;transform:none}
html.done .bl,html.done .wd{opacity:1;filter:none;transform:none;transition:none}

/* hero */
.hero{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;min-height:min(calc(100vh - 64px),820px);padding:40px 0 90px}
.pill{display:inline-flex;align-items:center;gap:8px;height:24px;padding:0 10px;border-radius:5px;border:1px solid var(--l2);background:rgba(8,9,11,.6);font-size:11px;color:var(--t)}
.pill .dot{width:5px;height:5px}
h1{font-size:clamp(33px,4.7vw,58px);font-weight:600;line-height:1.02;letter-spacing:-.045em;margin:26px 0 22px}
h1 .it{display:block}
.lead{color:#B4B8C0;font-size:15.5px;max-width:420px;margin:0 0 30px}
.cta{display:flex;gap:10px;flex-wrap:wrap}
.fine{margin-top:18px;font-size:11.5px;color:var(--m)}
.facts{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0;margin-top:34px;border-top:1px solid var(--l);padding-top:18px}
.facts div{padding-right:26px;margin-right:26px;border-right:1px solid var(--l)}.facts div:last-child{border:0;margin:0;padding:0}
.facts b{display:block;font-size:22px;font-weight:500;letter-spacing:-.03em}
.facts span{font-size:10.5px;color:var(--d)}

/* fenêtre produit */
.stage{perspective:1600px;margin-right:calc(-1 * max(16px,(100vw - 1200px)/2))}
.win{position:relative;transform:rotateY(var(--ry,-13deg)) rotateX(var(--rx,4deg));transform-origin:left center;border:1px solid var(--l2);border-radius:8px 0 0 8px;background:linear-gradient(180deg,rgba(24,25,29,.7),rgba(12,13,16,.82));backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 50px 120px -40px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.02) inset;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.win::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(420px 260px at var(--gx,60%) var(--gy,10%),rgba(255,255,255,.06),transparent 70%)}
.wt{display:flex;align-items:center;gap:14px;padding:16px 22px;font-size:12.5px;color:var(--d)}
.wt b{color:var(--t);font-weight:500}.wt .sp{width:1px;height:14px;background:var(--l2)}
.wt .run{margin-left:auto;color:var(--a2);font-size:11.5px}
.cv{position:relative;height:250px;margin:0 22px;border-bottom:1px solid var(--l)}
.cv>svg{position:absolute;inset:0;overflow:visible}
.tb{position:absolute;left:0;top:10px;display:grid;gap:8px}
.tb i{width:22px;height:22px;border-radius:6px;border:1px solid var(--l2);background:rgba(255,255,255,.03);display:grid;place-items:center}
.tb i::before{content:"";width:6px;height:6px;border:1px solid var(--d);border-radius:2px}
.pc{position:absolute;right:0;top:6px;font-size:10.5px;color:var(--d);border:1px solid var(--l2);border-radius:5px;padding:2px 7px}
.nd{position:absolute;min-width:136px;padding:10px 13px;border-radius:5px;border:1px solid var(--l2);background:rgba(22,23,27,.95);font-size:12.5px;box-shadow:0 14px 34px -14px rgba(0,0,0,.9);transition:border-color .5s,box-shadow .5s}
.nd small{display:block;margin-top:2px;font-size:10.5px;color:var(--m)}
.nd.hot{border-color:rgba(25,102,255,.7);box-shadow:0 0 0 3px rgba(25,102,255,.14),0 14px 34px -14px rgba(0,0,0,.9)}
.lb{position:absolute;font-size:10px;color:var(--d);border:1px solid var(--l2);background:#111215;border-radius:4px;padding:1px 6px}
.wl{padding:14px 22px 18px;font-size:11.5px}
.wl .h{color:var(--m);margin-bottom:8px}
.wl .r{display:grid;grid-template-columns:12px 70px 1fr auto;gap:10px;align-items:center;padding:4px 0;color:#B4B8C0;animation:rin .6s both}
.wl .r i{width:5px;height:5px;border-radius:50%;background:var(--a2)}
.wl .r span:first-of-type{color:var(--m)}
.wl .r em{font-style:normal;color:var(--m)}
@keyframes rin{from{opacity:0;filter:blur(6px);transform:translateY(5px)}}
.dsh{stroke-dasharray:3 5;animation:dsh 1.4s linear infinite}
@keyframes dsh{to{stroke-dashoffset:-16}}
.pk{fill:#fff;filter:drop-shadow(0 0 5px #8FD3FF)}

/* rangée services */
.conn{padding:10px 0 80px}
.conn .cap{font-size:11.5px;color:var(--d);margin-bottom:22px}
.chain{display:flex;align-items:flex-start;gap:0;flex-wrap:wrap}
.lk{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:11px;color:var(--d);width:84px}
.lk b svg{width:54px;height:54px}
.lk b{width:58px;height:58px;display:grid;place-items:center;opacity:.5;filter:saturate(.3);transition:opacity .45s,filter .45s,transform .45s}
.lk.on b{opacity:1;filter:saturate(1) drop-shadow(0 6px 16px rgba(25,102,255,.55));transform:translateY(-3px)}
.lk.on{color:var(--t)}
.cn{position:relative;flex:1;min-width:30px;max-width:110px;height:1px;margin-top:29px;background-image:linear-gradient(90deg,var(--l2) 50%,transparent 50%);background-size:6px 1px}
.cn i{position:absolute;top:-2.5px;left:0;width:6px;height:6px;border-radius:50%;background:var(--a2);box-shadow:0 0 8px var(--a2);opacity:0}
.cn.go i{animation:tv .9s linear}
@keyframes tv{0%{left:0;opacity:1}100%{left:calc(100% - 6px);opacity:1}}

/* sections */
section{max-width:1200px;margin:0 auto;padding:110px 0 0}
.sh{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:end;padding-bottom:36px;border-bottom:1px solid var(--l)}
.sh.nb{border:0}
h2{font-size:clamp(30px,3.6vw,46px);font-weight:600;line-height:1.08;letter-spacing:-.04em;margin:16px 0 0;text-wrap:balance}

.sh p{margin:0;color:var(--d);font-size:13.5px}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:56px 0;border-bottom:1px solid var(--l)}
.fr.rev .tx{order:2}
.tx .num{font-size:10.5px;color:var(--m)}
.tx h3{font-size:20px;font-weight:500;letter-spacing:-.025em;margin:8px 0 8px}
.tx p{margin:0;color:var(--d);font-size:13.5px;max-width:380px}
.pn{border:1px solid var(--l);border-radius:8px;background:var(--card);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:20px;position:relative;overflow:hidden}
.pn .ph{display:flex;justify-content:space-between;font-size:11px;color:var(--d);margin-bottom:16px}
.pn .ph b{color:var(--t);font-weight:400}
.pn::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(260px 160px at var(--mx,-50%) var(--my,-50%),rgba(25,102,255,.13),transparent 70%)}

/* gantt */
.gt{display:grid;gap:12px}
.gr{display:grid;grid-template-columns:18px 150px 1fr 44px;gap:10px;align-items:center;font-size:12px;color:var(--d)}
.gr .ck{width:13px;height:13px;border-radius:50%;border:1px solid var(--l2);position:relative;transition:.3s}
.gr.ok .ck{background:var(--a);border-color:var(--a)}
.gr.ok .ck::after{content:"";position:absolute;left:3.5px;top:3px;width:4px;height:2.5px;border-left:1.4px solid #fff;border-bottom:1.4px solid #fff;transform:rotate(-45deg)}
.gr.ok{color:var(--t)}
.gr .bar{position:relative;height:8px}
.gr .bar i{position:absolute;top:0;bottom:0;left:var(--s);width:0;border-radius:3px;background:linear-gradient(90deg,var(--a),var(--a2));transition:width .6s cubic-bezier(.2,.8,.2,1)}
.gr.ok .bar i{width:var(--w)}
.gr em{font-style:normal;text-align:right;color:var(--m)}
.ax{display:flex;justify-content:space-between;margin:14px 0 0 178px;padding-top:8px;border-top:1px solid var(--l);font-size:10px;color:var(--m)}
html.done .gr .bar i{width:var(--w);transition:none}html.done .gr .ck{background:var(--a);border-color:var(--a)}

/* discussion support */
.chat{display:grid;gap:12px;min-height:190px;align-content:start}
.ms{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;opacity:0;transform:translateY(6px);filter:blur(6px);transition:.6s cubic-bezier(.2,.8,.2,1)}
.ms.on{opacity:1;transform:none;filter:none}
.ms .av{flex:none;width:26px;height:26px;border-radius:7px;background:#23252B;display:grid;place-items:center;font-size:10px;color:var(--d)}
.ms .av.u{background:var(--a);color:#fff}
.ms .av.u svg{width:16px}
.ms b{font-weight:500}.ms small{color:var(--m);margin-left:6px}
.ms p{margin:2px 0 0;color:#B4B8C0}
.ty{display:flex;gap:4px;padding:6px 0 0 36px}
.ty i{width:5px;height:5px;border-radius:50%;background:var(--d);animation:ty 1s infinite}
.ty i:nth-child(2){animation-delay:.15s}.ty i:nth-child(3){animation-delay:.3s}
@keyframes ty{50%{opacity:.25}}
html.done .ms{opacity:1;transform:none;filter:none}

/* colonnes isométriques */
.iso{display:grid;grid-template-columns:repeat(12,1fr);align-items:end;height:200px;gap:4px}
.ic{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.ic svg{width:30px;overflow:visible}
.ic svg .pr{transform:scaleY(0);transform-origin:50% 100%;transform-box:fill-box;transition:transform 1s cubic-bezier(.3,1.3,.5,1)}
.pn.on .ic svg .pr{transform:scaleY(1)}
.ic span{margin-top:10px;font-size:10.5px;color:var(--m)}
.ic.td span{color:var(--t)}
html.done .ic svg .pr{transform:none;transition:none}

.hr24{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;margin-top:10px}
.hr24 i{height:18px;border-radius:2px;background:rgba(25,102,255,.28);transform:scaleY(0);transform-origin:bottom;transition:transform .4s cubic-bezier(.3,1.4,.5,1)}
.hr24 i:last-child{background:var(--a)}
.pn.on .hr24 i{transform:none}html.done .hr24 i{transform:none;transition:none}
/* plaque */
.pw{height:260vh;position:relative;margin-top:60px}
.pp{position:sticky;top:0;height:100vh;display:grid;place-items:center;overflow:hidden}
.pl{position:relative;width:min(1200px,calc(100vw - 32px));height:min(62vh,520px);border-radius:10px;background:var(--a);overflow:hidden;box-shadow:0 40px 120px -40px rgba(25,102,255,.9)}
.pl::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(4,7,15,.35) 1.1px,transparent 1.4px);background-size:24px 24px;opacity:var(--g,1)}
.pl .ch{position:absolute;left:50%;top:var(--cy,50%);width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:10px;background:var(--ink);display:grid;place-items:center;box-shadow:0 18px 40px -14px rgba(4,7,15,.8)}
.pl .ch svg{width:38px;height:auto}
.pl .in{position:absolute;inset:0;display:grid;align-content:center;justify-items:center;text-align:center;padding:40px 8% 0;opacity:var(--io,1)}
.pl .k{font-size:11px;color:rgba(4,7,15,.6);margin-bottom:18px}
.pl .st{margin:0;font-size:clamp(28px,4vw,54px);font-weight:600;letter-spacing:-.045em;line-height:1.08;color:var(--ink);max-width:860px;min-height:2.2em}
.pl .st .it{color:#fff}
.pl .st .cr{display:inline-block;width:3px;height:.9em;background:var(--ink);vertical-align:-.1em;margin-left:3px;animation:cr 1s steps(2) infinite}
@keyframes cr{50%{opacity:0}}

/* deux cartes fiabilité */
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:36px}
.cd{border:1px solid var(--l);border-radius:8px;background:var(--card);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:24px;position:relative;overflow:hidden}
.cd::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(260px 160px at var(--mx,-50%) var(--my,-50%),rgba(25,102,255,.13),transparent 70%)}
.cd h3{font-size:19px;font-weight:500;letter-spacing:-.025em;margin:0 0 8px}
.cd>p{margin:0;color:var(--d);font-size:13.5px;max-width:420px}
.cd .cap{font-size:10.5px;color:var(--m);margin:26px 0 14px}
.hub{position:relative;height:170px}
.hub svg{position:absolute;inset:0;width:100%;height:100%}
.hub .c{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:10px;background:var(--a);display:grid;place-items:center;box-shadow:0 0 50px -6px rgba(25,102,255,.9)}
.hub .c span{width:40px;height:40px;border-radius:11px;background:var(--ink);display:grid;place-items:center}
.hub .c svg{position:static;width:26px;height:auto}
.hub .s{position:absolute;width:64px;margin-left:-32px;text-align:center;font-size:10.5px;color:var(--d)}
.hub .s b{display:grid;place-items:center;width:30px;height:30px;margin:0 auto 5px;border-radius:5px;border:1px solid var(--l2);background:#15161A;font-weight:500;font-size:9.5px;color:var(--t)}
.rw{display:grid;grid-template-columns:120px 1fr 76px;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--l);font-size:12px}
.rw small{display:block;color:var(--m);font-size:10.5px}
.tr{position:relative;height:4px;border-radius:1px;background:#202227}
.tr i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:5px;background:var(--a);transition:width 1.6s cubic-bezier(.2,.8,.2,1)}
.tr i::after{content:"";position:absolute;right:-4px;top:-3px;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 0 10px var(--a2)}
.cd.on .tr i{width:var(--w)}
.rw em{font-style:normal;text-align:right;color:var(--d)}
.cd .ft{margin-top:16px;font-size:10.5px;color:var(--m)}
html.done .tr i{width:var(--w);transition:none}

/* tableau de bord */
.dg{display:grid;grid-template-columns:2fr 1fr;gap:14px;margin-top:36px}
.dg3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}
.hm{display:grid;grid-template-columns:26px repeat(7,1fr);gap:5px 6px;font-size:10px;color:var(--m);align-items:center}
.hm i{height:9px;border-radius:2px;background:#1B1D22;transition:background .6s}
.hm i.a1{background:rgba(25,102,255,.35)}.hm i.a2{background:rgba(25,102,255,.65)}.hm i.a3{background:var(--a)}
.hm span{text-align:center}
.nx{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(25,102,255,.5);border-radius:5px;padding:2px 8px;font-size:10.5px;color:var(--a3)}
.rg{width:130px;height:130px;margin:14px auto 6px;position:relative}
.rg svg{width:100%;height:100%;transform:rotate(-90deg)}
.rg circle{fill:none;stroke-width:6}
.rg .b{stroke:#1D1F24}.rg .f{stroke:var(--a);stroke-linecap:round;stroke-dasharray:352;stroke-dashoffset:352;transition:stroke-dashoffset 2s cubic-bezier(.2,.8,.2,1)}
.cd.on .rg .f{stroke-dashoffset:1}
.rg b{position:absolute;inset:0;display:grid;place-items:center;font-size:22px;font-weight:500;letter-spacing:-.03em}
html.done .rg .f{stroke-dashoffset:1;transition:none}
.bign{font-size:40px;font-weight:500;letter-spacing:-.04em;color:var(--a2);line-height:1}
.bign small{font-size:13px;color:var(--d);letter-spacing:0;margin-left:8px;font-weight:400}
.wave{width:100%;height:70px;display:block}
.leg{display:flex;gap:14px;font-size:10.5px;color:var(--m);margin-top:8px}
.leg i{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px;vertical-align:1px}
.wk{display:flex;gap:6px;margin-top:10px}
.wk i{flex:1;height:26px;border-radius:5px;background:rgba(25,102,255,.2);border:1px solid rgba(25,102,255,.45);position:relative}
.wk i::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:3px;border-left:1.5px solid var(--a3);border-bottom:1.5px solid var(--a3);transform:translate(-50%,-70%) rotate(-45deg)}
.wk i.nw{background:var(--a);border-color:var(--a)}
.wk i.nw::after{border-color:#fff}

/* chiffres */
.sx{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:40px}
.sx .lb2{font-size:10.5px;color:var(--m)}
.sx b{display:block;font-size:clamp(38px,4vw,52px);font-weight:500;letter-spacing:-.045em;line-height:1.1;margin:6px 0 14px;font-variant-numeric:tabular-nums}
.sx b .it{color:var(--a2)}
.sx p{margin:14px 0 0;color:var(--d);font-size:13px;padding-top:14px;border-top:1px solid var(--l)}
.spk{width:100%;height:40px;display:block}
.spk path{fill:none;stroke:var(--a2);stroke-width:1.6;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 2s ease}
.sx.on .spk path{stroke-dashoffset:0}
.sg{display:flex;gap:3px;height:40px;align-items:center}
.sg i{flex:1;height:22px;border-radius:3px;background:#1D1F24;transition:background .3s}
.sg i.on{background:var(--a)}
.pb{height:40px;display:flex;align-items:center}
.pb span{flex:1;height:5px;border-radius:5px;background:#1D1F24;position:relative;overflow:hidden}
.pb span i{position:absolute;inset:0;width:0;background:var(--a);border-radius:5px;transition:width 1.8s cubic-bezier(.2,.8,.2,1)}
.sx.on .pb i{width:100%}
html.done .spk path{stroke-dashoffset:0;transition:none}html.done .pb i{width:100%}html.done .sg i{background:var(--a)}

/* offres */
.of{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:36px}
.of .cd{display:flex;flex-direction:column}
.oi{max-width:230px;margin:-4px auto 14px}
.of .nm{font-size:12.5px;color:var(--d);display:flex;justify-content:space-between;align-items:center}
.of .nm .bd{font-size:10.5px;color:#fff;background:var(--a);padding:2px 8px;border-radius:4px}
.of h4{font-size:24px;font-weight:500;letter-spacing:-.035em;margin:10px 0 4px}
.of .sb{font-size:12.5px;color:var(--m)}
.of ul{list-style:none;margin:20px 0 26px;padding:0;display:grid;gap:9px;font-size:13px;color:#B4B8C0}
.of li{display:flex;gap:10px}
.of li::before{content:"";flex:none;width:7px;height:4px;margin-top:6px;border-left:1.5px solid var(--a2);border-bottom:1.5px solid var(--a2);transform:rotate(-45deg)}
.of .btn{margin-top:auto;justify-content:center}
.of .hi{border-color:rgba(25,102,255,.45);background:linear-gradient(180deg,rgba(25,102,255,.1),rgba(20,21,25,.62) 45%)}

/* bas de page */
.end{max-width:1200px;margin:110px auto 0;display:grid;grid-template-columns:1fr 1.5fr;gap:14px}
.eb{position:relative;border:1px solid var(--l);border-radius:8px;background:var(--card2);padding:26px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:40px;min-height:300px}
.ecube{position:absolute;right:-50px;top:30px;width:230px;opacity:.85;pointer-events:none}.eb p{max-width:210px!important}
.eb p{margin:0;color:#B4B8C0;font-size:14px;max-width:260px;position:relative}
.eb .ct{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:16px;border-top:1px solid var(--l);font-size:11.5px;color:var(--m);position:relative}
.eb .ct span:last-child{color:var(--t);user-select:all}
.ea{position:relative;border-radius:8px;background:var(--a);color:var(--ink);padding:30px;overflow:hidden;box-shadow:0 40px 100px -40px rgba(25,102,255,.9)}
.ea::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(4,7,15,.28) 1.1px,transparent 1.4px);background-size:24px 24px}
.ea>*{position:relative}
.ea .k{font-size:11px;color:rgba(4,7,15,.6)}
.ea h2{color:var(--ink);font-size:clamp(28px,3.4vw,40px);margin:12px 0 10px}
.ea h2 .it{color:#fff}
.ea p{margin:0 0 26px;max-width:470px;font-size:14px;color:rgba(4,7,15,.78)}
.ea .fm{display:flex;gap:6px;padding:5px;border-radius:6px;background:rgba(255,255,255,.92);max-width:470px}
.ea input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:13.5px;padding:0 12px;color:var(--ink);outline:none}
.ea .fm button{border:0;cursor:pointer;height:34px;padding:0 16px;border-radius:4px;background:var(--ink);color:#fff;font:inherit;font-size:13px;font-weight:500}
.ea .ok{margin-top:10px;font-size:11.5px;color:rgba(4,7,15,.7)}
.lg{max-width:1200px;margin:0 auto;padding:30px 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:11px;color:var(--m)}
.lg nav2{display:flex;gap:18px}

@media (max-width:980px){.hero{grid-template-columns:1fr;min-height:auto;padding:36px 0 60px}.stage{margin-right:0}.win{--ry:0deg!important;--rx:0deg!important;border-radius:8px}.sh,.fr,.two,.dg,.dg3,.sx,.of,.end{grid-template-columns:1fr}.fr.rev .tx{order:0}.fr{gap:26px}.sh{gap:14px}.pw{height:200vh}}
@media (max-width:560px){.facts{grid-template-columns:repeat(3,1fr)}.facts div{padding-right:10px;margin-right:10px}.facts b{font-size:18px}#n1{left:-6px!important}.sys{display:none}.nd{min-width:104px;font-size:11px;padding:8px 10px}.cv{margin:0 14px}.wt,.wl{padding-inline:14px}.wl .r{grid-template-columns:10px 58px 1fr auto;gap:6px}.gr{grid-template-columns:16px 1fr 40px}.gr .bar{grid-column:2/4}.ax{display:none}.rw{grid-template-columns:96px 1fr 42px}.iso .ic svg{width:20px}.ic span{font-size:9px!important}.chain{gap:4px 0}.lk{width:52px}.cn{min-width:10px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.bl,.wd,.ms{opacity:1!important;filter:none!important;transform:none!important}#ld{display:none}}

/* ============ préchargement : le logo se construit cube par cube ============ */
#ld{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:var(--bg);transition:background .6s .15s}
#ld.go{background:transparent;pointer-events:none}
#ld.gone,html.done #ld{display:none}
.ldw{display:grid;justify-items:center;gap:22px}
.ldl{width:150px;height:150px;transition:transform .9s cubic-bezier(.75,0,.2,1),opacity .35s .65s;filter:drop-shadow(0 24px 50px rgba(25,102,255,.45))}
.ldl svg{width:100%;height:100%;overflow:visible}
.ldl .cb{opacity:0;transform:translateY(-2.2px);animation:cbIn .7s cubic-bezier(.3,1.5,.5,1) forwards}
.ldl .c2{animation-delay:.05s}.ldl .c3{animation-delay:.17s}.ldl .c4{animation-delay:.29s}
.ldl .c1{transform:translateY(1px);animation:cbUp .8s cubic-bezier(.3,1.6,.45,1) .58s forwards}
.ldl .sh{opacity:0;animation:shine .9s ease-out 1.05s forwards}
@keyframes cbIn{0%{opacity:0;transform:translateY(-2.2px)}40%{opacity:1}100%{opacity:1;transform:none}}
@keyframes cbUp{0%{opacity:0;transform:translateY(1px)}30%{opacity:1}100%{opacity:1;transform:none}}
@keyframes shine{0%{opacity:0}40%{opacity:.9}100%{opacity:0}}
.ldb{width:120px;height:2px;background:rgba(255,255,255,.08);border-radius:1px;overflow:hidden}
.ldb i{display:block;height:100%;width:0;background:var(--a)}
#ld .n{font-size:10.5px;color:var(--d);margin-top:-12px}
#ld.go .ldb,#ld.go .n{opacity:0;transition:opacity .2s}

/* ============ en-tête + méga-menu ============ */
.top{position:sticky;top:0;z-index:50;margin-inline:-16px;padding-inline:16px}
.top::before{content:"";position:absolute;inset:0;background:rgba(8,9,11,.62);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid var(--l);z-index:-1;transition:background .3s}
.top.open::before{background:rgba(8,9,11,.82)}
.nv{max-width:1200px;margin:0 auto;height:64px;display:flex;align-items:center;gap:18px}
.nv .logo svg{height:24px}
.mm{list-style:none;margin:0;padding:0;display:flex;gap:2px;flex:1}
.mt{all:unset;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 11px;border-radius:5px;font-size:13px;color:var(--d);transition:color .2s,background .2s}
.mt:hover,.mi.op .mt{color:var(--t);background:rgba(255,255,255,.05)}
.chv{width:6px;height:6px;border-right:1.3px solid currentColor;border-bottom:1.3px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .3s}
.mi.op .chv{transform:translateY(1px) rotate(-135deg)}
.mp{position:absolute;left:0;right:0;top:64px;padding:0 16px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .28s,transform .35s cubic-bezier(.2,.8,.2,1),visibility 0s .35s}
.mp::before{content:"";position:absolute;inset:0;background:rgba(10,11,14,.78);backdrop-filter:blur(28px) saturate(1.4);-webkit-backdrop-filter:blur(28px) saturate(1.4);border-bottom:1px solid var(--l);box-shadow:0 40px 80px -30px rgba(0,0,0,.9)}
.mi.op .mp{opacity:1;visibility:visible;transform:none;transition:opacity .28s,transform .35s cubic-bezier(.2,.8,.2,1)}
.mpi{position:relative;max-width:1200px;margin:0 auto;padding:26px 0 30px;display:grid;grid-template-columns:1fr 360px;gap:26px}
.mps .mpi{grid-template-columns:1fr}
.mg{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px;align-content:start}
.mps .mg{grid-template-columns:repeat(4,1fr)}
.mk{display:flex;gap:14px;align-items:flex-start;padding:12px;border-radius:6px;border:1px solid transparent;transition:background .2s,border-color .2s;opacity:0;transform:translateY(8px);filter:blur(6px)}
.mi.op .mk{opacity:1;transform:none;filter:none;transition:opacity .5s,transform .5s cubic-bezier(.2,.8,.2,1),filter .5s,background .2s,border-color .2s}
.mi.op .mk:nth-child(2){transition-delay:.04s}.mi.op .mk:nth-child(3){transition-delay:.08s}.mi.op .mk:nth-child(4){transition-delay:.12s}
.mk:hover{background:rgba(25,102,255,.08);border-color:rgba(25,102,255,.3)}
.mic{flex:none;width:44px;height:44px}.mic svg{width:100%;height:100%}
.mk b{display:block;font-size:13.5px;font-weight:500;color:var(--t)}
.mk em{font-style:normal;font-size:9.5px;font-family:"Fragment Mono",monospace;color:var(--a3);border:1px solid rgba(143,211,255,.35);border-radius:3px;padding:1px 5px;margin-left:6px;vertical-align:1px}
.mk small{display:block;font-size:12px;color:var(--d);margin-top:3px;line-height:1.45}
.mf{position:relative;display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:8px;background:var(--a);color:#fff;overflow:hidden;min-height:230px}
.mf::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(4,7,15,.3) 1.1px,transparent 1.4px);background-size:22px 22px}
.mf>*{position:relative}
.mf .k{font-size:10.5px;color:rgba(4,7,15,.65)}
.mf b{font-size:18px;font-weight:600;letter-spacing:-.03em;line-height:1.2;color:var(--ink);max-width:220px}
.mf>span:not(.k):not(.ill){font-size:12.5px;color:rgba(4,7,15,.75);max-width:210px}
.mf .ill{position:absolute;right:-30px;bottom:-24px;width:220px;--svg-illustration-gray-w:#0E2F7A;--svg-illustration-gray-1:#12378B;--svg-illustration-gray-2:#163F9C;--svg-illustration-gray-3:#1A48AD;--svg-illustration-gray-4:#0B2B6E;--svg-illustration-gray-5:#123A8F;--svg-illustration-gray-6:#1F4FB8;--svg-illustration-gray-8:#2E5FCC;--svg-illustration-primary-1:#fff;--svg-illustration-primary-2:#DCE8FF;--svg-illustration-primary-3:#AFC8FF;--svg-illustration-primary-4:#fff}
.mbk{position:fixed;inset:64px 0 0;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .3s;z-index:-2}
.top.open .mbk{opacity:1}
.nv .nr{display:flex;gap:8px;align-items:center;margin-left:auto}
.bg{all:unset;display:none;cursor:pointer;width:34px;height:34px;border:1px solid var(--l2);border-radius:5px;position:relative}
.bg i{position:absolute;left:10px;right:10px;height:1.4px;background:var(--t);transition:transform .3s,top .3s}
.bg i:first-child{top:13px}.bg i:last-child{top:19px}
.top.mob .bg i:first-child{top:16px;transform:rotate(45deg)}.top.mob .bg i:last-child{top:16px;transform:rotate(-45deg)}
@media (max-width:1380px){.nv .sys{display:none!important}}
@media (max-width:1100px){
 .nv .nr .btn-g{display:none}.bg{display:block}
 .mm{position:fixed;left:0;right:0;top:64px;bottom:0;flex-direction:column;gap:0;padding:10px 16px 40px;background:rgba(8,9,11,.96);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);overflow:auto;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.3s}
 .top.mob .mm{opacity:1;visibility:visible;transform:none}
 .mt{display:flex;justify-content:space-between;height:52px;font-size:15px;color:var(--t);border-bottom:1px solid var(--l);border-radius:0;padding:0 4px}
 .mp{position:static;padding:0;opacity:1;visibility:visible;transform:none;display:none}
 .mp::before{display:none}.mi.op .mp{display:block}
 .mpi{grid-template-columns:1fr;padding:8px 0 16px}.mg,.mps .mg{grid-template-columns:1fr}.mf{display:none}
 .mk{opacity:1;transform:none;filter:none}
}
@media (max-width:560px){.nv .nr .btn-a{display:none}}

/* ============ pied de page ============ */
.ft{max-width:1200px;margin:70px auto 0;padding:34px 0 10px;border-top:1px solid var(--l);display:grid;grid-template-columns:repeat(5,1fr);gap:24px;font-size:13px;color:var(--d)}
.ft h4{margin:0 0 12px;font-size:12px;font-weight:500;color:var(--t)}
.ft a{display:block;padding:3px 0;transition:color .2s}.ft a:hover{color:var(--t)}
.lg a:hover{color:var(--t)}
@media (max-width:760px){.ft{grid-template-columns:1fr 1fr}}

/* ============ connexion, inscription, mot de passe ============ */
.au{max-width:1200px;margin:0 auto;min-height:calc(100vh - 64px - 70px);display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:40px 0 30px;align-items:stretch}
.af{align-self:center;max-width:440px;width:100%;margin:0 auto;padding:10px 0}
.ah .it{display:inline}
.ah{font-size:clamp(30px,3.4vw,42px);font-weight:600;letter-spacing:-.04em;line-height:1.08;margin:18px 0 12px}
.ap{margin:0 0 28px;color:var(--d);font-size:14px}
.fo{display:grid;gap:16px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fl{display:grid;gap:7px;font-size:12.5px;color:#B4B8C0}
.fl>span:first-child{display:flex;justify-content:space-between;align-items:baseline}
.fl a{color:var(--a2);font-size:12px}.fl a:hover{color:var(--a3)}
.fl em{font-style:normal;color:var(--m);font-size:11px}
.fo input:not([type=checkbox]){width:100%;height:46px;padding:0 14px;border-radius:6px;border:1px solid var(--l2);background:rgba(14,15,18,.75);color:var(--t);font:inherit;font-size:14px;outline:none;transition:border-color .2s,box-shadow .2s,background .2s}
.fo select{width:100%;height:46px;padding:0 38px 0 14px;border-radius:6px;border:1px solid var(--l2);background:rgba(14,15,18,.75) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%238D929B' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 14px center;color:var(--t);font:inherit;font-size:14px;outline:none;-webkit-appearance:none;appearance:none;transition:border-color .2s,box-shadow .2s}
.fo select:focus{border-color:var(--a);box-shadow:0 0 0 3px rgba(25,102,255,.2)}
.fo select option{background:#111215;color:var(--t)}
.fo input::placeholder{color:var(--m)}
.fo input:focus{border-color:var(--a);box-shadow:0 0 0 3px rgba(25,102,255,.2);background:rgba(14,15,18,.95)}
.pwf{position:relative;display:block}
.pwf input{padding-right:46px!important}
.eye{all:unset;cursor:pointer;position:absolute;right:6px;top:6px;width:32px;height:32px;border-radius:5px;display:grid;place-items:center}
.eye::before{content:"";width:16px;height:10px;border:1.4px solid var(--d);border-radius:50%/60%}
.eye::after{content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:var(--d)}
.eye.on::before{border-color:var(--a2)}.eye.on::after{background:var(--a2)}
.eye:hover{background:rgba(255,255,255,.05)}
.mt2{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:2px}
.mt2 i{height:3px;border-radius:1px;background:#202227;transition:background .3s}
.mt2[data-s="1"] i:nth-child(-n+1){background:#E5484D}.mt2[data-s="2"] i:nth-child(-n+2){background:#F5A524}.mt2[data-s="3"] i:nth-child(-n+3){background:var(--a2)}.mt2[data-s="4"] i{background:var(--ok)}
.mh{font-size:10.5px;color:var(--m)}
.ck2{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:#B4B8C0;cursor:pointer}
.ck2 input{position:absolute;opacity:0;pointer-events:none}
.ck2 i{flex:none;width:16px;height:16px;margin-top:1px;border-radius:4px;border:1px solid var(--l2);background:rgba(14,15,18,.75);position:relative;transition:.2s}
.ck2 input:checked+i{background:var(--a);border-color:var(--a)}
.ck2 input:checked+i::after{content:"";position:absolute;left:4.5px;top:3.5px;width:5px;height:3px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(-45deg)}
.ck2 input:focus-visible+i{box-shadow:0 0 0 3px rgba(25,102,255,.3)}
.ck2 a{color:var(--a2)}
.bw{width:100%;justify-content:center;height:44px;font-size:14px}
.fmsg{margin:0;padding:12px 14px;border-radius:6px;border:1px solid rgba(25,102,255,.4);background:rgba(25,102,255,.1);font-size:11.5px;color:var(--a3)}
.or{display:flex;align-items:center;gap:12px;margin:26px 0 0;font-size:10.5px;color:var(--m)}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--l)}
.alt{margin:20px 0 0;font-size:13px;color:var(--d)}.alt a{color:var(--a2)}.alt a:hover{color:var(--a3)}
.as{position:relative;border-radius:10px;background:linear-gradient(160deg,#2A74FF 0%,#1966FF 45%,#0F52E6 100%);overflow:hidden;display:flex;min-height:600px;box-shadow:0 40px 120px -40px rgba(25,102,255,.9),0 0 0 1px rgba(143,211,255,.25) inset}
.as::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(4,7,15,.28) 1.1px,transparent 1.4px);background-size:24px 24px;mask-image:linear-gradient(180deg,#000 30%,rgba(0,0,0,.35));-webkit-mask-image:linear-gradient(180deg,#000 30%,rgba(0,0,0,.35))}
.asg{position:absolute;left:50%;top:28%;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;background:radial-gradient(circle,rgba(190,225,255,.55),rgba(143,211,255,.12) 40%,transparent 68%);filter:blur(10px);animation:asg 6s ease-in-out infinite}
@keyframes asg{50%{transform:scale(1.08);opacity:.8}}
.asi{position:relative;padding:32px 34px 30px;width:100%;display:flex;flex-direction:column}
.asv{position:relative;height:330px;margin-bottom:24px}
.asill{position:absolute;left:50%;top:10px;width:330px;margin-left:-165px;animation:elementLoopVerticalSm 5s ease-in-out infinite;filter:drop-shadow(0 30px 40px rgba(4,7,15,.35))}
.ill [data-animation-cube]{animation:lagomCubeLoop 2.2s ease-in-out infinite}
.ill [data-animation-cube-1]{--cubeStart:30px;--cubeGap:-50px;animation-delay:.2s}.ill [data-animation-cube-2]{--cubeStart:50px;--cubeGap:-20px;animation-delay:.9s}.ill [data-animation-cube-3]{--cubeStart:100px;--cubeGap:-10px;animation-delay:1.4s}
.ill [data-animation-dot]{animation:pu 1.6s ease-in-out infinite}
.fc{position:absolute;display:flex;gap:11px;align-items:center;padding:12px 14px;border-radius:8px;background:rgba(6,12,30,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border:1px solid rgba(143,211,255,.22);box-shadow:0 20px 40px -18px rgba(3,8,28,.8);color:#fff;font-size:12.5px;transition:transform .6s cubic-bezier(.2,.8,.2,1);opacity:0;animation:fcIn .8s cubic-bezier(.2,.8,.2,1) forwards}
.fc b{display:block;font-weight:500}
.fc .fs{display:block;font-size:10.5px;color:rgba(200,220,255,.7);margin-top:2px}
.fc1{left:0;top:26px;display:block;width:190px;animation-delay:.5s}
.fc1 .fh{display:flex;align-items:center;gap:7px;font-size:10.5px;color:rgba(200,220,255,.75)}
.fc1 .fh .dot{background:var(--ok);box-shadow:0 0 8px var(--ok);animation:pu 2.4s infinite}
.fc1 b{font-size:19px;letter-spacing:-.03em;margin:6px 0 8px}
.up{display:grid;grid-template-columns:repeat(20,1fr);gap:2px}
.up i{height:16px;border-radius:1px;background:var(--ok);opacity:.85}
.up i:nth-child(7){opacity:.45}
.fc2{right:0;top:170px;animation-delay:.75s}
.ck3{flex:none;width:26px;height:26px;border-radius:6px;background:var(--a);position:relative;box-shadow:0 0 0 1px rgba(143,211,255,.4) inset}
.ck3::after{content:"";position:absolute;left:8px;top:8px;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.fc3{left:18px;bottom:0;animation-delay:1s}
.av3{flex:none;width:28px;height:28px;border-radius:7px;background:var(--ink);display:grid;place-items:center}.av3 svg{width:18px;height:auto}
@keyframes fcIn{from{opacity:0;transform:translateY(12px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
html.done .fc{opacity:1}
.as .k{font-size:11px;color:rgba(4,7,15,.62)}
.as h2{color:var(--ink);font-size:clamp(26px,2.5vw,34px);margin:10px 0 0;max-width:440px}
.as h2 .it{color:#fff}
.asl{list-style:none;margin:auto 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(4,7,15,.18);padding-top:18px}
.asl li{padding-right:14px}.asl li+li{padding-left:14px;border-left:1px solid rgba(4,7,15,.18)}
.asl b{display:block;font-size:22px;font-weight:600;letter-spacing:-.03em;color:#fff}
.asl span{font-size:11.5px;color:rgba(4,7,15,.75)}
/* bouton principal des formulaires */
.bw{position:relative;width:100%;justify-content:center;height:48px;font-size:14.5px;font-weight:500;border-radius:7px;background:linear-gradient(180deg,#2E78FF,#1966FF 55%,#155AE6);box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 14px 34px -12px rgba(25,102,255,.95);overflow:hidden;isolation:isolate}
.bw::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-120%);transition:transform .8s;z-index:-1}
.bw:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 0 0 1px rgba(143,211,255,.4),0 18px 44px -12px rgba(25,102,255,1)}
.bw:hover::after{transform:translateX(120%)}
.bw:active{transform:translateY(0) scale(.99)}
.bw .ar{display:grid;place-items:center;width:24px;height:24px;border-radius:5px;background:rgba(255,255,255,.16);margin-left:4px;transition:transform .3s}
.bw:hover .ar{transform:translateX(3px)}
.bw.ld{pointer-events:none}.bw.ld .bt,.bw.ld .ar{opacity:0}
.bw.ld::before{content:"";position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spn .7s linear infinite}
@keyframes spn{to{transform:rotate(360deg)}}
.ssl{display:flex;align-items:center;justify-content:center;gap:7px;margin:4px 0 0;font-size:10.5px;color:var(--m)}
.ssl i{width:9px;height:7px;border:1.3px solid var(--m);border-radius:2px;position:relative;margin-top:3px}
.ssl i::before{content:"";position:absolute;left:1px;top:-5px;width:4px;height:4px;border:1.3px solid var(--m);border-bottom:0;border-radius:3px 3px 0 0}
@media (max-width:900px){.au{grid-template-columns:1fr}.as{min-height:0}.asv{height:300px}}
@media (max-width:560px){.f2{grid-template-columns:1fr}.fc3{display:none}.fc2{top:auto;bottom:10px;right:0}.fc1{width:170px}.asv{height:260px}.asill{width:260px;margin-left:-130px}.asl{grid-template-columns:1fr}.asl li,.asl li+li{padding:10px 0;border-left:0;border-bottom:1px solid rgba(4,7,15,.15)}.asi{padding:24px 20px}}

/* ============ choix de la langue ============ */
.lsw{position:relative}
.lsb{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 10px;border-radius:6px;border:1px solid var(--l2);font-size:11.5px;color:var(--t)}
.lsb:hover{background:rgba(255,255,255,.05)}
.lsm{position:absolute;right:0;top:calc(100% + 8px);min-width:150px;padding:6px;border-radius:8px;background:rgba(12,13,17,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--l2);box-shadow:0 20px 50px -20px rgba(0,0,0,.9);opacity:0;visibility:hidden;transform:translateY(-4px);transition:.2s}
.lsw:hover .lsm,.lsw:focus-within .lsm,.lsw.op .lsm{opacity:1;visibility:visible;transform:none}
.lsm a{display:block;padding:8px 10px;border-radius:5px;font-size:13px;color:var(--d)}
.lsm a:hover{background:rgba(25,102,255,.1);color:var(--t)}
.lsm a[aria-current]{color:var(--t)}
.lsm a[aria-current]::after{content:"";float:right;width:6px;height:6px;margin-top:6px;border-radius:50%;background:var(--a2)}
.lgl a{text-transform:none}
.lpick{min-height:100vh;display:grid;place-content:center;gap:20px;text-align:center}
.lpick h1{font-size:28px;margin:0}.lpick nav{display:flex;gap:10px;justify-content:center}
.lpick a{padding:10px 16px;border:1px solid var(--l2);border-radius:6px}
@media (max-width:1100px){.lsw{display:none}}

/* ============ pages de service ============ */
.svc-page{padding-bottom:10px}
.sh2{padding:26px 0 70px}
.bc{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:11px;color:var(--m);margin-bottom:34px}
.bc a:hover{color:var(--t)}.bc i{font-style:normal;opacity:.5}.bc span{color:var(--d)}
.shg{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.sht .pill+.pill{margin-left:6px}
.pill.soon{border-color:rgba(143,211,255,.45);color:var(--a3)}
.sht h1{font-size:clamp(36px,4.4vw,56px);font-weight:600;line-height:1.04;letter-spacing:-.045em;margin:22px 0 18px;text-wrap:balance}
.sht h1 .it{color:var(--a2)}
.sht .lead{max-width:520px}
.facts2{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;margin-top:34px;border-top:1px solid var(--l);padding-top:18px}
.facts2 div{padding-right:24px;margin-right:24px;border-right:1px solid var(--l)}.facts2 div:last-child{border:0;margin:0;padding:0}
.facts2 b{display:block;font-size:21px;font-weight:500;letter-spacing:-.03em}
.facts2 span{font-size:10.5px;color:var(--d)}
.shv{position:relative;height:440px;border-radius:10px;background:linear-gradient(160deg,#2A74FF 0%,#1966FF 45%,#0F52E6 100%);overflow:hidden;box-shadow:0 40px 120px -40px rgba(25,102,255,.9),0 0 0 1px rgba(143,211,255,.25) inset}
.shv::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(4,7,15,.28) 1.1px,transparent 1.4px);background-size:24px 24px}
.shv .asg{top:48%}
.shi{position:absolute;left:50%;top:50%;width:min(420px,86%);transform:translate(-50%,-46%);filter:drop-shadow(0 30px 40px rgba(4,7,15,.35))}
.shi svg{animation:elementLoopVerticalSm 5s ease-in-out infinite}
.shn .big{position:absolute;left:50%;top:50%;width:170px;height:170px;margin:-85px 0 0 -85px;opacity:1;animation:elementLoopVerticalSm 5s ease-in-out infinite;--svg-icon-color-1:#fff;--svg-icon-color-2:#DCE8FF;--svg-icon-color-3:#0B2B6E;--svg-icon-color-4:#0F52E6}
.shv .fc1{left:22px;top:22px;width:auto;min-width:170px}
.shv .fc1 b{font-size:24px;margin:6px 0 2px}
.shv .fc2{right:22px;top:auto;bottom:24px}
.nf{display:flex;gap:6px;max-width:460px;padding:5px;border-radius:7px;border:1px solid var(--l2);background:rgba(14,15,18,.75)}
.nf input{flex:1;min-width:0;border:0;background:transparent;color:var(--t);font:inherit;font-size:14px;padding:0 12px;outline:none}
.nfo{margin:12px 0 0;font-size:11.5px;color:var(--a3)}
.svs{padding-top:110px}
.svs .sh{margin-bottom:34px}
.sfg{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sf h3,.ctc h3,.rl h3{font-size:16.5px;font-weight:500;letter-spacing:-.02em;margin:16px 0 6px}
.sf p,.ctc p,.rl p{margin:0;color:var(--d);font-size:13.5px}
.sf .lic,.ctc .lic,.rl .lic{width:52px;height:52px}
.cv2{display:block;margin-top:14px;font-size:12px;color:var(--a3);user-select:all}
.pcg{display:grid;grid-template-columns:repeat(var(--cols,3),1fr);gap:14px}
.pc{display:flex;flex-direction:column}
.pc .nm{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--d)}
.pc .bd{font-size:10.5px;color:#fff;background:var(--a);padding:2px 8px;border-radius:4px}
.pc .pr{display:flex;align-items:baseline;gap:6px;margin:12px 0 4px}
.pc .pr b{font-size:34px;font-weight:600;letter-spacing:-.045em}
.pc .per{font-size:12.5px;color:var(--m)}
.pn2{font-size:10.5px;color:var(--m)}
.pc ul{list-style:none;margin:18px 0 24px;padding:18px 0 0;border-top:1px solid var(--l);display:grid;gap:9px;font-size:13px;color:#B4B8C0}
.pc li,.chk li{display:flex;gap:10px}
.pc li::before,.chk li::before{content:"";flex:none;width:7px;height:4px;margin-top:6px;border-left:1.5px solid var(--a2);border-bottom:1.5px solid var(--a2);transform:rotate(-45deg)}
.pc .btn{margin-top:auto;justify-content:center}
.pc.hi{border-color:rgba(25,102,255,.45);background:linear-gradient(180deg,rgba(25,102,255,.12),rgba(20,21,25,.62) 45%)}
.stp{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,4),1fr);gap:14px;counter-reset:s;position:relative}
.stp::before{content:"";position:absolute;left:0;right:0;top:15px;height:1px;background:linear-gradient(90deg,var(--a),rgba(25,102,255,.1))}
.stp li{position:relative;padding-top:44px}
.stp .sn{position:absolute;top:0;left:0;height:30px;padding:0 10px;display:grid;place-items:center;border-radius:5px;background:var(--bg);border:1px solid rgba(25,102,255,.6);color:var(--a3);font-size:12px}
.stp h3{font-size:16px;font-weight:500;margin:0 0 6px;letter-spacing:-.02em}
.stp p{margin:0;color:var(--d);font-size:13.5px}
.spl{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.spl.nov{grid-template-columns:1fr}
.spt h2{margin-bottom:14px}.spt>p{color:var(--d);font-size:14px;margin:0 0 20px}
.chk{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;font-size:13.5px;color:#C7CAD1}
.spv{border:1px solid var(--l);border-radius:10px;background:var(--card);padding:30px}
.spv .ill{max-width:360px;margin:0 auto}
.fqw{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:start}
.fqh{position:sticky;top:90px}.fqh p{color:var(--d);font-size:14px}
.fql{display:grid;gap:8px}
.fq{border:1px solid var(--l);border-radius:8px;background:rgba(18,19,23,.6);transition:border-color .3s,background .3s}
.fq[open]{border-color:rgba(25,102,255,.45);background:rgba(25,102,255,.05)}
.fq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;padding:17px 18px;font-size:14.5px;font-weight:500}
.fq summary::-webkit-details-marker{display:none}
.fq summary i{flex:none;position:relative;width:12px;height:12px;margin-top:4px}
.fq summary i::before,.fq summary i::after{content:"";position:absolute;left:0;right:0;top:5.5px;height:1.4px;background:var(--d);transition:transform .3s}
.fq summary i::after{transform:rotate(90deg)}
.fq[open] summary i::after{transform:rotate(0)}
.fq div{padding:0 18px 16px;color:var(--d);font-size:13.5px}.fq div p{margin:0 0 8px}
.prw{display:grid;grid-template-columns:240px 1fr;gap:50px;align-items:start}
.prw.nt{grid-template-columns:1fr;max-width:820px}
.toc{position:sticky;top:90px;display:grid;gap:4px;font-size:11.5px}
.toc b{font-weight:400;color:var(--t);margin-bottom:8px}.toc a{color:var(--m);padding:4px 0;border-left:1px solid var(--l);padding-left:12px}.toc a:hover{color:var(--t);border-color:var(--a)}
.prb{max-width:760px}
.prs{padding:24px 0;border-bottom:1px solid var(--l);scroll-margin-top:90px}
.prs h3{font-size:18px;font-weight:500;margin:0 0 12px;letter-spacing:-.02em}
.prs p{color:#B4B8C0;font-size:14.5px;line-height:1.7;margin:0 0 12px}
.upd{font-size:11px;color:var(--m);margin:0 0 8px}
.stw{padding:0}
.sth{display:flex;align-items:center;gap:10px;padding:18px 22px;border-bottom:1px solid var(--l);font-size:15px}
.sth b{font-weight:500}.sth .dot,.sts .dot{background:var(--ok);box-shadow:0 0 8px var(--ok)}
.str{display:grid;grid-template-columns:1fr auto 260px;gap:20px;align-items:center;padding:14px 22px;border-bottom:1px solid var(--l);font-size:13.5px}
.str:last-child{border:0}
.sts{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--ok)}
.stb{display:grid;grid-template-columns:repeat(30,1fr);gap:2px}
.stb i{height:18px;border-radius:1px;background:rgba(61,220,151,.75)}
.scta{text-align:center;padding:60px 20px;border:1px solid var(--l);border-radius:10px;background:radial-gradient(60% 120% at 50% 0%,rgba(25,102,255,.2),transparent 70%),var(--card2)}
.scta h2{max-width:720px;margin:0 auto}.scta p{color:var(--d);max-width:520px;margin:14px auto 26px}
.scta .cta{justify-content:center}
.rlg{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rl{display:block;transition:border-color .3s,transform .3s}
.rl:hover{border-color:rgba(25,102,255,.5);transform:translateY(-2px)}
.rl em{font-style:normal;font-size:9.5px;font-family:"Fragment Mono",monospace;color:var(--a3);border:1px solid rgba(143,211,255,.35);border-radius:3px;padding:1px 5px;margin-left:6px;vertical-align:2px}
.rl .go{display:block;margin-top:16px;font-size:11px;color:var(--a2)}
@media (max-width:980px){.shg,.spl,.fqw,.prw{grid-template-columns:1fr}.shv{height:360px}.sfg,.rlg,.pcg{grid-template-columns:1fr 1fr}.stp{grid-template-columns:1fr 1fr;row-gap:30px}.stp::before{display:none}.fqh,.toc{position:static}.str{grid-template-columns:1fr auto}.stb{display:none}}
@media (max-width:620px){.sfg,.rlg,.pcg,.stp,.chk{grid-template-columns:1fr}.facts2{grid-template-columns:repeat(3,1fr)}.facts2 div{padding-right:10px;margin-right:10px}.shv{height:300px}.shv .fc2{display:none}.svs{padding-top:80px}}
.eb .logo svg{height:26px;display:block}.lg .lgl a:hover{color:var(--t)}
.lgh .shg{grid-template-columns:1fr;max-width:820px}.lgh{padding-bottom:20px}

/* ============ haut des pages de service : illustration du thème, sans cadre ============ */
.hv2{position:relative;height:440px;display:grid;place-items:center}
.hglow{position:absolute;inset:6% 4% 10%;background:radial-gradient(50% 50% at 50% 55%,rgba(25,102,255,.32),transparent 70%);filter:blur(34px);animation:asg 7s ease-in-out infinite}
.hart{position:relative;width:min(460px,92%);transition:transform .8s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 40px 50px rgba(0,0,0,.55))}
.hart>svg,.hart .hvi{display:block;width:100%;height:auto;animation:elementLoopVerticalSm 5s ease-in-out infinite}
.hv-p .hart{width:min(420px,88%)}
.hv-i .hart{width:220px}.hvi svg{width:100%;height:auto}
.hart::after{content:"";position:absolute;left:12%;right:12%;bottom:-18px;height:26px;border-radius:50%;background:radial-gradient(closest-side,rgba(25,102,255,.35),transparent);filter:blur(6px)}
@media (max-width:980px){.hv2{height:340px}}
@media (max-width:620px){.hv2{height:280px}}
.sht h1 .it{display:inline}

/* ============ liste des serveurs cloud avec onglets ============ */
.tg{position:relative;display:inline-flex;gap:2px;padding:4px;border-radius:8px;border:1px solid var(--l2);background:rgba(14,15,18,.8);margin-bottom:18px}
.tgi{position:absolute;top:4px;bottom:4px;left:4px;width:0;border-radius:5px;background:var(--a);box-shadow:0 8px 22px -8px rgba(25,102,255,.9);transition:left .45s cubic-bezier(.2,.8,.2,1),width .45s cubic-bezier(.2,.8,.2,1)}
.tgb{all:unset;position:relative;z-index:1;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;border-radius:5px;font-size:13px;color:var(--d);transition:color .3s;white-space:nowrap}
.tgb span{font-size:10px;padding:1px 6px;border-radius:3px;background:rgba(255,255,255,.08);color:var(--d);transition:.3s}
.tgb.on{color:#fff}.tgb.on span{background:rgba(255,255,255,.2);color:#fff}
.tgb:focus-visible{outline:2px solid var(--a3);outline-offset:2px}
.ct{border:1px solid var(--l);border-radius:8px;background:var(--card);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);overflow:hidden}
.cth,.ctr{display:grid;grid-template-columns:1.3fr 1.3fr .8fr 1.2fr .8fr .9fr 1.1fr 110px;gap:14px;align-items:center;padding:0 20px}
.cth{height:42px;border-bottom:1px solid var(--l);font-size:10.5px;color:var(--m);text-transform:uppercase;letter-spacing:.06em}
.ctr{min-height:62px;border-bottom:1px solid var(--l);font-size:12.5px;color:#C7CAD1;transition:background .25s;animation:ctin .45s cubic-bezier(.2,.8,.2,1) both}
.ctr:last-child{border-bottom:0}
.ctr:hover{background:rgba(25,102,255,.06)}
.ctr .mono{font-size:12px}
.ctn{font-weight:500;color:var(--t);font-size:13.5px}
.ctp b{font-size:17px;font-weight:600;letter-spacing:-.03em;color:var(--t)}.ctp em{font-style:normal;font-size:11px;color:var(--m);margin-left:5px}
.ctr .btn{justify-content:center}
.ctr:hover .btn{background:var(--a);border-color:var(--a);color:#fff}
@keyframes ctin{from{opacity:0;transform:translateY(6px)}}
@media (max-width:980px){.cth{display:none}.ctr{grid-template-columns:1fr 1fr;gap:6px 14px;padding:16px 18px}.ctn{grid-column:1/-1}.ctp{grid-column:1}.ctr .btn{grid-column:2}}
@media (max-width:620px){.tg{display:flex;overflow-x:auto;max-width:100%}.tgb{padding:0 12px;font-size:12px}}
.mlab{display:none;font-size:inherit}@media (max-width:980px){.mlab{display:inline}}
.ctn small{display:block;margin-top:3px;font-size:10px;font-weight:400;color:var(--m)}
.ctp i{display:block;font-style:normal;font-size:10.5px;color:var(--m);margin-top:2px}
.cth,.ctr{grid-template-columns:1.6fr 1.2fr .8fr 1.1fr .8fr 1.3fr 110px}
.ctr{padding-block:14px}
.hvl{display:block;width:260px;margin:0 auto}.hvl svg{width:100%;height:auto;animation:elementLoopVerticalSm 5s ease-in-out infinite}.hv-logo .hart{width:300px}

/* interrupteur : même matière que le sélecteur .tg */
.ck2.sw{align-items:center}
.ck2.sw i{width:34px;height:20px;margin:0;border-radius:11px;background:rgba(14,15,18,.8);border:1px solid var(--l2)}
.ck2.sw i::after{content:"";position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--d);transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s}
.ck2.sw input:checked+i{background:var(--a);border-color:var(--a);box-shadow:0 8px 22px -8px rgba(25,102,255,.9)}
.ck2.sw input:checked+i::after{transform:translateX(14px);background:#fff;left:2px;top:2px;width:14px;height:14px;border:0}
.ck2.sw input:focus-visible+i{outline:2px solid var(--a3);outline-offset:2px}
.rv{display:grid;gap:16px;padding:16px;border:1px solid var(--l);border-radius:8px;background:rgba(255,255,255,.015)}
.rv .mh{margin-top:-8px}

/* mobile : pas d'illustration sur les pages d'accès, et des champs en 16 px pour que le téléphone ne zoome pas */
@media (max-width:900px){.au .as{display:none}.au{min-height:0}}
@media (max-width:900px),(pointer:coarse){input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important}}

/* fluidité : le flou d'arrière-plan reste sur le menu, pas sur les cartes (coûteux au défilement) */
.pn,.cd,.ct,.fc,.win{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.pn,.cd,.ct{background:rgba(17,18,22,.86)}
#fx{image-rendering:auto}

/* menu mobile : connexion, inscription et langues en bas du menu */
.mcta{display:none}
@media (max-width:1100px){.mcta{display:grid;gap:10px;padding:20px 0 8px;margin-top:10px;border-top:1px solid var(--l)}.mcta .btn{height:46px;justify-content:center;font-size:14.5px}.mlang{display:flex;justify-content:center;gap:6px;margin-top:6px}.mlang a{height:32px;min-width:44px;display:grid;place-items:center;border-radius:5px;border:1px solid var(--l2);font-size:11.5px;color:var(--d)}.mlang a[aria-current]{color:#fff;border-color:var(--a);background:rgba(25,102,255,.12)}}
@media (max-width:1100px){.mm>.mi{width:100%;align-self:stretch}.mm>.mi>.mt{width:100%;justify-content:space-between}}
