:root{--bg:#03070f;--panel:#07111f;--blue:#18a8ff;--blue2:#58c7ff;--muted:#92a7bb}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#f5fbff;background:radial-gradient(circle at 70% 15%,rgba(0,113,255,.12),transparent 28rem),#03070f;font-family:Inter,system-ui,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}
.navbar{position:fixed;z-index:50;top:0;left:0;right:0;height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:rgba(3,7,15,.65);border-bottom:1px solid rgba(255,255,255,.06);backdrop-filter:blur(20px)}
.brand{display:flex;align-items:center;gap:11px;font-family:"Space Grotesk";font-weight:700;letter-spacing:.08em}.brand-icon{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(88,199,255,.5);border-radius:10px;color:var(--blue2)}.brand b{color:var(--blue2)}
.nav-links{display:flex;gap:30px;color:#b7c9d9;font-size:14px}.nav-links a:hover{color:#fff}.nav-button{padding:11px 17px;border-radius:10px;font-size:13px;font-weight:700;background:linear-gradient(135deg,#19a9ff,#006eff);box-shadow:0 12px 35px rgba(0,110,255,.22)}.menu-toggle{display:none;background:none;color:#fff;border:0;font-size:26px}
.hero{min-height:860px;height:100vh;position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(180deg,rgba(1,8,18,.18),rgba(1,5,11,.92) 82%),radial-gradient(ellipse at 50% 55%,rgba(0,119,255,.15),transparent 55%),#030913}
.stars{position:absolute;inset:0;background-image:radial-gradient(1px 1px at 12% 20%,#fff,transparent),radial-gradient(1px 1px at 24% 32%,#fff,transparent),radial-gradient(1px 1px at 39% 15%,#7fd8ff,transparent),radial-gradient(1px 1px at 51% 28%,#fff,transparent),radial-gradient(1px 1px at 68% 13%,#fff,transparent),radial-gradient(1px 1px at 83% 25%,#7fd8ff,transparent),radial-gradient(1px 1px at 90% 11%,#fff,transparent);opacity:.65}
.moon{position:absolute;right:13%;top:15%;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f1fbff 0 30%,#bde9ff 58%,#6ecbff 100%);box-shadow:0 0 80px rgba(75,190,255,.33)}.moon:after{content:"";position:absolute;width:125px;height:125px;border-radius:50%;background:#030913;left:27px;top:-8px}
.hero-content{position:relative;z-index:6;max-width:960px;text-align:center;padding:100px 25px 180px}.eyebrow,.section-label{color:var(--blue2);font-weight:800;letter-spacing:.16em;font-size:11px}.eyebrow{display:flex;justify-content:center;align-items:center;gap:10px;margin-bottom:24px}.eyebrow span{width:40px;height:1px;background:linear-gradient(90deg,transparent,var(--blue))}
.hero h1{margin:0;font:700 clamp(4rem,9vw,7.8rem)/.88 "Space Grotesk";letter-spacing:-.065em}.hero h1 span,h2 span{color:var(--blue2);text-shadow:0 0 35px rgba(24,168,255,.2)}.hero p{max-width:650px;margin:30px auto 0;color:#a8bbcc;font-size:18px;line-height:1.8}
.hero-actions{display:flex;gap:12px;justify-content:center;margin-top:34px;flex-wrap:wrap}.primary-button,.secondary-button{display:inline-flex;gap:12px;align-items:center;justify-content:center;padding:14px 20px;border-radius:12px;font-weight:800;font-size:14px;transition:.2s}.primary-button{background:linear-gradient(135deg,#19a9ff,#006eff);box-shadow:0 12px 35px rgba(0,110,255,.22);border:1px solid rgba(125,219,255,.35)}.secondary-button{border:1px solid rgba(140,205,255,.2);background:rgba(255,255,255,.04)}.primary-button:hover,.secondary-button:hover,.nav-button:hover{transform:translateY(-2px)}
.skyline{position:absolute;left:0;right:0;bottom:0;height:31%;display:flex;align-items:end;justify-content:space-around;padding:0 1%;z-index:3}.building{position:relative;background:linear-gradient(180deg,#0a1728,#02060c);border:1px solid rgba(56,145,215,.11);border-bottom:0;box-shadow:inset 0 0 35px rgba(0,90,180,.08);width:12%;min-width:68px}.b1{height:48%}.b2{height:74%}.b3{height:41%}.b4{height:85%}.b5{height:57%}.b6{height:69%}.b7{height:50%}.building:before{content:"";position:absolute;left:25%;right:25%;top:-10px;height:10px;background:#0d2036}.building i{position:relative;display:inline-block;width:6px;height:8px;margin:8px 5px;background:rgba(58,190,255,.38);box-shadow:0 0 8px rgba(58,190,255,.2)}.road-light{position:absolute;bottom:0;height:4px;width:100%;background:linear-gradient(90deg,transparent,#0e86ff,#4ccfff,#0e86ff,transparent);box-shadow:0 0 30px rgba(0,139,255,.5)}.hero-fade{position:absolute;left:0;right:0;bottom:0;height:25%;z-index:4;background:linear-gradient(transparent,#03070f)}
.section{width:min(1180px,90vw);margin:auto;padding:130px 0}.dark-section{width:100%;max-width:none;padding-left:max(5vw,calc((100vw - 1180px)/2));padding-right:max(5vw,calc((100vw - 1180px)/2));background:linear-gradient(135deg,rgba(5,17,31,.9),rgba(3,8,16,.82));border-block:1px solid rgba(108,196,255,.08)}
.section-heading{max-width:780px}.center{margin:0 auto 55px;text-align:center}.section-heading h2,.story-copy h2,.join-content h2{margin:14px 0 16px;font:700 clamp(2.5rem,5vw,4.3rem)/1.03 "Space Grotesk";letter-spacing:-.05em}.section-heading p,.story-copy p,.join-content p{color:var(--muted);line-height:1.85;font-size:16px}
.about-grid{margin-top:55px;display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:18px}.about-card,.feature-card{position:relative;padding:31px;min-height:250px;background:linear-gradient(145deg,rgba(12,32,53,.8),rgba(5,15,26,.8));border:1px solid rgba(91,182,255,.15);border-radius:22px;overflow:hidden}.about-card:before,.feature-card:before,.join-box:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(24,168,255,.14),transparent 36%);pointer-events:none}.large-card{min-height:300px}.card-number{position:absolute;right:22px;top:19px;color:rgba(129,203,255,.18);font:700 28px "Space Grotesk"}.icon-box{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:rgba(24,168,255,.08);border:1px solid rgba(88,199,255,.2)}.about-card h3,.feature-card h3{font:700 23px "Space Grotesk";margin:23px 0 10px}.about-card p,.feature-card p{color:var(--muted);line-height:1.75}
.story{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:90px}.story-visual{min-height:480px;display:grid;place-items:center;position:relative;border:1px solid rgba(88,199,255,.11);border-radius:32px;overflow:hidden;background:radial-gradient(circle,rgba(0,123,255,.15),transparent 55%),#040d19}.story-city{text-align:center;font:700 clamp(2.8rem,7vw,5.8rem)/.8 "Space Grotesk";letter-spacing:-.08em}.story-city span{color:var(--blue2)}.orbit{position:absolute;border:1px solid rgba(83,193,255,.13);border-radius:50%}.orbit-one{width:80%;height:36%;transform:rotate(-18deg)}.orbit-two{width:62%;height:70%;transform:rotate(48deg)}.spark{position:absolute;color:#79d8ff;text-shadow:0 0 18px #18a8ff;animation:float 4s ease-in-out infinite}.s1{top:24%;left:22%}.s2{right:20%;bottom:24%;animation-delay:1s}.s3{right:28%;top:18%;animation-delay:2s}@keyframes float{50%{transform:translateY(-12px) scale(1.12)}}.story-copy{max-width:650px}.story-line{margin-top:32px;display:flex;align-items:center;gap:13px;color:#c8e9ff;font-weight:700}.story-line span{width:42px;height:2px;background:#18a8ff;box-shadow:0 0 15px #18a8ff}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card{min-height:230px}.feature-icon{font-size:27px}
.join{padding-top:120px;padding-bottom:135px}.join-box{position:relative;overflow:hidden;padding:60px;border-radius:30px;border:1px solid rgba(88,199,255,.18);background:radial-gradient(circle at 90% 15%,rgba(0,122,255,.2),transparent 28%),linear-gradient(145deg,#081a2e,#040b15);box-shadow:0 35px 100px rgba(0,0,0,.25)}.join-content{max-width:750px}.steps{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:42px 0 28px}.step{display:flex;gap:18px;align-items:flex-start;padding:22px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.06);border-radius:16px}.step>span{color:var(--blue2);font:700 14px "Space Grotesk"}.step h3{margin:0 0 6px;font:700 17px "Space Grotesk"}.step p{margin:0;color:#8399ad;font-size:13px;line-height:1.6}
.cta{text-align:center;padding:130px 20px;border-top:1px solid rgba(88,199,255,.08);background:radial-gradient(circle at center,rgba(0,119,255,.12),transparent 50%)}.cta h2{font:700 clamp(3rem,7vw,6rem)/1 "Space Grotesk";letter-spacing:-.06em;margin:16px 0}.cta p{color:var(--muted);margin:0 auto 30px;max-width:600px;line-height:1.8}
footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:28px 5vw;border-top:1px solid rgba(255,255,255,.06);color:#73899e;font-size:13px}.footer-brand{color:#d9eefc;font:700 15px "Space Grotesk";letter-spacing:.08em}.footer-brand span{color:#18a8ff}.reveal{opacity:0;transform:translateY(25px);transition:opacity .7s,transform .7s}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.nav-links,.nav-button{display:none}.menu-toggle{display:block}.navbar.menu-open .nav-links{position:absolute;display:flex;flex-direction:column;top:70px;left:0;right:0;background:rgba(3,7,15,.97);padding:10px 5vw 20px;border-bottom:1px solid rgba(255,255,255,.08)}.navbar.menu-open .nav-links a{padding:15px 0;border-bottom:1px solid rgba(255,255,255,.05)}.moon{right:6%;top:16%;width:82px;height:82px}.moon:after{width:87px;height:87px}.about-grid,.feature-grid{grid-template-columns:1fr 1fr}.story{grid-template-columns:1fr;gap:45px}}
@media(max-width:620px){.hero{min-height:760px}.hero h1{font-size:clamp(3.5rem,18vw,5.5rem)}.hero p{font-size:15px}.about-grid,.feature-grid,.steps{grid-template-columns:1fr}.section{padding:90px 0}.dark-section{padding-left:5vw;padding-right:5vw}.join-box{padding:32px 22px}.story-visual{min-height:330px}.skyline{height:25%}footer{flex-direction:column;text-align:center}}