.hero{isolation:isolate;background-image:none;background:#030408;min-height:700px}
.hero::before,.hero::after{border-color:#252935;z-index:3}
#space-canvas,.space-haze{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-2}
.space-haze{z-index:-1;background:radial-gradient(ellipse at 50% 45%,rgba(43,48,91,.12),transparent 62%),linear-gradient(180deg,transparent 55%,#030303);opacity:.8}
.hero h1{z-index:1;margin-top:0;margin-bottom:40px;font-size:clamp(52px,20vw,220px);line-height:1.3;transform:translateY(-75px)}
.hero h1 canvas{inset:-75px 0;width:100%;height:calc(100% + 150px)}
.hero-intro{position:relative;z-index:2;font-size:22px;color:#99999f;line-height:1.45;transform:translateY(-75px)}
.hero-tags{z-index:3;top:80px}
.hero-tags span{background:#080a1280;border-color:#222632;color:#737986;animation:status-drift 18s ease-in-out infinite}
.hero-tags span:last-child{color:#9199c8;animation-delay:-9s}
.ambient-controls{position:absolute;left:35px;bottom:45px;z-index:4;display:flex;flex-direction:column;align-items:flex-start;gap:9px}
#sound-toggle{cursor:pointer;background:transparent;color:#9297aa;border:1px solid #303442;border-radius:20px;padding:8px 13px;font:11px var(--mono);transition:color 1s,border-color 1s,background 1s;min-height:36px}
#sound-toggle:hover,#sound-toggle[aria-pressed=true]{color:#c6cbed;border-color:#6b7095;background:#10121c}
#sound-note{font:10px/1.5 var(--mono);color:#686e7d;max-width:155px}
.space-coordinate{position:absolute;right:35px;bottom:58px;font:10px var(--mono);letter-spacing:.07em;color:#666d7e;animation:status-drift 23s ease-in-out infinite}
.scroll-link{z-index:4;bottom:51px;color:#818593;transition:color 1s,border-color 1s}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes status-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:760px){.hero{min-height:660px}.hero-tags{top:64px}.hero-intro{font-size:17px}.ambient-controls{left:15px;bottom:27px}#sound-note{font-size:9px;max-width:125px}.space-coordinate{right:15px;bottom:40px;font-size:9px}.scroll-link{bottom:108px}.hero h1{margin-bottom:25px}}
@media(prefers-reduced-motion:reduce){.hero-tags span,.space-coordinate{animation:none}#sound-toggle,.scroll-link{transition:none}}
.audio-credit{font:9px/1.4 var(--mono);color:var(--muted);opacity:.7}.audio-credit:hover{opacity:1;color:var(--accent)}
