.opening-aura { position: fixed; inset: 0; z-index: 100; isolation: isolate; overflow: hidden; display: grid; place-items: center; padding: 26px; background: #030907; color: #f3fff7; opacity: 1; transition: opacity 480ms ease, visibility 480ms; }
.opening-aura[hidden] { display: none; }
.opening-aura.is-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.opening-depth { position: absolute; inset: 0; perspective: 850px; overflow: hidden; background: radial-gradient(ellipse at 50% 42%, #34534940, transparent 55%), #030907; }
.opening-foundation.aura-formation { position: absolute; inset: 3% 0 0; width: 100%; height: 94%; border: 0; border-radius: 0; box-shadow: none; background: transparent; opacity: 1; cursor: default; pointer-events: none; transform: translateZ(-130px) rotateX(9deg); filter: brightness(1.3) drop-shadow(0 0 4px #ffffff45); }
.opening-foundation::before { display: none; }
.matrix-nebula { position: absolute; inset: -20%; background: radial-gradient(ellipse at 28% 38%, #bedfff16, transparent 34%), radial-gradient(ellipse at 70% 60%, #ffffff0d, transparent 32%); filter: blur(32px); transform: translateZ(-300px) rotate(-18deg); }
.matrix-stars { position: absolute; inset: 0; opacity: .55; background-image: radial-gradient(circle at 12% 22%, #fff 0 1px, transparent 2px), radial-gradient(circle at 78% 16%, #fff 0 .6px, transparent 2px), radial-gradient(circle at 88% 71%, #e4f2ff 0 1px, transparent 2px), radial-gradient(circle at 23% 84%, #fff 0 .7px, transparent 2px), radial-gradient(circle at 61% 91%, #fff 0 .5px, transparent 2px); transform: translateZ(-420px) scale(1.4); }
.matrix-depth-light { position: absolute; inset: 8% 0; pointer-events: none; background: radial-gradient(ellipse at 50% 48%, transparent 24%, #03090766 65%, #030907 94%); box-shadow: none; }
.opening-copy { position: relative; z-index: 2; width: min(620px, 100%); text-align: center; padding: 30px 12px; text-shadow: 0 2px 24px #000; background: radial-gradient(ellipse, #030907af, transparent 72%); }
.opening-brand { font-size: .65rem; letter-spacing: .3em; color: #c9ddd0; }
.opening-copy h1 { min-height: 5.7em; margin: 26px 0 12px; font-size: clamp(1.15rem, 3.7vw, 2rem); line-height: 1.65; font-weight: 400; letter-spacing: -.035em; text-transform: none; }
.opening-slogan { display: block; }
.slogan-line { display: block; min-height: 1.65em; text-wrap: balance; }
.slogan-quiet { color: #b9ccc2; font-size: .8em; }
.slogan-brand { color: #fff; font-weight: 650; letter-spacing: -.06em; }
.slogan-connect { color: #fff; font-weight: 500; }
.slogan-nodes { color: #f1fff6; font-weight: 650; text-shadow: 0 0 18px #e3ffef55; }
.slogan-matrix { color: #a5bdaf; font-size: .65em; letter-spacing: .15em; }
.opening-state { font-size: .67rem; color: #c1d3c7; letter-spacing: .1em; }
.opening-aura:focus { outline: none; }
.opening-copy { max-height: calc(100% - 48px - env(safe-area-inset-bottom, 0px)); overflow-y: auto; }
.opening-accessible { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.opening-aura { background: #030907; }
.opening-depth { background: #030907; }
.matrix-nebula { inset: auto; left: 50%; top: 50%; width: min(82vw, 82vh); height: min(82vw, 82vh); border-radius: 50%; background: radial-gradient(ellipse at 46% 44%, #b5ffdb05 18%, #61dfa91d 35%, #28b97922 46%, #92f9c811 57%, transparent 73%); filter: blur(20px); transform: translate(-50%, -50%) translateZ(-110px); pointer-events: none; }
.matrix-depth-light { background: radial-gradient(ellipse at 50% 48%, transparent 24%, #03090766 65%, #030907 94%); }
.opening-copy { background: radial-gradient(ellipse, #0309079c, transparent 72%); }
.opening-brand-small { font-size: .5em; letter-spacing: .12em; text-transform: none; }
@media (prefers-reduced-motion: reduce) { .opening-aura { transition: none; } .opening-foundation.aura-formation { transform: none; } }