@font-face{font-family:Manrope;src:url('/assets/manrope.ttf') format('truetype');font-display:swap;font-weight:200 800}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:#000;color:#f4f6fb;font:15px/1.65 Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}h1,h2,h3,p,dl,dd{margin:0}button{font:inherit;color:inherit;cursor:pointer}svg{display:block}
:focus-visible{outline:2px solid #76a8ff;outline-offset:4px;border-radius:6px}::selection{background:#2765e5;color:#fff}
.wrap{width:min(1120px,calc(100% - 48px));margin-inline:auto}
.scroll-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:60;background:linear-gradient(90deg,#2563ed,#76a8ff);transform:scaleX(0);transform-origin:left;pointer-events:none}
/* header */
.header{position:sticky;top:14px;z-index:50;width:min(1120px,calc(100% - 48px));margin:14px auto 0;height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 14px 0 18px;border:1px solid #1f2430;border-radius:14px;background:#0a0c12cc;backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;letter-spacing:-.4px}.brand img{width:30px;height:30px}.brand span{color:#4c8aff}
.header nav{display:flex;gap:30px;font-size:13.5px;color:#a3abbd}.header nav a{transition:color .2s}.header nav a:hover{color:#fff}
.btn{display:inline-flex;align-items:center;gap:9px;padding:11px 20px;border-radius:999px;font-weight:600;font-size:14px;border:1px solid transparent;transition:transform .2s,background .25s,box-shadow .3s,border-color .25s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}.btn.primary{background:#2563ed;color:#fff;box-shadow:0 0 0 0 #2563ed66}.btn.primary:hover{background:#3a74f2;box-shadow:0 8px 30px #2563ed55}
.btn.ghost{border-color:#2a3142;background:#0a0c12}.btn.ghost:hover{border-color:#4c5a78}.btn.small{padding:9px 16px;font-size:13px}
.menu-button{display:none;background:none;border:1px solid #2a3142;border-radius:10px;width:42px;height:38px;font-size:18px}
/* hero */
.hero{text-align:center;padding:84px 0 0;position:relative}.hero-frame:after{max-width:100%}
.hero:before{content:'';position:absolute;left:50%;top:-40px;width:min(900px,100vw);height:520px;transform:translateX(-50%);background:radial-gradient(closest-side,#2563ed33,transparent);pointer-events:none;z-index:-1}
.badge{display:inline-flex;align-items:center;gap:10px;padding:7px 15px;border:1px solid #232a3a;border-radius:999px;background:#0a0c12;font-size:12px;color:#b6bed0;margin-bottom:26px}
.dot{width:7px;height:7px;border-radius:50%;background:#3fd08a;animation:kx-ping 2.2s infinite}
.hero h1{font-size:clamp(34px,5.2vw,62px);line-height:1.08;letter-spacing:-.035em;font-weight:600;max-width:880px;margin:0 auto}.hero h1 em{font-style:normal;color:#6c9dff}
.hero p.lead{max-width:640px;margin:24px auto 0;color:#9aa3b7;font-size:17px}
.actions{display:flex;gap:12px;justify-content:center;margin-top:34px;flex-wrap:wrap}
.hero-frame{margin:64px auto 0;max-width:1040px;position:relative}
.hero-video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#05070c;object-fit:cover}
.explain-frame{margin-top:56px}
@media(max-width:700px){.hero-video{aspect-ratio:9/16;max-height:82vh}}
.hero-frame:after{content:'';position:absolute;inset:auto 8% -30px;height:60px;background:#2563ed44;filter:blur(50px);z-index:-1}
.frame{border:1px solid #232a3a;border-radius:16px;background:#0a0c12;overflow:hidden;box-shadow:0 30px 80px #0009}
.frame-bar{display:flex;align-items:center;gap:14px;padding:11px 16px;border-bottom:1px solid #1b2130;font:11px ui-monospace,Consolas,monospace;color:#7d869b}
.frame-bar i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#2a3142;margin-right:5px}.frame-bar b{margin-left:auto;font-weight:500;letter-spacing:.12em;color:#8fb3ff}
/* sections */
.section{padding:120px 0 0}.eyebrow{font:11px ui-monospace,Consolas,monospace;letter-spacing:.16em;color:#6c9dff;text-transform:uppercase}
.section-head{text-align:center;max-width:720px;margin:0 auto 56px}.section-head h2{font-size:clamp(28px,3.6vw,44px);line-height:1.12;letter-spacing:-.03em;font-weight:600;margin-top:14px}.section-head p{color:#9aa3b7;margin-top:16px;font-size:16px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.step{border:1px solid #1f2430;border-radius:18px;background:linear-gradient(180deg,#0c0f17,#07090e);padding:26px;display:flex;flex-direction:column;gap:18px;transition:border-color .3s,transform .3s}.step:hover{border-color:#34507f;transform:translateY(-3px)}
.step-no{font:12px ui-monospace,monospace;color:#6c9dff;letter-spacing:.1em}.step h3{font-size:21px;letter-spacing:-.02em;font-weight:600}.step p{color:#98a1b5;font-size:14px;line-height:1.7}
.vis{height:190px;border:1px solid #1b2130;border-radius:12px;background:#05070b;position:relative;overflow:hidden;padding:12px}
/* vis 1 : carnet qui respire */
.v-book{display:grid;gap:5px;font:11.5px ui-monospace,monospace}.v-book div{position:relative;display:flex;justify-content:space-between;padding:4px 8px;border-radius:5px;overflow:hidden}.v-book i{position:absolute;inset:0 auto 0 0;border-radius:5px;opacity:.22;animation:kx-bar 3.2s ease-in-out infinite alternate}
.v-book .a i{background:#ff6b6b}.v-book .b i{background:#3fd08a}.v-book .a span{color:#ff9a9a}.v-book .b span{color:#6fe0a8}.v-book b{position:relative;font-weight:500;color:#c9d2e6}.v-book span{position:relative}
.v-book .sp{justify-content:center;color:#6f7a92;border-block:1px dashed #263049;border-radius:0;font-size:10px;padding:3px}
/* vis 2 : ticket */
.v-ticket{display:flex;flex-direction:column;gap:10px;justify-content:center;height:100%;padding:6px 8px}.v-ticket .row{display:flex;justify-content:space-between;font-size:12.5px;color:#98a1b5}.v-ticket .row b{color:#fff;font-weight:600}
.v-buy{position:relative;height:38px;border-radius:9px;background:#2563ed;font-weight:600;font-size:13px;display:grid;place-items:center;animation:kx-press 5s infinite}
.v-buy span{position:absolute;inset:0;display:grid;place-items:center;border-radius:9px}.v-buy .s1{animation:kx-s1 5s infinite}.v-buy .s2{background:#14a064;animation:kx-s2 5s infinite;opacity:0}
.v-cur{position:absolute;right:30px;bottom:18px;width:20px;height:20px;animation:kx-cur 5s infinite}
/* vis 3 : fil d'activité */
.v-feed{display:grid;gap:8px;animation:kx-scroll 9s linear infinite}.v-feed div{display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid #1b2130;border-radius:9px;background:#090c12;font-size:12px}.v-feed i{width:7px;height:7px;border-radius:50%;background:#3fd08a;flex:none}.v-feed small{margin-left:auto;font:10px ui-monospace,monospace;color:#6f7a92}
/* exemple */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.card{border:1px solid #1f2430;border-radius:18px;background:linear-gradient(180deg,#0c0f17,#07090e);padding:28px}
.tag{display:inline-block;font:10px ui-monospace,monospace;letter-spacing:.12em;padding:5px 10px;border-radius:6px;background:#12234a;color:#9fc3ff}.tag.n{background:#1a1f2b;color:#aab3c6}
.card-top{display:flex;justify-content:space-between;align-items:center;font:10.5px ui-monospace,monospace;color:#6f7a92;letter-spacing:.08em}
.card h3{font-size:24px;letter-spacing:-.025em;font-weight:600;margin-top:20px}.card h3 small{display:block;font:10.5px ui-monospace,monospace;color:#6f7a92;margin-top:8px;font-weight:400;letter-spacing:.04em}
.facts{margin-top:18px}.facts div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #1b2130;font-size:13.5px}.facts dt{color:#8c96ab}.facts dd{font-weight:600;text-align:right;font-variant-numeric:tabular-nums}.facts em{font-style:normal;color:#ff8a8a;font-size:12px;margin-left:6px}.facts .down{color:#ff8a8a}
.book{margin-top:18px;border:1px solid #1b2130;border-radius:12px;padding:10px 12px;background:#05070b}.book-h{display:flex;justify-content:space-between;font:9.5px ui-monospace,monospace;letter-spacing:.12em;color:#6f7a92;padding-bottom:8px}.book .r{display:flex;justify-content:space-between;padding:4px 6px;font:12px ui-monospace,Consolas,monospace}.book .a span{color:#ff9a9a}.book .b span{color:#6fe0a8}.book .r b{font-weight:500;color:#c9d2e6}.book .g{justify-content:center;gap:14px;margin:3px 0;border-block:1px dashed #263049;color:#7d869b;font-size:10.5px}
.src{margin-top:16px;font-size:12px;color:#7d869b;display:flex;gap:16px;flex-wrap:wrap}.src a{color:#8fb3ff}.src a:hover{text-decoration:underline}
.sim-order{display:flex;align-items:center;gap:14px;border:1px solid #1f2a40;border-radius:12px;padding:14px 16px;margin-top:20px;transition:border-color .4s,background .4s}.sim-order.filled{border-color:#2f7a58;background:#0b1d17}
.sim-order .dir{font:700 11px ui-monospace,monospace;padding:6px 10px;border-radius:6px;background:#3a1218;color:#ffb0b0}.sim-order b{margin-left:auto}.sim-order small{display:block;color:#7d869b;font-size:11.5px}
.stage{display:flex;align-items:center;gap:10px;margin-top:22px;font-size:13px;color:#b6bed0}.stage i{width:7px;height:7px;border-radius:50%;background:#2563ed;animation:kx-ping 1.6s infinite;flex:none}.stage em{margin-left:auto;font:normal 10px ui-monospace,monospace;color:#6f7a92}
.prog{height:3px;background:#161b26;border-radius:3px;margin-top:12px;overflow:hidden}.prog span{display:block;height:100%;width:0;background:linear-gradient(90deg,#2563ed,#76a8ff);transition:width 1.2s ease}
.totals{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}.totals span{font-size:12px;color:#7d869b}.totals strong{display:block;font-size:24px;font-weight:600;letter-spacing:-.02em;margin-top:2px;font-variant-numeric:tabular-nums}
.result{display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding-top:18px;border-top:1px solid #1b2130}.result span{font-size:13.5px}.result small{display:block;color:#7d869b;font-size:11.5px}.result strong{font-size:30px;letter-spacing:-.03em;color:#6b7488;transition:color .5s}.result.complete strong{color:#6fe0a8}
.note{margin-top:18px;font-size:11.5px;color:#7d869b;line-height:1.7}
/* dashboard */
.dash{padding:20px;display:grid;grid-template-columns:150px 1fr;gap:20px;min-height:360px;background:#05070b}
.dash-nav{display:grid;gap:6px;align-content:start;font-size:12.5px;color:#8c96ab}.dash-nav span{padding:9px 11px;border-radius:8px;transition:background .3s,color .3s}.dash-nav span.on{background:#101c36;color:#bcd4ff}
.dash-main{display:grid;gap:14px;align-content:start}.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.kpi{border:1px solid #1b2130;border-radius:12px;padding:13px 15px;background:#090c12}.kpi small{display:block;font:9.5px ui-monospace,monospace;letter-spacing:.1em;color:#6f7a92}.kpi strong{font-size:23px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.dash-feed{border:1px solid #1b2130;border-radius:12px;background:#090c12;overflow:hidden}.dash-feed h4{margin:0;padding:11px 15px;border-bottom:1px solid #1b2130;font:10px ui-monospace,monospace;letter-spacing:.12em;color:#6f7a92;font-weight:500}
.dash-feed ul{list-style:none;margin:0;padding:0;height:164px;overflow:hidden}.dash-feed li{display:flex;gap:12px;align-items:center;padding:10px 15px;border-bottom:1px solid #131826;font-size:12.5px;animation:kx-in .5s ease both}.dash-feed li small{margin-left:auto;font:10px ui-monospace,monospace;color:#6f7a92}.dash-feed li i{width:7px;height:7px;border-radius:50%;background:#4c8aff;flex:none}.dash-feed li.ok i{background:#3fd08a}
/* telegram */
.tg{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}.tg h2{font-size:clamp(28px,3.4vw,42px);line-height:1.12;letter-spacing:-.03em;font-weight:600;margin-top:14px}.tg p{color:#9aa3b7;margin-top:18px}
.points{margin-top:26px;display:grid;gap:12px}.points span{display:flex;gap:14px;align-items:center;font-size:14.5px}.points i{font:normal 11px ui-monospace,monospace;color:#6c9dff;border:1px solid #2a3b5e;border-radius:6px;padding:3px 7px}
.phone{width:290px;margin:0 auto;border:1px solid #2a3142;border-radius:36px;background:#07090e;padding:14px;box-shadow:0 30px 80px #000a,0 0 80px #2563ed22;animation:kx-float 7s ease-in-out infinite}
.phone-in{border:1px solid #1b2130;border-radius:24px;background:#05070b;padding:18px 16px;min-height:470px}
.ph-top{display:flex;justify-content:space-between;align-items:center;font:10px ui-monospace,monospace;color:#7d869b;letter-spacing:.1em}.phone h3{font-size:22px;letter-spacing:-.02em;margin:14px 0 14px}
.ph-panel{border:1px solid #1b2130;border-radius:14px;padding:14px;background:#090c12}.ph-panel p{margin:4px 0 0;color:#7d869b;font-size:12px}
.bars{display:flex;align-items:flex-end;gap:5px;height:80px;margin:14px 0}.bars i{flex:1;background:linear-gradient(180deg,#4c8aff,#1c3b80);border-radius:3px 3px 0 0;animation:kx-grow 3.4s ease-in-out infinite alternate;transform-origin:bottom}
.ph-row{display:flex;justify-content:space-between;font-size:12px;padding:7px 0;border-top:1px solid #151b28;color:#8c96ab}.ph-row b{color:#fff}
.ph-cta{display:block;margin-top:14px;text-align:center;padding:12px;border-radius:12px;background:#2563ed;font-weight:600;font-size:13px}
/* faq */
.faq{max-width:760px;margin:0 auto}details{border:1px solid #1f2430;border-radius:14px;background:#0a0c12;margin-bottom:10px;transition:border-color .3s}details[open]{border-color:#34507f}summary{list-style:none;display:flex;justify-content:space-between;gap:20px;padding:19px 22px;font-weight:600;font-size:15px}summary::-webkit-details-marker{display:none}summary span{color:#6c9dff;transition:transform .3s;font-size:20px;line-height:1}details[open] summary span{transform:rotate(45deg)}details p{padding:0 22px 20px;color:#98a1b5;font-size:14px;animation:kx-in .35s ease both}
.closing{text-align:center;padding:130px 0 120px}.closing h2{font-size:clamp(30px,4.2vw,52px);line-height:1.1;letter-spacing:-.035em;font-weight:600}.closing h2 em{font-style:normal;color:#6c9dff}.closing p{color:#9aa3b7;margin:18px auto 32px;max-width:520px}
.footer{border-top:1px solid #151b28;padding:34px 0 46px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:#7d869b}.footer button{background:none;border:0;color:#9aa3b7;margin-left:18px;padding:0}.footer button:hover{color:#fff}
/* modal */
dialog.modal{border:1px solid #2a3142;border-radius:18px;background:#0a0c12;color:#f4f6fb;padding:34px;max-width:480px;width:calc(100% - 40px)}dialog.modal::backdrop{background:#000b;backdrop-filter:blur(4px)}
.modal-close{position:absolute;right:16px;top:12px;background:none;border:0;font-size:26px;color:#8c96ab}.modal h2{font-size:24px;margin:10px 0 14px}.modal p{color:#a3abbd;margin-bottom:12px;font-size:14px}.modal .btn{margin-top:10px}
/* animation d'entrée au défilement */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}.rv.is-visible{opacity:1;transform:none}
.hero>*{animation:kx-rise .9s cubic-bezier(.2,.7,.2,1) both}.hero h1{animation-delay:.08s}.hero p.lead{animation-delay:.18s}.hero .actions{animation-delay:.28s}.hero .hero-frame{animation-delay:.4s}
@keyframes kx-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes kx-ping{0%{box-shadow:0 0 0 0 #3fd08a88}70%,100%{box-shadow:0 0 0 8px #3fd08a00}}
@keyframes kx-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes kx-bar{from{width:18%}to{width:92%}}
@keyframes kx-grow{from{transform:scaleY(.35)}to{transform:scaleY(1)}}
@keyframes kx-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes kx-scroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes kx-press{0%,38%{transform:scale(1)}42%{transform:scale(.95)}48%,100%{transform:scale(1)}}
@keyframes kx-s1{0%,44%{opacity:1}46%,92%{opacity:0}96%,100%{opacity:1}}
@keyframes kx-s2{0%,44%{opacity:0}46%,92%{opacity:1}96%,100%{opacity:0}}
@keyframes kx-cur{0%{transform:translate(70px,-70px)}34%{transform:translate(0,0)}44%{transform:translate(0,0)}60%,100%{transform:translate(70px,-70px);opacity:0}}
@media(max-width:900px){.steps,.grid2,.tg{grid-template-columns:1fr}.tg{gap:44px}.header nav{display:none}.header nav.open{display:flex;position:absolute;top:68px;left:0;right:0;flex-direction:column;gap:0;border:1px solid #1f2430;border-radius:14px;background:#0a0c12;padding:8px}.header nav.open a{padding:13px 14px}.menu-button{display:block}.header-cta{display:none}.dash{grid-template-columns:1fr}.dash-nav{grid-auto-flow:column;overflow:auto}.section{padding-top:84px}.hero{padding-top:56px}.hero-frame{margin-top:44px}}
@media(max-width:560px){.wrap,.header{width:calc(100% - 28px)}.kpis{grid-template-columns:1fr 1fr}.kpis .kpi:last-child{grid-column:1/-1}.card{padding:22px}.footer button{margin:0 18px 0 0}}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.hero>*{animation:none}.scroll-progress{display:none}}
.proofs{margin-top:20px;display:grid;gap:8px}.proofs a{display:flex;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid #1b2130;border-radius:10px;background:#05070b;font-size:12.5px;color:#98a1b5;transition:border-color .25s,background .25s}.proofs a:hover{border-color:#34507f;background:#0a1020}.proofs b{color:#8fb3ff;font:500 11.5px ui-monospace,Consolas,monospace}
.facts .up{color:#6fe0a8}.sim-order .dir.up{background:#0f3a2a;color:#9df0c4}.facts dd em{color:#6fe0a8}
