:root{--blue:#101e2a;--deep:#0a141d;--white:#f9f2e9;--peach:#ffb18c;--coral:#f28b66;--gold:#e9b65c;--soft:#aeb9c2;--font:'DM Sans',Arial,sans-serif;--serif:'Instrument Serif',Georgia,serif;--spring:cubic-bezier(.34,1.56,.64,1);--out:cubic-bezier(.16,1,.3,1)}
@property --angle{syntax:'<angle>';inherits:false;initial-value:0deg}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--blue);color:var(--white);font-family:var(--font);-webkit-font-smoothing:antialiased}
html,body{overflow-x:clip}a{color:inherit;text-decoration:none}button{font:inherit}::selection{background:var(--peach);color:var(--blue)}
a:focus-visible,button:focus-visible{outline:2px solid var(--peach);outline-offset:5px;border-radius:4px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Backdrop: aurora, blueprint floor, particles, cursor light ---------- */
.backdrop{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse 120% 80% at 60% 40%,#14283a 0%,var(--blue) 55%,var(--deep) 100%);animation:fade-in 1.6s ease both}
.aurora{position:absolute;inset:-15%;transform:translate3d(var(--px,0),var(--py,0),0);filter:blur(70px) saturate(1.2);opacity:.9}
.blob{position:absolute;border-radius:50%;mix-blend-mode:screen;will-change:transform}
.blob-a{width:52vmax;height:42vmax;left:46%;top:18%;background:radial-gradient(circle,#ffb18c38,transparent 65%);animation:drift-a 26s ease-in-out infinite alternate}
.blob-b{width:60vmax;height:50vmax;left:-12%;top:-10%;background:radial-gradient(circle,#2f5c7d55,transparent 65%);animation:drift-b 32s ease-in-out infinite alternate}
.blob-c{width:40vmax;height:40vmax;left:62%;top:-18%;background:radial-gradient(circle,#e9b65c2e,transparent 65%);animation:drift-c 22s ease-in-out infinite alternate}
.blob-d{width:46vmax;height:36vmax;left:8%;top:58%;background:radial-gradient(circle,#f28b6626,transparent 65%);animation:drift-d 29s ease-in-out infinite alternate}
@keyframes drift-a{to{transform:translate(-18vw,14vh) scale(1.25) rotate(40deg)}}
@keyframes drift-b{to{transform:translate(22vw,18vh) scale(.85) rotate(-30deg)}}
@keyframes drift-c{to{transform:translate(-26vw,30vh) scale(1.3)}}
@keyframes drift-d{to{transform:translate(30vw,-20vh) scale(1.15) rotate(25deg)}}
.blueprint{position:absolute;left:-50%;right:-50%;bottom:-8vh;height:62vh;transform:perspective(520px) rotateX(64deg);transform-origin:50% 100%;background-image:linear-gradient(#ffb18c1f 1px,transparent 1px),linear-gradient(90deg,#ffb18c1f 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:linear-gradient(to top,#000 0%,#0008 35%,transparent 85%);mask-image:linear-gradient(to top,#000 0%,#0008 35%,transparent 85%);animation:grid-run 3.2s linear infinite,fade-in 2.4s .4s ease both;opacity:.75}
@keyframes grid-run{to{background-position:0 64px,0 0}}
#bg-canvas,#fx-canvas{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;display:block}
#fx-canvas{z-index:20}
.cursor-glow{position:absolute;left:0;top:0;width:640px;height:640px;margin:-320px 0 0 -320px;border-radius:50%;background:radial-gradient(circle,#ffb18c1c,#ffb18c08 40%,transparent 70%);transform:translate3d(var(--cx,50vw),var(--cy,40vh),0);opacity:var(--co,0);transition:opacity .6s;mix-blend-mode:screen}
.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 55%,#05090dcc 100%)}
.grain{position:fixed;inset:-100%;z-index:30;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* ---------- Page frame ---------- */
.holding-page{position:relative;z-index:2;overflow-x:clip;height:100vh;height:100svh;min-height:520px;max-width:1680px;margin:auto;display:grid;grid-template-rows:96px minmax(0,1fr) 140px;padding:0 clamp(20px,4vw,72px)}
header{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px}
header::before,header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px}
header::before{background:#ffffff26;transform-origin:0 50%;animation:draw-line 1.4s .2s var(--out) both}
header::after{background:linear-gradient(90deg,transparent,var(--peach),transparent);width:22%;opacity:.8;animation:line-run 6s 1.6s ease-in-out infinite both}
@keyframes draw-line{from{transform:scaleX(0)}}
@keyframes line-run{0%{transform:translateX(-30%);opacity:0}10%{opacity:.9}55%{opacity:.9}65%,100%{transform:translateX(480%);opacity:0}}

/* Logo build */
.brand{display:block;line-height:0;border-radius:4px}.brand-logo{display:block;width:200px;height:auto;overflow:visible}
.logo-arch{transform-box:fill-box;transform-origin:50% 100%;animation:arch-rise .9s .3s var(--spring) both}
.logo-bar{transform-box:fill-box;transform-origin:0 50%;animation:bar-grow .7s calc(.55s + var(--b)*.12s) var(--out) both}
.glyph{animation:glyph-in .8s calc(.75s + var(--i)*.045s) var(--out) both}
.logo-shine{animation:shine 7s 2.2s ease-in-out infinite}
.brand:hover .logo-arch{animation:arch-bounce .7s var(--spring)}
@keyframes arch-rise{from{transform:scale(.2,0) translateY(20%);opacity:0}}
@keyframes arch-bounce{40%{transform:translateY(-14%) scale(1.06)}}
@keyframes bar-grow{from{transform:scaleX(0);opacity:0}}
@keyframes glyph-in{from{transform:translateY(-420px);opacity:0}}
@keyframes shine{0%{transform:translateX(0)}22%,100%{transform:translateX(720px)}}

/* Status pill with orbiting border */
.status-pill{position:relative;margin:0;display:flex;align-items:center;gap:10px;padding:9px 16px 9px 14px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--white);background:#ffffff0a;isolation:isolate;animation:pop-in .8s 1.3s var(--spring) both}
.status-pill::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--angle),#ffffff1a 0deg,var(--peach) 60deg,#ffffff1a 130deg,#ffffff1a 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:spin-angle 4s linear infinite;z-index:-1}
.status-dot{position:relative;width:8px;height:8px;border-radius:50%;background:var(--peach);box-shadow:0 0 12px var(--peach)}
.status-dot::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--peach);animation:ping 1.8s ease-out infinite}
@keyframes spin-angle{to{--angle:360deg}}
@keyframes ping{from{transform:scale(1);opacity:.9}to{transform:scale(3.4);opacity:0}}
@keyframes pop-in{from{transform:scale(.6) translateY(-8px);opacity:0}}

/* ---------- Stage ---------- */
main{display:grid;place-items:center;min-height:0;padding:16px 0;isolation:isolate}
.audience-stage{position:relative;width:min(1120px,100%,calc((100vh - 268px)*1.333333));width:min(1120px,100%,calc((100svh - 268px)*1.333333));min-width:0;aspect-ratio:4/3;container-type:inline-size;perspective:1600px;animation:stage-in 1.6s .45s var(--out) both}
@keyframes stage-in{from{transform:translateY(70px) scale(.9);opacity:0;filter:blur(14px)}to{filter:blur(0)}}
.stage-3d{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.audience-scene,.queue-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.queue-ready .audience-scene{visibility:hidden}
/* Align the still with the rig composition, including space for the welcoming arm. */
.audience-scene{inset:auto;left:1.28205%;top:4.10256%;width:92.82051%;height:92.82051%}
.queue-canvas{filter:drop-shadow(0 30px 40px #0009)}
.stage-halo{position:absolute;inset:24% 8% 7%;background:radial-gradient(ellipse,#ffb18c14,transparent 70%);pointer-events:none;transform:translateZ(-40px)}
.floor-glow{position:absolute;left:6%;right:4%;top:66%;height:30%;border-radius:50%;background:radial-gradient(ellipse,#ffb18c40,#ffb18c10 45%,transparent 70%);filter:blur(10px);transform:translateZ(-60px);animation:floor-pulse 5s ease-in-out infinite}
@keyframes floor-pulse{50%{opacity:.55;transform:translateZ(-60px) scaleX(.94)}}
.arch-rays{position:absolute;left:80.8%;top:27%;width:110cqw;height:110cqw;margin:-55cqw 0 0 -55cqw;border-radius:50%;background:repeating-conic-gradient(from var(--angle),#ffd9a82e 0deg 5deg,transparent 5deg 17deg,#ffb18c1c 17deg 21deg,transparent 21deg 30deg);-webkit-mask-image:radial-gradient(circle,#000 4%,#0009 20%,transparent 58%);mask-image:radial-gradient(circle,#000 4%,#0009 20%,transparent 58%);transform:translateZ(-120px);mix-blend-mode:screen;animation:spin-angle 60s linear infinite,rays-in 2.2s 1.3s var(--out) both;pointer-events:none}
@keyframes rays-in{from{opacity:0;transform:translateZ(-120px) scale(.3)}}
.arch-glow{position:absolute;left:80.8%;top:25.9%;width:18cqw;height:18cqw;margin:-9cqw 0 0 -9cqw;border-radius:50%;background:radial-gradient(circle,#fff5e0c0 0%,#ffd9a866 22%,#ffb18c22 45%,transparent 70%);mix-blend-mode:screen;pointer-events:none;animation:glow-breathe 4.5s 2s ease-in-out infinite both}
@keyframes glow-breathe{0%,100%{opacity:.45;transform:scale(.85)}50%{opacity:1;transform:scale(1.12)}}
.twinkles i{position:absolute;left:var(--x);top:var(--y);width:calc(2.4cqw*var(--s));height:calc(2.4cqw*var(--s));margin:calc(-1.2cqw*var(--s)) 0 0 calc(-1.2cqw*var(--s));clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);background:#fff8e6;filter:drop-shadow(0 0 6px #ffd98a);mix-blend-mode:screen;opacity:0;animation:twinkle 4.6s var(--d) ease-in-out infinite;pointer-events:none;transform:translateZ(30px)}
@keyframes twinkle{0%,100%{opacity:0;transform:translateZ(30px) scale(0) rotate(0)}12%{opacity:1;transform:translateZ(30px) scale(1) rotate(45deg)}26%{opacity:0;transform:translateZ(30px) scale(.2) rotate(90deg)}}

/* ---------- Headline ---------- */
.headline{position:absolute;left:3%;top:1%;width:62%;transform:translateZ(70px);pointer-events:none}
.kicker{display:flex;align-items:center;gap:.9em;margin:0 0 .9em;font-size:max(10px,1.02cqw);font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--peach);animation:rise 1s 1.1s var(--out) both}
.kicker-line{display:block;width:3.2em;height:1px;background:var(--peach);transform-origin:0 50%;animation:draw-line 1s 1.2s var(--out) both}
h1{margin:0;font-weight:500;font-size:max(17px,4.35cqw);line-height:1.04;letter-spacing:-.025em;color:var(--white)}
.h-line{display:block;white-space:nowrap}
.h-line.serif{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.14em;letter-spacing:-.01em;color:var(--peach);padding-right:.1em}
.ch{display:inline-block;white-space:pre;animation:char-in .9s calc(1.2s + var(--c)*.035s) var(--out) both}
@keyframes char-in{from{opacity:0;transform:translateY(.7em) rotate(8deg);filter:blur(8px)}}
.serif .ch{background:linear-gradient(100deg,var(--peach) 0%,var(--peach) 40%,#fff1e2 50%,var(--peach) 60%,var(--peach) 100%);background-size:400% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent;animation:char-in .9s calc(1.2s + var(--c)*.035s) var(--out) both,text-sheen 6s calc(3.5s + var(--c)*.04s) ease-in-out infinite}
@keyframes text-sheen{0%{background-position:100% 0}35%,100%{background-position:0 0}}
.rotator{position:relative;display:inline-block;vertical-align:bottom;transition:width .7s cubic-bezier(.65,0,.35,1);color:var(--white)}
.rotator.swapping{clip-path:inset(-.12em -.04em -.32em -.04em)}
.rotator::after{content:"";position:absolute;left:0;right:0;bottom:.02em;height:.07em;border-radius:1em;background:linear-gradient(90deg,var(--peach),var(--gold));transform-origin:0 50%;animation:draw-line 1s 2.1s var(--out) both}
.rotator .ch.in{animation:word-in .75s calc(.15s + var(--o)*.03s) var(--out) both}
.rotator .ch.out,.rotator .ch.in.out{animation:word-out .45s calc(var(--o)*.018s) cubic-bezier(.55,0,.75,0) both}
@keyframes word-out{to{opacity:0;transform:translateY(-110%)}}
@keyframes word-in{from{opacity:0;transform:translateY(110%)}}
.rotator .layer{display:inline-block;white-space:pre}.rotator .layer.leaving{position:absolute;left:0;top:0}
.sub{margin:1.1em 0 0;max-width:30em;font-size:max(12px,1.32cqw);line-height:1.5;color:var(--soft);animation:rise 1s 2s var(--out) both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
@container (max-width:560px){.sub{display:none}.kicker{margin-bottom:.6em}}

/* ---------- Speech bubbles ---------- */
.bubbles{position:absolute;inset:0;transform:translateZ(50px);pointer-events:none}
.bubble{position:absolute;left:var(--x);top:var(--y);max-width:15em;padding:.6em .85em;border-radius:1em;background:var(--white);color:var(--blue);font-size:max(9px,1.18cqw);font-weight:600;line-height:1.3;white-space:normal;width:max-content;box-shadow:0 .6em 1.6em #0007,0 0 0 1px #fff8 inset;transform:translate(calc(var(--ax)*-1),calc(-100% - .9em)) scale(.2);transform-origin:var(--ax) 100%;opacity:0;transition:transform .55s var(--spring),opacity .3s ease}
.bubble::after{content:"";position:absolute;left:var(--ax);bottom:-.45em;width:.9em;height:.9em;margin-left:-.45em;background:inherit;transform:rotate(45deg);border-radius:0 0 .2em 0}
.bubble.show{opacity:1;transform:translate(calc(var(--ax)*-1),calc(-100% - .9em)) scale(1)}
.bubble.show .bubble-body{animation:bubble-bob 2.4s ease-in-out infinite}
.bubble.concierge{background:linear-gradient(135deg,#ffc6a8,var(--peach));}
.bubble-body{display:block;position:relative;z-index:1}
.typing{display:inline-flex;gap:.25em;padding:.15em 0}.typing b{width:.45em;height:.45em;border-radius:50%;background:currentColor;opacity:.35;animation:dot 1s ease-in-out infinite}.typing b:nth-child(2){animation-delay:.15s}.typing b:nth-child(3){animation-delay:.3s}
@keyframes dot{40%{opacity:1;transform:translateY(-.25em)}}
@keyframes bubble-bob{50%{transform:translateY(-.18em)}}

/* ---------- Ticker ---------- */
.ticker{position:relative;display:flex;align-items:center;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);animation:rise 1.2s 2.2s var(--out) both}
.ticker::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:#ffffff26;transform-origin:50% 50%;animation:draw-line 1.4s 2.2s var(--out) both}
.ticker-track{display:flex;width:max-content;animation:marquee 38s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-list{display:flex;align-items:center;margin:0;padding:0;list-style:none}
.ticker-list li{display:flex;align-items:center;white-space:nowrap;font-family:var(--serif);font-style:italic;font-size:clamp(24px,2.6vw,38px);color:var(--white);transition:color .3s}
.ticker-list li:nth-child(even){font-family:var(--font);font-style:normal;font-size:clamp(11px,.9vw,13px);font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--soft)}
.ticker-list li:hover{color:var(--peach)}
.ticker-list li::after{content:"";flex:none;width:.9em;height:.9em;margin:0 1.4em;background:url(assets/retirement-builder-icon.svg) center/contain no-repeat;animation:sep-pulse 2.4s ease-in-out infinite}
.ticker-list li:nth-child(even)::after{width:22px;height:22px;margin:0 30px}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes sep-pulse{50%{transform:scale(.75) rotate(-8deg);opacity:.6}}
@keyframes fade-in{from{opacity:0}}

/* ---------- Countdown ---------- */
.launch-strip{position:relative;display:flex;align-items:center;justify-content:center;animation:rise 1.2s 2s var(--out) both}
.launch-strip::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:#ffffff26;animation:draw-line 1.4s 2s var(--out) both}
.launch-strip::after{content:"";position:absolute;top:0;left:0;height:1px;width:22%;background:linear-gradient(90deg,transparent,var(--peach),transparent);animation:line-run 7s 3.5s ease-in-out infinite both}
.clock{display:grid;grid-template-columns:auto .5ch auto .5ch auto .5ch auto;align-items:start;gap:clamp(8px,1.4vw,20px);font-size:clamp(32px,5.3vw,64px);font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"tnum" 1,"lnum" 1}
.time-unit{display:flex;flex-direction:column;align-items:center;min-width:0;animation:rise .9s calc(2.2s + var(--u,0)*.12s) var(--out) both}
.time-unit:nth-child(3){--u:1}.time-unit:nth-child(5){--u:2}.time-unit:nth-child(7){--u:3}
.time-unit>span:first-child{display:flex;justify-content:center;font-weight:400;line-height:1.05;letter-spacing:0;font-kerning:none}
.digit{position:relative;display:inline-block;width:.62em;text-align:center}
.digit.roll{animation:digit-roll .55s var(--out)}
@keyframes digit-roll{0%{opacity:0;transform:translateY(-.45em) scale(.9);filter:blur(4px)}60%{opacity:1}100%{transform:none;filter:blur(0)}}
#seconds{color:var(--peach);text-shadow:0 0 .5em #ffb18c55}
.time-label{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--soft);margin-top:10px;line-height:1.5}
.clock-colon{display:block;text-align:center;font-size:.5em;line-height:1;padding-top:.3em;color:#687781;animation:colon-pulse 1s steps(1) infinite}
@keyframes colon-pulse{50%{opacity:.25}}
@media(max-width:760px){.holding-page{grid-template-rows:78px minmax(0,1fr) 124px}.clock{font-size:clamp(28px,8.6vw,42px);gap:7px}.time-label{font-size:8px;letter-spacing:1px;margin-top:8px}}
@media(max-width:360px){.clock{gap:5px;font-size:28px}}

/* ---------- Responsive ---------- */
@media(max-width:760px){.holding-page{grid-template-rows:78px minmax(0,1fr) 96px;padding:0 16px;min-height:480px}.headline{top:auto;bottom:calc(100% + 4px);left:0;width:100%;transform:none}.headline h1{font-size:clamp(30px,9vw,46px)}.headline .kicker{font-size:11px}.headline .sub{display:block;font-size:14px;margin-top:.7em}.brand-logo{width:150px}.audience-stage{width:100%;max-width:640px}.status-pill{font-size:10px;padding:7px 12px 7px 11px;gap:8px;letter-spacing:1.2px}.blueprint{background-size:44px 44px}@keyframes grid-run{to{background-position:0 44px,0 0}}}
@media(max-height:600px) and (min-width:761px){.holding-page{height:auto;min-height:100svh;grid-template-rows:78px auto 110px}.audience-stage{width:min(720px,100%)}main{padding:20px 0}}
@media(max-width:380px){.brand-logo{width:128px}.status-pill{letter-spacing:.8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.ticker-track{transform:none}.cursor-glow{display:none}}