:root { --ink: #071120; --muted: #9fa9b7; --cyan: #24d8ef; --orange: #f36913; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: #f7fbff; background: var(--ink); font-family: Manrope, sans-serif; }
.page-shell { isolation: isolate; min-height: 100svh; overflow: hidden; position: relative; padding: 28px clamp(24px, 6vw, 96px) 22px; display: flex; flex-direction: column; }
.grid { position: absolute; inset: 0; z-index: -3; opacity: .32; background-image: linear-gradient(rgba(117, 153, 179, .09) 1px, transparent 1px), linear-gradient(90deg, rgba(117, 153, 179, .09) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom, black, transparent 88%); }
.orb { position: absolute; z-index: -2; border-radius: 50%; filter: blur(15px); opacity: .18; }
.orb-cyan { background: #00d4ff; width: 42vw; height: 42vw; right: -17vw; top: 10vh; }
.orb-orange { background: #f36913; width: 23vw; height: 23vw; left: -14vw; bottom: -9vw; }
.site-header, footer { display: flex; align-items: center; justify-content: space-between; }
.brand { width: min(192px, 42vw); display: block; }
.brand img { display: block; width: 100%; height: auto; mix-blend-mode: screen; }
.contact-link { color: #d4e1eb; font-size: .84rem; font-weight: 700; text-decoration: none; letter-spacing: .02em; }
.contact-link span { color: var(--cyan); font-size: 1.1rem; padding-left: 4px; }
.hero { flex: 1; display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(44px, 7vw, 130px); align-items: center; padding: clamp(64px, 12vh, 140px) 0 56px; }
.eyebrow { color: #b9cad7; text-transform: uppercase; font: 500 .66rem/1.4 "DM Mono", monospace; letter-spacing: .16em; margin: 0 0 26px; display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 31px; height: 1px; background: var(--orange); }
h1 { max-width: 750px; margin: 0; font-size: clamp(3.2rem, 6.4vw, 7rem); letter-spacing: -.074em; line-height: .95; font-weight: 800; }
h1 em { font-style: normal; color: var(--orange); } h1 strong { color: var(--cyan); font-weight: 800; }
.intro { color: var(--muted); max-width: 530px; font-size: clamp(.95rem, 1.2vw, 1.08rem); line-height: 1.75; margin: 30px 0; }
.notify-form { display: flex; width: min(100%, 460px); padding: 5px; border: 1px solid rgba(140, 166, 186, .33); background: rgba(7, 17, 32, .58); border-radius: 8px; backdrop-filter: blur(12px); }
.notify-form input { min-width: 0; flex: 1; padding: 12px 14px; outline: 0; border: 0; color: #fff; font: 500 .88rem Manrope, sans-serif; background: transparent; }
.notify-form input::placeholder { color: #8190a0; }
.notify-form button { cursor: pointer; white-space: nowrap; border: 0; border-radius: 5px; padding: 12px 16px; font: 800 .78rem Manrope, sans-serif; color: #04131d; background: var(--cyan); transition: transform .2s, background .2s; }
.notify-form button:hover { transform: translateY(-2px); background: #7deefa; }
.notify-form button:disabled { cursor: wait; opacity: .7; transform: none; }
.notify-form button span { padding-left: 7px; font-size: 1rem; }.form-note { color: #758494; margin: 10px 0 0; font: .68rem "DM Mono", monospace; }
.launch-panel { padding: 14px; border: 1px solid rgba(93, 142, 174, .32); border-radius: 11px; background: linear-gradient(135deg, rgba(18, 37, 57, .72), rgba(8, 17, 31, .35)); box-shadow: 0 28px 70px rgba(0,0,0,.25); transform: rotate(2deg); }
.panel-topline, .launch-caption { color: #91a5b7; display: flex; justify-content: space-between; padding: 4px 3px 12px; font: 500 .59rem "DM Mono", monospace; letter-spacing: .08em; }
.live-dot { color: #d8eef2; }.live-dot::before { content: ""; display: inline-block; vertical-align: 1px; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 10px var(--orange); }
.video-wrap { position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: #0a1728; }.video-wrap video { position: relative; z-index: 1; width: 100%; height: 100%; display: block; object-fit: cover; }.video-glow { position: absolute; z-index: 2; width: 46%; height: 46%; right: -12%; bottom: -19%; background: var(--cyan); filter: blur(34px); opacity: .25; pointer-events: none; }
.launch-caption { align-items: center; padding: 13px 3px 2px; color: #c6d4df; font-size: .66rem; }.arrow { color: var(--cyan); font-size: 1.35rem; }
footer { color: #718092; font: .61rem "DM Mono", monospace; letter-spacing: .055em; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 780px) { .page-shell { padding: 22px 24px 18px; }.hero { grid-template-columns: 1fr; gap: 56px; padding: 78px 0 55px; }.launch-panel { width: min(100%, 500px); justify-self: center; transform: rotate(1deg); }.contact-link { font-size: .76rem; } footer span:last-child { display: none; } }
@media (max-width: 430px) { h1 { font-size: 3.15rem; }.notify-form { display: block; padding: 7px; }.notify-form input { width: 100%; }.notify-form button { width: 100%; }.intro { margin: 24px 0; } }