:root{--navy:#06111f;--navy2:#071d36;--gold:#f1bf4d;--gold-light:#fff4af;--border:#244563;--white:#f8fafc;--muted:#bfd0de}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#020b16;color:var(--white);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:3px solid #7bccff;outline-offset:4px}
.shell{width:min(1440px,calc(100% - 84px));margin:0 auto}
.topbar{position:relative;z-index:20;border-bottom:1px solid #18334a;background:linear-gradient(96deg,#030b16 0%,#051829 70%,#030c18 100%);box-shadow:0 6px 22px #0005}
.nav-wrap{height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:inline-flex;align-items:center;gap:14px;white-space:nowrap;font-weight:900;letter-spacing:.4px;font-size:clamp(22px,2.2vw,32px);text-shadow:0 2px 10px #000}
.logo strong,.logo-footer b{color:var(--gold);font-weight:900}
.logo-mark{width:43px;height:43px;flex:none;display:grid;place-items:center;transform:rotate(45deg);border:5px solid #f5cd68;border-radius:4px;box-shadow:0 0 12px #9b6b1866}
.logo-mark>span{width:18px;height:18px;border:5px solid #f5cd68;border-radius:2px;display:block}
.main-menu{display:flex;gap:clamp(12px,2vw,32px);align-items:center;margin-left:auto}
.main-menu a{position:relative;font-size:15px;font-weight:650;white-space:nowrap;color:#e2e8f2;transition:color .2s}
.main-menu a:hover,.main-menu a.active{color:#ffe18a}
.main-menu a.active::after{content:"";height:2px;background:var(--gold);position:absolute;bottom:-10px;left:0;right:0}
.nav-actions{display:flex;gap:12px;align-items:center;margin-left:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;font-size:15px;font-weight:850;white-space:nowrap;cursor:pointer;border-radius:13px;transition:transform .17s,filter .17s,box-shadow .17s;min-height:46px;padding:12px 24px}
.btn:hover{transform:translateY(-2px);filter:brightness(1.07)}
.btn-login{border:1px solid #9daec4;background:#02101ee0;box-shadow:inset 0 0 0 1px #ffffff10}
.btn-gold{background:linear-gradient(110deg,#ffdc6e,#fff2a5 48%,#f0ae32);color:#0c111b;border:1px solid #ffe7a2;box-shadow:0 4px 24px #c08c2940}
.btn-login>span,.btn-gold>span{font-size:19px;line-height:1}
.nav-toggle{display:none}
.hero{position:relative;isolation:isolate;border-bottom:1px solid #aa782c65;background:radial-gradient(ellipse at 65% 38%,#184473 0,#071525 50%,#010812 100%);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,#00102678 0%,transparent 30%),linear-gradient(0deg,#030f20 0%,transparent 19%);z-index:-1}
.hero-ambient{position:absolute;inset:0;background:radial-gradient(circle at 75% 25%,#ffc14e16,transparent 40%),radial-gradient(circle at 12% 90%,#077bd41b,transparent 55%);pointer-events:none}
.hero-inner{position:relative;min-height:560px;display:flex;align-items:center}
.hero-copy{position:relative;z-index:3;width:51%;padding:52px 0 57px;text-shadow:0 2px 10px #0007}
.eyebrow{display:flex;align-items:center;gap:10px;letter-spacing:.29em;font-weight:650;font-size:12px;color:#d2dbe9;margin-bottom:28px}
.eyebrow .line{display:none}
.hero h1{margin:0;font-size:clamp(50px,5.9vw,104px);font-weight:1000;line-height:1.04;letter-spacing:-.065em;color:#f9faff;text-shadow:0 2px 2px #485a62,0 7px 16px #000;white-space:nowrap}
.hero h1 em{font-style:normal;color:var(--gold);background:linear-gradient(165deg,#fff8c0 4%,#ffe17d 34%,#d88b16 72%,#fcdb81);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 4px #010b14)}
.hero h2{font-size:clamp(20px,2.05vw,32px);line-height:1.23;font-weight:960;letter-spacing:-.035em;margin:7px 0 22px;white-space:nowrap}
.hero h2 span{color:#ffdc77}
.hero-copy>p{font-size:clamp(15px,1.25vw,18px);line-height:1.65;color:#e0e7f0;max-width:510px;margin:0 0 26px}
.hero-buttons{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.btn-hero-primary{min-height:64px;font-size:17px;padding:15px 26px;color:#061222;border:1px solid #ffeab2;background:linear-gradient(122deg,#ffdf6c,#f3b437 70%,#ffdf80);box-shadow:0 8px 26px #e5ae3555}
.btn-hero-secondary{min-height:64px;font-size:15px;padding:15px 23px;border:1px solid #a7d8ff;background:linear-gradient(112deg,#001324dd,#041f35dd);box-shadow:0 6px 18px #02091166}
.hero-highlights{display:flex;flex-wrap:wrap;gap:24px;margin-top:31px;color:#eaf2fa;font-size:13px;font-weight:650}
.tiny-icon{color:#ffdf71;font-size:22px;vertical-align:middle;margin-right:5px}
.hero-art{position:absolute;z-index:1;right:-54px;top:49px;width:62.5%;max-width:860px;pointer-events:none;overflow:hidden;filter:drop-shadow(0 10px 24px #0004)}
.hero-art img{display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 100%);mask-image:linear-gradient(to right,transparent 0%,#000 7%,#000 100%)}
.features{position:relative;z-index:4;display:grid;grid-template-columns:repeat(3,1fr);gap:15px;padding-top:26px;padding-bottom:22px}
.feature-card{min-height:126px;display:flex;align-items:center;gap:16px;padding:19px 22px;border:1px solid #1e5a85;border-radius:16px;background:linear-gradient(113deg,#04192d,#06233d 60%,#061628);box-shadow:inset 0 1px #ffffff11,0 7px 22px #0006;transition:transform .17s,border-color .17s}
.feature-card:hover{transform:translateY(-3px);border-color:#d29d35}
.feature-icon{width:67px;height:67px;flex:none;display:grid;place-items:center;border:2px solid #edbb4c;border-radius:50%;font-size:32px;color:#ffdf8b;background:radial-gradient(circle,#705a1c55,#001728);box-shadow:0 0 17px #c69b3966,inset 0 0 11px #b0863666}
.feature-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.feature-copy small{font-size:12px;color:#c9d7e4}
.feature-copy strong{color:#ffda74;font-size:clamp(18px,1.9vw,27px);line-height:1.17}
.feature-arrow{margin-left:auto;font-size:38px;color:#ffd875;line-height:1}
.how{padding-top:20px;padding-bottom:30px;scroll-margin-top:30px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:22px;margin-bottom:18px}
.section-eyebrow{font-size:12px;color:#e7ad45;font-weight:850;letter-spacing:.18em}
.section-head h2{font-size:clamp(27px,3.2vw,43px);letter-spacing:-.04em;margin:6px 0 0;font-weight:950}
.section-head h2 span{color:#ffca68}
.section-head p{color:#aabdd1;font-size:15px}
.how-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(260px,1.18fr);gap:13px}
.step-card,.mini-matrix{background:linear-gradient(153deg,#071a32,#031020);border:1px solid #245277;border-radius:16px;min-height:225px;position:relative;padding:24px 20px 19px;overflow:hidden}
.step-card{display:flex;flex-direction:column;align-items:flex-start}
.step-number{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;border:2px solid currentColor;font-size:26px;font-weight:900;background:#081c38}
.step-number.blue{color:#55bdff;box-shadow:0 0 16px #287afd80}.step-number.green{color:#77f3a3;box-shadow:0 0 16px #36d87b75}.step-number.gold{color:#ffe28a;box-shadow:0 0 16px #f3b94575}
.step-symbol{position:absolute;right:23px;top:27px;font-size:36px;color:#eac05b}
.step-card h3{font-size:20px;margin:17px 0 7px;font-weight:900}
.step-card p{font-size:14px;line-height:1.48;color:#c4d1df;margin:0}
.mini-matrix{text-align:center;border-color:#d39835;box-shadow:inset 0 0 11px #b6772980,0 0 12px #bb863f50;background:radial-gradient(circle at 50% 10%,#233451,#050d19 70%)}
.mini-matrix h3{margin:0 0 12px;color:#f5c65b;font-size:24px;font-weight:950}
.you{display:inline-flex;border-radius:18px;padding:4px 23px;border:1px solid #ffdc80;background:linear-gradient(#ffdc76,#d89c2e);color:#0a1522;font-size:17px;font-weight:900}
.matrix-connector{height:32px;width:76%;margin:0 auto;position:relative;border-bottom:3px solid #ffd86a}
.matrix-connector::before{content:"";height:32px;position:absolute;left:50%;border-left:3px solid #ffd86a}
.slots{display:flex;justify-content:space-between;gap:8px;margin:12px auto;max-width:300px}
.slots span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:18px;font-weight:900;background:#0b1b2e;border:3px solid;box-shadow:0 0 14px currentColor}
.slot-blue{color:#16b6ff}.slot-green{color:#3fe68a}.slot-violet{color:#b37afa}.slot-pink{color:#fb53b3}
.mini-matrix p{font-size:12px;margin:10px 0 0;color:#b5d0e0}
.last-cta{margin-top:10px;margin-bottom:45px;border-radius:20px;background:radial-gradient(circle at right,#34361655,transparent 45%),linear-gradient(107deg,#081f33,#04121f);border:1px solid #76602d;box-shadow:inset 0 0 15px #ca9b2b25;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:27px 33px}
.last-cta h2{font-size:clamp(25px,2.5vw,36px);margin:5px 0}
.last-cta p{color:#b9c9d8;margin:7px 0 0;line-height:1.5}
.last-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.footer{background:#020b15;border-top:1px solid #20394b;padding:22px 0}
.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center;color:#8fa7b9;font-size:13px}
.logo-footer{font-size:20px;font-weight:950;color:white}
.footer-inner a{color:#ffe09a}
@media(max-width:1180px){.shell{width:min(100% - 52px,1440px)}.nav-wrap{gap:15px}.logo{font-size:25px}.logo-mark{width:34px;height:34px;border-width:4px}.main-menu{gap:15px}.main-menu a{font-size:13px}.nav-actions{gap:8px;margin-left:2px}.nav-actions .btn{padding:11px 15px}.hero-copy{width:55%}.hero-art{width:61.5%;right:-24px;top:78px}.hero h1{font-size:clamp(44px,5.7vw,72px)}.hero h2{white-space:normal}.how-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mini-matrix{grid-column:1 / -1;min-height:205px}.slots{max-width:340px}}
@media(max-width:800px){.shell{width:calc(100% - 34px)}.nav-wrap{height:72px;gap:12px}.logo{font-size:21px;gap:10px}.logo-mark{width:29px;height:29px;border-width:3px}.logo-mark>span{width:12px;height:12px;border-width:3px}.nav-toggle{display:flex;margin-left:auto;align-items:center;justify-content:center;flex-direction:column;gap:4px;border:1px solid #416078;background:#031426;border-radius:10px;width:42px;height:42px;cursor:pointer}.nav-toggle span{width:21px;height:2px;background:#ffdb7d;border-radius:2px}.main-menu{display:none;position:absolute;top:70px;left:0;right:0;margin:0;gap:0;align-items:stretch;flex-direction:column;padding:12px 20px 18px;border-bottom:1px solid #24465a;background:#06192c;box-shadow:0 20px 30px #0008}.main-menu.open{display:flex}.main-menu a{font-size:15px;padding:11px}.main-menu a.active::after{display:none}.nav-actions{margin:0}.nav-actions .btn{font-size:13px;padding:10px 12px;min-height:40px}.nav-actions .btn>span{display:none}.hero-inner{min-height:0;display:flex;flex-direction:column}.hero-copy{width:100%;padding:42px 0 10px}.hero h1{font-size:clamp(52px,10.5vw,82px)}.hero h2{font-size:clamp(18px,3.7vw,27px)}.hero-copy>p{font-size:16px}.eyebrow{font-size:11px;margin-bottom:15px}.hero-art{position:relative;right:auto;top:auto;width:calc(100% + 32px);max-width:none;margin:7px -16px -5px;overflow:visible}.hero-art img{width:100%;-webkit-mask-image:linear-gradient(0deg,#000 92%,#000 100%);mask-image:none}.hero-highlights{margin-top:20px}.features{gap:12px}.feature-card{padding:15px;min-height:118px;gap:10px}.feature-icon{width:43px;height:43px;font-size:23px}.feature-copy strong{font-size:19px}.feature-arrow{font-size:26px}.section-head h2{font-size:28px}.step-card{min-height:212px}}
@media(max-width:600px){.nav-wrap{height:65px}.logo{font-size:19px}.logo-mark{width:27px;height:27px}.nav-toggle{width:37px;height:37px}.main-menu{top:64px}.nav-actions .btn-login{display:none}.nav-actions .btn{font-size:12px;min-height:37px;padding:9px 12px}.hero-copy{padding:35px 0 4px}.eyebrow{letter-spacing:.16em;font-size:10px}.hero h1{font-size:clamp(47px,12.4vw,70px)}.hero h2{font-size:clamp(18px,4.6vw,24px);margin-bottom:15px}.hero-copy>p{font-size:14px;margin-bottom:20px}.hero-buttons{gap:9px}.btn-hero-primary,.btn-hero-secondary{flex:1;min-height:53px;font-size:12px;gap:7px;padding:11px 8px}.hero-highlights{margin-top:18px;font-size:11px;gap:14px}.hero-art{margin-top:12px}.features{grid-template-columns:1fr;gap:10px;padding-top:19px}.feature-card{min-height:88px;padding:12px 17px}.feature-icon{width:52px;height:52px}.feature-copy strong{font-size:21px}.how{padding-top:13px}.section-head{align-items:flex-start;flex-direction:column;gap:5px}.section-head p{margin:0 0 5px}.how-grid{grid-template-columns:1fr;gap:10px}.step-card{min-height:150px;padding:17px 20px}.step-card h3{margin:8px 0 5px}.step-card .step-number{width:35px;height:35px;font-size:18px}.step-symbol{top:18px}.mini-matrix{grid-column:1;min-height:230px}.last-cta{flex-direction:column;align-items:flex-start;margin-bottom:23px;padding:22px}.last-actions{width:100%}.last-actions .btn{flex:1}.footer-inner{flex-direction:column;align-items:flex-start;gap:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.feature-card{transition:none}}