*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--void:#0A0E1A;--nebula:#141830;--star:#D0D4E0;--nova:#C8B888;--constellation:#7088B0;--pulsar:#4A60D0;--corona:#D0A050;--eclipse:rgba(74,96,208,0.08)}
html{scroll-behavior:smooth}
body{background:var(--void);color:var(--star);font-family:'DM Sans',sans-serif;font-weight:400;font-size:1rem;line-height:1.85;letter-spacing:0.01em;overflow-x:hidden}

.star-field{position:fixed;inset:0;pointer-events:none;z-index:0}

section{position:relative;z-index:1;width:100vw;min-height:100vh;padding:12vh 8vw}

/* Void */
.void{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3rem}
.domain{font-family:'DM Sans',sans-serif;font-weight:500;font-size:clamp(2.5rem,7vw,6rem);color:var(--nova);letter-spacing:-0.02em;text-align:center}
.orbital{width:120px;height:120px}
.orbit-draw{stroke-dasharray:400;stroke-dashoffset:400;animation:draw-orbit 4s ease forwards 1s}
@keyframes draw-orbit{to{stroke-dashoffset:0}}

/* Ascension */
.ascension{background:var(--nebula)}
.content-block{max-width:600px;margin:0 auto 8vh;display:flex;flex-direction:column;gap:1.5rem}
.constellation{width:120px;height:auto}
.pull-quote{font-size:clamp(1.5rem,3vw,2rem);color:var(--nova);border-left:2px solid var(--pulsar);padding-left:1.5rem;margin:1rem 0}

/* Zenith */
.zenith{display:flex;align-items:center;justify-content:center;min-height:100vh}
.central-diagram{text-align:center;max-width:500px}
.main-constellation{width:100%;height:auto}
.orbit-path{stroke-dasharray:320;stroke-dashoffset:320;transition:stroke-dashoffset 4s ease}
.central-diagram.visible .orbit-path{stroke-dashoffset:0}
.zenith-text{margin-top:2rem;color:var(--constellation);font-size:clamp(0.9rem,1.5vw,1.1rem)}

/* Descent */
.descent{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3rem;min-height:80vh}
.final-question{font-size:clamp(1.2rem,2.5vw,1.8rem);color:var(--star);text-align:center;max-width:500px}
.final-orbit{width:100px;height:100px}
.pulse-star{animation:pulse-glow 4s ease-in-out infinite}
@keyframes pulse-glow{0%,100%{opacity:0.3}50%{opacity:1}}

/* Fade in */
.fade-in{opacity:0;transform:translateY(20px);transition:opacity 1.8s cubic-bezier(0.25,0,0.25,1),transform 1.8s cubic-bezier(0.25,0,0.25,1)}
.fade-in.visible{opacity:1;transform:translateY(0)}

/* Nav labels */
.koan-num{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:0.75rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--constellation)}

@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important}
.fade-in{opacity:1;transform:none}
}