/* Moonlight interlude and an independent neon type runway. */
.chrome-night .intro{display:grid;grid-template-columns:.85fr 1.15fr;gap:7%;align-items:center;text-align:left;padding:100px 9%;background:radial-gradient(ellipse at 18% 55%,#35447066,transparent 48%),#151a25}
.chrome-night .intro:before{display:none}.chrome-night .intro .copy{max-width:650px;margin:0}.chrome-night .intro h2{margin:0 0 30px;max-width:17ch;font-weight:400;letter-spacing:-.055em}.chrome-moon{width:100%;max-width:430px;margin:auto;filter:drop-shadow(0 20px 38px #080b1980)}
.chrome-night .scene.reveal-ready>.chrome-moon{transition:opacity 1s ease,translate 1s ease}.chrome-night .scene.reveal-ready:not(.visible)>.chrome-moon{opacity:0;translate:-25px 18px}
.chrome-night .neon-runway{overflow:hidden;background:#090c13;border-block:1px solid #64769c55;padding:30px 0;position:relative;isolation:isolate}
.chrome-night .neon-runway:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#090c13,transparent 8%,transparent 92%,#090c13)}
.chrome-night .neon-belt{display:flex;width:max-content;animation:chrome-runway 36s linear infinite;will-change:transform}.chrome-night .neon-group{display:flex;align-items:center;flex-shrink:0;gap:55px;padding-right:55px}
.chrome-night .neon-group span{display:block;font:800 clamp(64px,9vw,138px)/1.1 system-ui;letter-spacing:-.055em;color:#a5cbff;background:linear-gradient(100deg,#91eaff,#8d9dff,#ef95ff,#ffb1cf,#91eaff);background-size:300% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 12px #8874ff55);animation:chrome-neon 7s ease-in-out infinite alternate;animation-delay:var(--phase)}
.chrome-night .neon-runway:hover .neon-belt{animation-play-state:paused}
@keyframes chrome-runway{to{transform:translateX(-50%)}}
@keyframes chrome-neon{from{background-position:0% 50%;filter:drop-shadow(0 0 8px #4fa9ff44)}to{background-position:100% 50%;filter:drop-shadow(0 0 17px #ef65ff77)}}
.chrome-night .invitation-details{display:block;margin:0;padding:90px 10% 100px;border:0;background:linear-gradient(180deg,#141925,#1d2434)}
.chrome-night .invitation-details .copy{max-width:760px;margin:auto;text-align:center}.chrome-night .invitation-details h2{font-weight:400;margin-bottom:32px}.chrome-night .invitation-details p{text-align:center}
@container(max-width:620px){.chrome-night .intro{display:flex;flex-direction:column;padding:58px 8% 70px;gap:32px;text-align:center}.chrome-moon{width:75%;max-width:270px}.chrome-night .intro h2{margin-inline:auto}.chrome-night .neon-runway{padding:25px 0}.chrome-night .neon-group{gap:30px;padding-right:30px}.chrome-night .invitation-details{padding:65px 8% 75px}}
@media(prefers-reduced-motion:reduce){.chrome-night .neon-belt,.chrome-night .neon-group span{animation:none}.chrome-night .chrome-moon{transition:none!important;translate:none!important;opacity:1!important}}

/* A bare mirrored sphere, with a closer text / light composition. */
.chrome-night .hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);padding-inline:13%;gap:0;min-height:780px}
.chrome-night .hero .copy{position:relative;z-index:4}.chrome-night .hero h1{font-size:clamp(54px,7.8cqw,114px)}
.chrome-night .disco-stage{position:relative;width:112%;margin-left:-8%;isolation:isolate;aspect-ratio:1;display:grid;place-items:center}
.chrome-night .disco-stage .birthday-art{width:100%;height:auto;max-height:none;max-width:none;margin:0;rotate:0deg;animation:disco-turn 65s linear infinite;position:relative;z-index:2;filter:drop-shadow(0 0 24px #87aaff22)}
@keyframes disco-turn{to{transform:rotate(360deg)}}
.chrome-night .disco-rays{position:absolute;inset:-55%;z-index:0;pointer-events:none;opacity:.2;background:repeating-conic-gradient(from 0deg,transparent 0deg 27deg,#91b9ff44 29deg,transparent 32deg 60deg);mask-image:radial-gradient(circle,transparent 12%,#0005 25%,#000 40%,transparent 69%);animation:disco-turn 65s linear infinite}
.chrome-night .disco-glint{position:absolute;width:16px;height:16px;left:28%;top:25%;z-index:3;background:#f2f8ff;clip-path:polygon(50% 0,59% 40%,100% 50%,59% 59%,50% 100%,40% 59%,0 50%,40% 40%);filter:drop-shadow(0 0 12px white);animation:disco-glow 6s ease-in-out infinite}
@keyframes disco-glow{0%,100%{opacity:.3;transform:scale(.7)}50%{opacity:1;transform:scale(1.4)}}
.chrome-night .disco-reflections{position:absolute;inset:0;pointer-events:none;z-index:8;overflow:hidden}
.chrome-night .disco-reflections i{position:absolute;left:var(--x);top:var(--y);width:12px;height:20px;border-radius:2px;background:linear-gradient(140deg,#f2f8ff,#7cabff70);box-shadow:0 0 13px #9dbcff55;opacity:0;rotate:var(--tilt);animation:disco-drift var(--duration) ease-in-out var(--delay) infinite}
@keyframes disco-drift{0%,100%{opacity:0;transform:translate(-35px,-18px) scale(.6)}35%{opacity:.19}65%{opacity:.12}85%{opacity:0;transform:translate(65px,35px) scale(1.1)}}
.chrome-night .hero.has-cover .disco-stage{display:none}
@container(max-width:620px){.chrome-night .hero{padding:100px 7% 45px;min-height:750px;gap:5px}.chrome-night .hero h1{font-size:clamp(44px,15cqw,76px)}.chrome-night .disco-stage{width:min(100%,340px);margin:12px auto 0;flex-shrink:0}.chrome-night .disco-reflections i{width:8px;height:13px}}
@media(prefers-reduced-motion:reduce){.chrome-night .disco-stage .birthday-art,.chrome-night .disco-rays,.chrome-night .disco-glint,.chrome-night .disco-reflections i{animation:none}.chrome-night .disco-reflections,.chrome-night .disco-rays{display:none}}

@font-face{font-family:'Chrome Unbounded';src:url("/static/fonts/chrome-unbounded.3ba1d6fdf96b.ttf") format('truetype');font-style:normal;font-weight:200 900;font-display:swap}
.chrome-night .hero h1{font-family:'Chrome Unbounded',system-ui,sans-serif;font-size:clamp(46px,5.7cqw,86px);font-weight:500;line-height:1.15;letter-spacing:-.06em}
.chrome-night .scene h2{font-family:'Chrome Unbounded',system-ui,sans-serif;font-size:clamp(28px,3.4cqw,46px);font-weight:400;line-height:1.23;letter-spacing:-.045em}
.chrome-night .hero .subtitle{font-family:'Chrome Unbounded',system-ui,sans-serif;font-weight:300;font-size:clamp(18px,1.8cqw,25px);line-height:1.5;letter-spacing:-.04em}
.chrome-night .neon-group span{font-family:'Chrome Unbounded',system-ui,sans-serif;font-weight:700;letter-spacing:-.06em}
@container(max-width:620px){.chrome-night .hero h1{font-size:clamp(34px,10cqw,58px);line-height:1.2}.chrome-night .scene h2{font-size:clamp(27px,7.7cqw,38px)}.chrome-night .hero .subtitle{font-size:18px}}

/* Align the cover caption with the main copy. */
.chrome-night .hero .eyebrow{width:100%;max-width:none;margin-inline:0;text-align:left;text-wrap:balance}
