:root {
  --bg: #050509;
  --bg2: #0a0a12;
  --purple: #9b4dff;
  --purple2: #d34cff;
  --cyan: #20d9ff;
  --white: #f6f7ff;
  --muted: #a8aac0;
  --line: rgba(255,255,255,.12);
}

* { box-sizing: border-box; }
html, body { margin:0; min-height:100%; background:var(--bg); color:var(--white); }
body {
  font-family: Inter, system-ui, sans-serif;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 28% 30%, rgba(124,48,255,.16), transparent 30%),
    radial-gradient(circle at 78% 58%, rgba(0,208,255,.13), transparent 28%),
    linear-gradient(145deg, #030306 0%, #090913 50%, #030308 100%);
}

.noise {
  position:fixed; inset:0; pointer-events:none; z-index:20; opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}

.stars { position:fixed; inset:0; pointer-events:none; opacity:.65; }
.stars::before, .stars::after { content:""; position:absolute; width:2px; height:2px; border-radius:50%; background:#fff; }
.stars-a::before { box-shadow: 7vw 14vh #fff, 18vw 73vh #7f57ff, 30vw 21vh #fff, 41vw 84vh #7ddfff, 55vw 12vh #fff, 68vw 72vh #fff, 82vw 25vh #56dfff, 92vw 61vh #fff, 12vw 45vh #fff, 74vw 42vh #a56cff; }
.stars-a::after { box-shadow: 4vw 82vh #fff, 21vw 11vh #57e5ff, 36vw 61vh #fff, 49vw 33vh #fff, 63vw 91vh #9f54ff, 78vw 7vh #fff, 88vw 78vh #fff, 96vw 33vh #5ce9ff; }
.stars-b { filter:blur(.3px); opacity:.35; animation: drift 22s linear infinite alternate; }
.stars-b::before { box-shadow: 15vw 23vh #fff, 24vw 88vh #fff, 44vw 15vh #65dfff, 58vw 65vh #fff, 69vw 37vh #b561ff, 86vw 53vh #fff; }
@keyframes drift { to { transform:translate3d(1.5vw, -1vh, 0); } }

.hero {
  position:relative;
  min-height:calc(100vh - 58px);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px, .72fr);
  align-items:center;
  max-width:1440px;
  margin:auto;
  padding:64px clamp(24px, 5vw, 84px) 48px;
  isolation:isolate;
}

.hero::before {
  content:""; position:absolute; left:3%; right:3%; top:7%; bottom:6%;
  border:1px solid rgba(255,255,255,.06); border-radius:34px; z-index:-1;
  background:linear-gradient(145deg, rgba(255,255,255,.025), rgba(255,255,255,.005));
  backdrop-filter:blur(2px);
}

.orb { position:absolute; border-radius:50%; filter:blur(70px); opacity:.32; z-index:-2; }
.orb-purple { width:380px; height:380px; left:-70px; top:15%; background:var(--purple); }
.orb-cyan { width:360px; height:360px; right:-80px; bottom:10%; background:var(--cyan); }

.content { position:relative; z-index:3; max-width:760px; }
.status {
  display:inline-flex; align-items:center; gap:10px; padding:9px 14px; border:1px solid rgba(157,86,255,.34);
  border-radius:999px; color:#d6c4ff; font:600 11px/1 Orbitron, sans-serif; letter-spacing:.16em;
  background:rgba(95,41,172,.12); box-shadow:inset 0 0 20px rgba(129,63,255,.06);
}
.status-dot { width:7px; height:7px; border-radius:50%; background:var(--purple2); box-shadow:0 0 14px var(--purple2); animation:blink 1.8s ease-in-out infinite; }
@keyframes blink { 50% { opacity:.3; transform:scale(.72); } }

.logo-wrap { position:relative; width:min(350px, 66vw); margin:22px 0 18px; overflow:hidden; border-radius:50%; filter:drop-shadow(0 0 30px rgba(151,64,255,.23)); }
.hero-logo { display:block; width:100%; height:auto; mix-blend-mode:screen; animation:float 6s ease-in-out infinite; }
@keyframes float { 50% { transform:translateY(-8px) scale(1.008); } }
.scanline { position:absolute; z-index:2; inset:0; background:linear-gradient(180deg, transparent 0 47%, rgba(74,221,255,.28) 50%, transparent 53%); transform:translateY(-110%); animation:scan 5.5s linear infinite; pointer-events:none; }
@keyframes scan { to { transform:translateY(110%); } }

.wordmark { width:min(500px, 78vw); max-height:190px; object-fit:contain; object-position:left center; margin:-58px 0 -22px -14px; mix-blend-mode:screen; filter:drop-shadow(0 0 16px rgba(85,171,255,.15)); }

h1 { margin:0; font:800 clamp(34px, 5.3vw, 76px)/.96 Orbitron, sans-serif; letter-spacing:-.04em; max-width:820px; }
h1 span { color:transparent; -webkit-text-stroke:1px #8eecff; text-shadow:0 0 26px rgba(42,210,255,.32); }
.lead { margin:22px 0 20px; color:var(--muted); font-size:clamp(15px,1.55vw,20px); line-height:1.7; max-width:650px; }
.lead strong { color:#fff; font-weight:700; }

.equalizer { height:30px; display:flex; align-items:end; gap:5px; margin:18px 0 22px; }
.equalizer i { display:block; width:4px; min-height:5px; border-radius:8px; background:linear-gradient(180deg,var(--cyan),var(--purple)); box-shadow:0 0 9px rgba(93,85,255,.6); animation:eq 1.1s ease-in-out infinite alternate; }
.equalizer i:nth-child(2n){animation-duration:.74s}.equalizer i:nth-child(3n){animation-duration:1.42s}.equalizer i:nth-child(4n){animation-delay:-.3s}
@keyframes eq { from {height:6px} to {height:29px} }

.coming-card {
  width:min(520px, 100%); display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:18px 20px; border:1px solid var(--line); border-radius:18px;
  background:linear-gradient(110deg, rgba(157,76,255,.10), rgba(30,205,255,.06));
  box-shadow:0 18px 70px rgba(0,0,0,.26), inset 0 0 24px rgba(255,255,255,.02);
}
.eyebrow { display:block; font:600 9px Orbitron,sans-serif; color:#9ea1b7; letter-spacing:.17em; margin-bottom:6px; }
.coming-card strong { font:700 clamp(20px,3vw,28px) Orbitron,sans-serif; letter-spacing:.08em; }
.pulse-ring { width:38px; height:38px; border-radius:50%; border:1px solid rgba(70,222,255,.38); display:grid; place-items:center; box-shadow:0 0 26px rgba(45,211,255,.16); }
.pulse-ring span { width:10px; height:10px; border-radius:50%; background:var(--cyan); box-shadow:0 0 18px var(--cyan); animation:pulse 1.8s ease-out infinite; }
@keyframes pulse { 70%,100% { box-shadow:0 0 0 15px rgba(32,217,255,0); } }
.microcopy { margin:18px 0 0; color:#6f7286; font:600 10px Orbitron,sans-serif; letter-spacing:.18em; }

.alien-panel { position:relative; align-self:stretch; display:flex; align-items:flex-end; justify-content:center; overflow:hidden; min-height:650px; }
.alien-panel::before { content:""; position:absolute; width:72%; aspect-ratio:1; border-radius:50%; border:1px solid rgba(101,215,255,.18); box-shadow:0 0 0 28px rgba(142,74,255,.025),0 0 90px rgba(57,191,255,.12), inset 0 0 70px rgba(143,64,255,.08); top:20%; left:17%; }
.alien-panel img { width:178%; max-width:none; transform:translateX(-16%) translateY(7%); mix-blend-mode:screen; filter:drop-shadow(0 0 30px rgba(95,62,255,.19)); opacity:.92; }

footer { height:58px; border-top:1px solid rgba(255,255,255,.07); display:flex; justify-content:space-between; align-items:center; padding:0 clamp(24px,5vw,84px); color:#66697a; font:600 9px Orbitron,sans-serif; letter-spacing:.14em; }
.footer-signal { display:flex; align-items:center; gap:8px; }
.footer-signal b { width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 12px var(--cyan); }

@media (max-width: 980px) {
  .hero { grid-template-columns:1fr; text-align:center; padding-top:40px; min-height:auto; }
  .content { margin:auto; display:flex; flex-direction:column; align-items:center; }
  .wordmark { object-position:center; margin:-48px auto -14px; }
  .alien-panel { min-height:390px; margin-top:-10px; opacity:.72; }
  .alien-panel img { width:120%; transform:translateX(0) translateY(19%); }
  .alien-panel::before { width:50%; left:25%; top:22%; }
  .lead { max-width:700px; }
}

@media (max-width: 620px) {
  .hero { padding:28px 18px 28px; }
  .hero::before { left:10px; right:10px; top:12px; bottom:12px; border-radius:24px; }
  .logo-wrap { width:min(290px,72vw); }
  .wordmark { width:96vw; margin:-52px auto -8px; }
  h1 { font-size:clamp(32px,11.3vw,50px); }
  .lead br { display:none; }
  .coming-card { text-align:left; }
  .alien-panel { min-height:310px; }
  .alien-panel img { width:155%; transform:translateX(-1%) translateY(22%); }
  footer { flex-direction:column; justify-content:center; gap:7px; height:76px; text-align:center; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; }
}


.contact-strip {
  width:min(620px, 100%);
  margin-top:22px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:15px 18px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:rgba(7,7,15,.48);
  backdrop-filter:blur(10px);
  box-shadow:inset 0 0 28px rgba(132,74,255,.04);
}
.contact-link {
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:5px;
  color:var(--white);
  text-decoration:none;
  transition:transform .2s ease, text-shadow .2s ease;
}
.contact-link:hover {
  transform:translateY(-2px);
  text-shadow:0 0 16px rgba(82,218,255,.35);
}
.contact-label {
  color:#777b91;
  font:600 8px Orbitron,sans-serif;
  letter-spacing:.18em;
}
.contact-link strong {
  font:600 clamp(12px,1.4vw,15px) Orbitron,sans-serif;
  letter-spacing:.04em;
  overflow-wrap:anywhere;
}
.contact-link:first-child strong { color:#d8c6ff; }
.contact-link:last-child strong { color:#bcefff; }
.contact-separator {
  width:1px;
  height:32px;
  background:linear-gradient(180deg, transparent, rgba(155,77,255,.65), rgba(32,217,255,.65), transparent);
}

@media (max-width: 620px) {
  .contact-strip {
    flex-direction:column;
    gap:12px;
    padding:16px;
  }
  .contact-separator {
    width:100%;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(155,77,255,.65), rgba(32,217,255,.65), transparent);
  }
  .contact-link { width:100%; align-items:center; text-align:center; }
}