:root { --ink:#101214; --lime:#d8ff3e; --paper:#f4f1ea; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; }
body { background:var(--ink); color:var(--paper); font-family:Inter,system-ui,sans-serif; }
.hero { min-height:100vh; padding:32px 6vw 28px; position:relative; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 78% 38%,#243029 0 12%,transparent 34%),linear-gradient(135deg,#111315 0%,#161a18 65%,#111315 100%); }
.nav,.footer { display:flex; justify-content:space-between; align-items:center; position:relative; z-index:3; font-size:11px; letter-spacing:.18em; font-weight:700; }
.brand { font-weight:800; font-size:18px; letter-spacing:.12em; display:flex; align-items:center; gap:10px; }
.dot { width:10px; height:10px; background:var(--lime); display:inline-block; border-radius:50%; box-shadow:0 0 20px #d8ff3e; }
.nav-note { color:#929992; }
.copy { position:relative; z-index:2; margin-top:13vh; max-width:720px; }
.eyebrow { color:var(--lime); text-transform:uppercase; letter-spacing:.2em; font-size:12px; font-weight:700; margin-bottom:24px; }
h1 { font-family:'Barlow Condensed',Impact,sans-serif; font-size:clamp(88px,17vw,210px); line-height:.78; letter-spacing:-.045em; margin:0; font-weight:800; }
h1 em { color:var(--lime); font-style:normal; }
.intro { color:#aeb5ae; font-size:16px; margin:34px 0 28px; }
.cta { display:inline-flex; align-items:center; gap:20px; color:var(--ink); background:var(--lime); padding:15px 18px 15px 22px; text-decoration:none; font-size:12px; font-weight:800; letter-spacing:.14em; transition:transform .2s ease,background .2s ease; }
.cta span { font-size:20px; line-height:12px; }.cta:hover { transform:translateY(-3px) rotate(-1deg); background:#f0ff9a; }
.orb { position:absolute; z-index:1; border-radius:50%; border:1px solid rgba(216,255,62,.32); transform:rotate(-22deg); }
.orb-one { width:min(48vw,640px); height:min(48vw,640px); right:-6vw; top:17%; box-shadow:inset 0 0 60px rgba(216,255,62,.05),0 0 80px rgba(216,255,62,.04); }
.orb-two { width:min(35vw,460px); height:min(35vw,460px); right:2vw; top:26%; border-color:rgba(244,241,234,.15); }
.footer { position:absolute; bottom:28px; left:6vw; right:6vw; color:#727972; }
.footer span:last-child { color:var(--lime); }
@media (max-width:600px) { .hero { padding:24px 24px 26px; } .nav-note { display:none; } .copy { margin-top:18vh; } .orb-one { width:90vw; height:90vw; right:-35vw; top:24%; } .orb-two { width:66vw; height:66vw; right:-10vw; top:34%; } .footer { left:24px; right:24px; bottom:26px; font-size:9px; } }