:root {
  color-scheme: dark;
  --electric: #202da3;
  --blue: #2a599d;
  --coral: #ed4a4a;
  --ink: #030711;
  --white: #f8fbff;
  --muted: #8c9bb9;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--ink); }
body {
  min-height: 100svh;
  margin: 0;
  overflow-x: hidden;
  color: var(--white);
  font-family: Inter, "Helvetica Neue", Arial, sans-serif;
  background:
    radial-gradient(ellipse 50% 37% at 50% 43%, rgba(29, 48, 133, .36), transparent 78%),
    radial-gradient(ellipse 37% 60% at 18% 24%, rgba(16, 43, 114, .3), transparent 72%),
    radial-gradient(ellipse 32% 35% at 86% 75%, rgba(93, 14, 32, .22), transparent 72%),
    linear-gradient(145deg, #03050b 10%, #050916 56%, #06030b 100%);
}
::selection { background: var(--coral); color: #fff; }
.visual-noise {
  position: fixed; z-index: 0; pointer-events: none; inset: 0; opacity: .26;
  background-image: radial-gradient(rgba(135, 166, 242, .18) .6px, transparent .6px);
  background-size: 7px 7px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 80%, transparent);
  mask-image: linear-gradient(to bottom, transparent 0%, #000 18%, #000 80%, transparent);
}
.stage-glow { position: fixed; z-index: 0; pointer-events: none; filter: blur(68px); border-radius: 50%; opacity: .3; }
.stage-glow--blue { left: -150px; top: 18%; width: min(37vw, 510px); height: 28vw; min-height: 220px; background: #1643cf; }
.stage-glow--red { right: -150px; bottom: 7%; width: min(36vw, 470px); height: 25vw; min-height: 180px; background: #802333; opacity: .21; }
.laser { position: fixed; z-index: 0; pointer-events: none; width: 75vw; height: 1px; opacity: .25; transform-origin: center; }
.laser--one { left: -40vw; top: 39%; transform: rotate(-23deg); background: linear-gradient(90deg, transparent, #1c58ff 52%, transparent); }
.laser--two { right: -47vw; bottom: 27%; transform: rotate(-23deg); background: linear-gradient(90deg, transparent, var(--coral) 52%, transparent); }
.shell { position: relative; z-index: 1; min-height: 100svh; width: min(100%, 1600px); margin: 0 auto; padding: 28px clamp(20px, 4.2vw, 68px) 24px; display: flex; flex-direction: column; }
.masthead, .footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; font-size: clamp(9px, .78vw, 12px); font-weight: 800; letter-spacing: .27em; text-transform: uppercase; }
.masthead { color: #b9c6df; }
.masthead__left { display: flex; align-items: center; gap: 10px; }
.masthead__square { display: inline-block; width: 9px; height: 9px; background: var(--coral); transform: rotate(45deg); box-shadow: 0 0 18px rgba(237,74,74,.7); }
.masthead__right { color: rgba(188, 204, 233, .55); }
.separ { color: var(--coral); margin: 0 5px; }
.main { display: flex; flex: 1; align-items: center; justify-content: center; }
.hero { position: relative; width: 100%; padding-top: min(3.5vh, 34px); padding-bottom: min(3vh, 26px); display: flex; flex-direction: column; align-items: center; text-align: center; isolation: isolate; }
.hero__halo { position: absolute; z-index: -1; width: 60vw; max-width: 850px; aspect-ratio: 1; top: 50%; left: 50%; transform: translate(-50%, -54%); border-radius: 50%; border: 1px solid rgba(39, 80, 200, .1); box-shadow: inset 0 0 60px rgba(27, 45, 131, .07), 0 0 80px rgba(16,40,124,.06); }
.hero__halo::before, .hero__halo::after { content: ""; position: absolute; border-radius: 50%; inset: 9%; border: 1px solid rgba(39, 80, 200, .12); }
.hero__halo::after { inset: 19%; border-color: rgba(237, 74, 74, .08); }
.hero__art { width: min(93vw, 980px); position: relative; z-index: 1; }
.hero__logo { display: block; width: 100%; height: auto; filter: drop-shadow(0 28px 55px rgba(9, 32, 130, .16)); animation: reveal .95s cubic-bezier(.2, .6, .12, 1) both; }
.eyebrow { display: flex; align-items: center; gap: 12px; margin: -14px 0 26px; color: #cbd9f4; font-size: clamp(10px, .84vw, 13px); font-weight: 700; letter-spacing: .29em; text-transform: uppercase; animation: rise .9s .25s both; }
.live-dot { width: 7px; height: 7px; display: inline-block; background: var(--coral); border-radius: 50%; box-shadow: 0 0 15px var(--coral); animation: pulse 1.8s infinite; }
.eyebrow__line { display: inline-block; width: 32px; height: 1px; background: rgba(237, 74, 74, .64); }
h1 { position: relative; margin: 0; color: #f9fbff; font-size: clamp(54px, 9vw, 138px); line-height: .94; letter-spacing: -.085em; font-weight: 900; white-space: nowrap; text-shadow: 0 1px 30px rgba(147, 178, 255, .15); animation: rise .9s .34s both; }
h1 span:first-child { margin-left: .12em; color: var(--coral); text-shadow: 0 0 45px rgba(237, 74, 74, .13); }
h1 .heading-period { color: #3b6cff; }
.hero__subhead { margin: 25px 0 0; color: var(--muted); font-size: clamp(14px, 1.22vw, 17px); line-height: 1.5; letter-spacing: .025em; font-weight: 450; animation: rise .9s .43s both; }
.hero__subhead strong { color: #dae5fc; font-weight: 600; }
.equalizer { height: 46px; display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 19px; animation: rise .9s .5s both; }
.equalizer span { display: block; height: var(--h); width: 3px; border-radius: 99px; background: linear-gradient(to top, #263d9b, #598cf8 60%, var(--coral)); opacity: .8; animation: beat 1.3s var(--d) ease-in-out infinite alternate; }
.footer { color: #7888a8; }
.footer__center { display: flex; gap: 5px; align-items: center; }
.footer__dash { display: inline-block; width: 18px; height: 2px; background: #2d3e65; transform: skew(-26deg); }
.footer__dash:nth-child(2) { background: var(--electric); }
.footer__dash:nth-child(3) { background: var(--coral); }
.footer__arrow { display: inline-block; margin-left: 8px; color: var(--coral); font-size: 14px; }
@keyframes pulse { 0%, 100% { opacity: 1; box-shadow: 0 0 15px rgba(237,74,74,.6); } 50% { opacity: .5; box-shadow: 0 0 5px rgba(237,74,74,.25); } }
@keyframes beat { from { transform: scaleY(.5); opacity: .55; } to { transform: scaleY(1.2); opacity: .95; } }
@keyframes reveal { from { opacity: 0; transform: translateY(16px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 700px) {
  .shell { padding: 23px 22px 19px; }
  .masthead, .footer { letter-spacing: .16em; font-size: 9px; }
  .masthead__right { display: none; }
  .hero { padding-top: 9vh; }
  .hero__art { width: 100vw; max-width: none; margin-left: 0; margin-right: 0; }
  .hero__halo { width: 100vw; }
  .eyebrow { font-size: 9px; gap: 9px; margin-top: -3px; margin-bottom: 23px; letter-spacing: .19em; }
  .eyebrow__line { width: 18px; }
  h1 { font-size: clamp(48px, 11.6vw, 78px); letter-spacing: -.072em; }
  .hero__subhead { max-width: 300px; margin-top: 20px; font-size: 14px; }
  .hero__subhead strong { display: block; }
  .equalizer { margin-top: 24px; }
  .footer__center { display: none; }
  .stage-glow--blue { left: -130px; width: 320px; height: 320px; }
  .stage-glow--red { right: -150px; width: 300px; height: 300px; }
}
@media (max-height: 610px) and (min-width: 701px) {
  .hero { padding-top: 0; padding-bottom: 0; }
  .hero__art { width: min(70vw, 780px); }
  .eyebrow { margin-top: -17px; margin-bottom: 17px; }
  h1 { font-size: clamp(44px, 8vh, 85px); }
  .hero__subhead { margin-top: 15px; }
  .equalizer { margin-top: 5px; height: 30px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } }