@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{--ink:#fff;--deep:#15105f;--purple:#5835f5;--lime:#b8ff24;--pink:#ff8dcc;--line:rgba(255,255,255,.22)}
*{box-sizing:border-box}html{min-height:100%;background:var(--deep)}
body{min-height:100vh;margin:0;color:var(--ink);font-family:"DM Sans",sans-serif;background:radial-gradient(circle at 76% 35%,rgba(132,84,255,.72),transparent 35%),linear-gradient(125deg,#17106a 0%,#2820a7 54%,#5935fa 100%);display:flex;flex-direction:column;overflow-x:hidden}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}
header,footer,main{width:min(1440px,calc(100% - 80px));margin-inline:auto;position:relative;z-index:1}
header{height:116px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand img{display:block;width:190px;height:auto}.status{font:600 12px "Manrope",sans-serif;letter-spacing:.13em;text-transform:uppercase;display:flex;align-items:center;gap:10px}.status i{width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 6px rgba(184,255,36,.12);animation:pulse 1.8s infinite}
main{flex:1;display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:5vw;padding:64px 0 70px}.copy{max-width:630px}.eyebrow{font:700 12px "Manrope",sans-serif;letter-spacing:.18em;color:#dad5ff;margin:0 0 26px}.eyebrow span{color:var(--lime);font-size:19px;margin-right:10px}
h1{font:700 clamp(64px,7vw,112px)/.88 "Manrope",sans-serif;letter-spacing:-.065em;margin:0}h1 em{font-style:italic;color:var(--lime)}.intro{max-width:570px;font-size:19px;line-height:1.65;color:#dfddf6;margin:38px 0 34px}.actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap}.actions a{text-decoration:none}.primary{background:var(--lime);color:#151238;padding:18px 23px;border-radius:10px;font-weight:700;box-shadow:0 5px 0 #11102d;display:flex;gap:36px;transition:.2s}.primary:hover{transform:translateY(-3px);box-shadow:0 8px 0 #11102d}.secondary{color:#fff;border-bottom:1px solid rgba(255,255,255,.5);padding:8px 0;font-size:14px}
.visual{height:min(650px,64vw);min-height:460px;position:relative;display:grid;place-items:center;isolation:isolate}.orbit{position:absolute;border:1px solid rgba(255,255,255,.24);border-radius:50%;transform:rotate(-20deg)}.orbit-one{width:96%;height:53%}.orbit-two{width:72%;height:85%;transform:rotate(36deg)}.planet{position:absolute;border-radius:50%;box-shadow:inset -16px -14px 30px rgba(0,0,0,.25),0 18px 45px rgba(0,0,0,.18)}.planet-one{width:76px;height:76px;background:var(--pink);top:7%;right:6%}.planet-two{width:42px;height:42px;background:var(--lime);left:4%;bottom:13%}
.card{width:min(420px,64%);aspect-ratio:.72;background:linear-gradient(150deg,#f7f7fb,#d9dcf2);border-radius:30px;color:#17152c;padding:32px;transform:rotate(7deg);box-shadow:30px 38px 0 rgba(15,9,70,.34),0 40px 90px rgba(4,0,50,.5);border:2px solid #fff;position:relative;display:flex;flex-direction:column}.card:before,.card:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#b5bbd7;border:5px solid #fff;box-shadow:inset 0 0 0 2px #818aa9}.card:before{top:20px;left:20px}.card:after{right:20px;bottom:20px}.card-label{font:800 10px "Manrope",sans-serif;letter-spacing:.15em;margin-left:32px}.card strong{font:800 clamp(70px,7vw,112px)/1 "Manrope",sans-serif;letter-spacing:-.08em;color:#1f166c;margin:14% 0 0}.card p{font-weight:600;font-size:18px;line-height:1.35}.card small{margin-top:auto;font-weight:700;letter-spacing:.12em;color:#635d82}
.gate{height:70px;display:flex;align-items:center;position:absolute;right:24px;top:48%}.gate span{width:34px;border-top:4px solid #1f166c;margin-right:-4px}.gate b{width:74px;height:70px;border:4px solid #1f166c;border-left:0;border-radius:0 50% 50% 0;position:relative}.gate b:after{content:"";position:absolute;width:30px;border-top:4px solid #1f166c;right:-34px;top:29px}.tag{position:absolute;right:1%;bottom:12%;background:var(--pink);color:#22134d;border:2px solid #fff;border-radius:11px;padding:17px 22px;transform:rotate(-5deg);font:600 12px/1.35 "Manrope";box-shadow:7px 8px 0 #120d50}.tag b{font-weight:800}
footer{height:74px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font:700 10px "Manrope",sans-serif;letter-spacing:.14em;color:#cbc7ef}@keyframes pulse{50%{box-shadow:0 0 0 11px rgba(184,255,36,0)}}
@media(max-width:900px){header,footer,main{width:min(100% - 36px,700px)}header{height:88px}.brand img{width:156px}.status{font-size:9px}main{grid-template-columns:1fr;padding:54px 0}.copy{text-align:center;margin:auto}.eyebrow{margin-bottom:20px}h1{font-size:clamp(55px,15vw,84px)}.intro{font-size:17px}.actions{justify-content:center}.visual{height:520px;min-height:0;margin-top:10px}.card{width:min(360px,68%)}footer{height:auto;min-height:90px;padding:22px 0;gap:12px;flex-direction:column}.tag{right:5%}}
@media(max-width:520px){header{align-items:center}.status{max-width:105px;text-align:right}.visual{height:400px}.card{padding:24px;border-radius:22px}.card strong{font-size:62px}.card p{font-size:13px}.gate{transform:scale(.7);transform-origin:right center}.tag{font-size:9px;padding:12px 14px}.planet-one{width:52px;height:52px}.intro{margin-top:28px}.primary{width:100%;justify-content:space-between}.secondary{margin:auto}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
