/* VIBE LAB 560 — orbital typography. Decorative only; the content stays readable. */
.slide.cosmic-ready{perspective:1200px;isolation:isolate}
.slide.cosmic-ready .cosmic-title,.slide.cosmic-ready .cosmic-kicker,.slide.cosmic-ready .cosmic-copy,.slide.cosmic-ready .cosmic-item{will-change:transform,opacity,filter}
.slide.cosmic-ready.active .cosmic-kicker{animation:cosmicSignal .78s cubic-bezier(.18,.8,.25,1) var(--cosmic-delay,60ms) both}
.slide.cosmic-ready.active .cosmic-title{animation:cosmicTitle 1.28s cubic-bezier(.13,.86,.22,1) var(--cosmic-delay,110ms) both}
.slide.cosmic-ready.active .cosmic-copy{animation:cosmicCopy 1s cubic-bezier(.2,.75,.24,1) var(--cosmic-delay,260ms) both}
.slide.cosmic-ready.active .cosmic-item{animation:cosmicItem .9s cubic-bezier(.18,.8,.24,1) var(--cosmic-delay,390ms) both}
.slide.cosmic-from-right.active .cosmic-title{animation-name:cosmicTitleRight}
.slide.cosmic-from-center.active .cosmic-title{animation-name:cosmicTitleCenter}
.cosmic-title{position:relative;transform-style:preserve-3d;text-wrap:balance}
.cosmic-title:after{content:"";position:absolute;left:0;bottom:-9px;width:min(220px,42%);height:1px;opacity:0;background:linear-gradient(90deg,#7cedf7,transparent);box-shadow:0 0 13px #67e8f9}
.slide.active .cosmic-title:after{animation:cosmicUnderline 1.15s .72s ease-out both}
.cosmic-flight-layer{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none;mix-blend-mode:screen}
.cosmic-flight-layer:before{content:"";position:absolute;left:-25%;top:43%;width:38%;height:1px;opacity:0;background:linear-gradient(90deg,transparent,#a9f5ff,#fff,transparent);filter:blur(.2px);transform:rotate(-8deg);box-shadow:0 0 18px #62dff5}
.slide.active .cosmic-flight-layer:before{animation:cosmicSweep 1.55s .08s cubic-bezier(.2,.7,.25,1) both}
.cosmic-flight-layer i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;opacity:0;background:#e8fcff;box-shadow:0 0 12px #8cecff;animation:none}
.slide.active .cosmic-flight-layer i{animation:cosmicSpark 1.65s var(--d) cubic-bezier(.2,.75,.2,1) both}
.cosmic-horizon{position:absolute;z-index:1;left:8%;right:8%;bottom:10%;height:18%;pointer-events:none;opacity:0;border-radius:50%;background:radial-gradient(ellipse at 50% 100%,#5ce8ff22 0,transparent 66%);filter:blur(8px);transform:translateY(35px) scaleX(.8)}
.slide.active .cosmic-horizon{animation:cosmicHorizon 1.8s .12s ease-out both}
.slide:not(.active) .cosmic-kicker,.slide:not(.active) .cosmic-title,.slide:not(.active) .cosmic-copy,.slide:not(.active) .cosmic-item{animation:none}
@keyframes cosmicSignal{from{opacity:0;letter-spacing:.42em;filter:blur(7px);transform:translate3d(-30px,0,-120px)}to{opacity:1;letter-spacing:inherit;filter:none;transform:none}}
@keyframes cosmicTitle{0%{opacity:0;filter:blur(18px);transform:translate3d(-12vw,14vh,-650px) rotateX(18deg) rotateY(8deg) scale(.72);text-shadow:0 0 55px #77e9f4}55%{opacity:1;filter:blur(1px);text-shadow:0 0 26px #77e9f455}100%{opacity:1;filter:none;transform:none;text-shadow:inherit}}
@keyframes cosmicTitleRight{0%{opacity:0;filter:blur(18px);transform:translate3d(15vw,13vh,-680px) rotateX(16deg) rotateY(-10deg) scale(.7);text-shadow:0 0 55px #77e9f4}58%{opacity:1;filter:blur(1px)}100%{opacity:1;filter:none;transform:none;text-shadow:inherit}}
@keyframes cosmicTitleCenter{0%{opacity:0;filter:blur(20px);transform:translate3d(0,18vh,-800px) rotateX(22deg) scale(.58);text-shadow:0 0 70px #77e9f4}60%{opacity:1;filter:blur(1px)}100%{opacity:1;filter:none;transform:none;text-shadow:inherit}}
@keyframes cosmicCopy{from{opacity:0;filter:blur(8px);transform:translate3d(0,38px,-180px)}to{opacity:1;filter:none;transform:none}}
@keyframes cosmicItem{from{opacity:0;filter:blur(5px);transform:translate3d(32px,24px,-140px) rotateY(-7deg) scale(.94)}to{opacity:1;filter:none;transform:none}}
@keyframes cosmicUnderline{0%{opacity:0;transform:scaleX(0);transform-origin:left}45%{opacity:1}100%{opacity:.7;transform:scaleX(1);transform-origin:left}}
@keyframes cosmicSweep{0%{opacity:0;transform:translateX(0) rotate(-8deg) scaleX(.3)}35%{opacity:.75}100%{opacity:0;transform:translateX(420%) rotate(-8deg) scaleX(1)}}
@keyframes cosmicSpark{0%{opacity:0;transform:translate3d(-12vw,9vh,-200px) scale(.2)}38%{opacity:.9}100%{opacity:0;transform:translate3d(34vw,-12vh,0) scale(1.8)}}
@keyframes cosmicHorizon{0%{opacity:0;transform:translateY(45px) scaleX(.65)}45%{opacity:.8}100%{opacity:.28;transform:translateY(0) scaleX(1)}}
@media(max-width:800px){.slide.cosmic-ready.active .cosmic-title{animation-duration:.82s}.slide.cosmic-ready.active .cosmic-copy,.slide.cosmic-ready.active .cosmic-item{animation-duration:.65s}.cosmic-flight-layer i:nth-child(n+4){display:none}.cosmic-horizon{bottom:7%;height:12%}@keyframes cosmicTitle{from{opacity:0;filter:blur(8px);transform:translate3d(-28px,28px,-180px) scale(.9)}to{opacity:1;filter:none;transform:none}}@keyframes cosmicTitleRight{from{opacity:0;filter:blur(8px);transform:translate3d(28px,28px,-180px) scale(.9)}to{opacity:1;filter:none;transform:none}}@keyframes cosmicTitleCenter{from{opacity:0;filter:blur(9px);transform:translate3d(0,34px,-220px) scale(.86)}to{opacity:1;filter:none;transform:none}}}
@media(prefers-reduced-motion:reduce){.slide.cosmic-ready.active .cosmic-kicker,.slide.cosmic-ready.active .cosmic-title,.slide.cosmic-ready.active .cosmic-copy,.slide.cosmic-ready.active .cosmic-item{animation:cosmicReduced .25s ease-out both}.cosmic-flight-layer,.cosmic-horizon,.cosmic-title:after{display:none!important}@keyframes cosmicReduced{from{opacity:0}to{opacity:1}}}

/* Some slides use a real story beat: the title appears from behind a planet. */
.cosmic-title-planet{position:absolute;z-index:5;right:-7vw;bottom:-28vw;width:min(62vw,760px);aspect-ratio:1;border-radius:50%;pointer-events:none;opacity:0;background:radial-gradient(circle at 33% 27%,#72d7ed 0 2%,#245b79 10%,#0b243d 38%,#030812 70%);box-shadow:-25px -18px 70px #75eaff55,inset 35px 20px 80px #8be9ff22,inset -90px -40px 130px #000;transform:translate3d(16vw,15vw,80px) scale(1.1)}
.slide.cosmic-ready.cosmic-planet-reveal.active .cosmic-title{position:relative;z-index:3;animation-name:cosmicBehindPlanet}
.cosmic-planet-reveal.active .cosmic-title-planet{animation:cosmicPlanetPass 1.75s .05s cubic-bezier(.17,.76,.25,1) both}
@keyframes cosmicBehindPlanet{0%{opacity:0;filter:blur(15px);transform:translate3d(20vw,12vh,-550px) scale(.68)}38%{opacity:.18;filter:blur(8px)}70%{opacity:1;filter:blur(1px);transform:translate3d(2vw,0,-20px) scale(.98)}100%{opacity:1;filter:none;transform:none}}
@keyframes cosmicPlanetPass{0%{opacity:1;transform:translate3d(-12vw,-10vw,80px) scale(1.22)}62%{opacity:1}100%{opacity:.2;transform:translate3d(18vw,16vw,80px) scale(.96)}}

/* On other slides each letter begins as a star and forms the title. */
.cosmic-stars-build.active .cosmic-title{opacity:1!important;filter:none!important;transform:none!important;animation:none!important}
.cosmic-star-letter{display:inline-block;opacity:0;will-change:transform,opacity,filter;color:transparent;text-shadow:0 0 5px #fff,0 0 15px #70eaff;transform:translate3d(var(--star-x),var(--star-y),-360px) rotate(.35turn) scale(.08);filter:blur(3px)}
.cosmic-stars-build.active .cosmic-star-letter{animation:cosmicFormLetter 1.35s cubic-bezier(.13,.82,.2,1) var(--star-d) both}
@keyframes cosmicFormLetter{0%{opacity:0;color:transparent;transform:translate3d(var(--star-x),var(--star-y),-360px) rotate(.35turn) scale(.08);filter:blur(4px)}28%{opacity:1;color:transparent;filter:blur(0);text-shadow:0 0 8px #fff,0 0 25px #70eaff;transform:translate3d(calc(var(--star-x)*.55),calc(var(--star-y)*.55),-100px) scale(.18)}75%{color:inherit;text-shadow:0 0 10px #7defff;transform:translate3d(0,0,0) rotate(0) scale(1.04)}100%{opacity:1;color:inherit;filter:none;transform:none;text-shadow:inherit}}
@media(max-width:800px){.cosmic-title-planet{width:82vw;right:-28vw;bottom:-35vw}.cosmic-stars-build.active .cosmic-star-letter{animation-duration:.9s}}
@media(prefers-reduced-motion:reduce){.cosmic-title-planet{display:none}.cosmic-stars-build.active .cosmic-star-letter{animation:cosmicReduced .25s ease-out both;color:inherit}}
