/* PRO LAYER — additive only. Loads after style.css; nothing in style.css is removed. */
html.is-loading{overflow:hidden;}
.is-loading .hero,.is-loading .hero *{animation-play-state:paused!important;}

/* ══ PRELOADER (split curtain) ══ */
#pre{position:fixed;inset:0;z-index:99990;display:grid;place-items:center;}
.pre-p{position:absolute;left:0;right:0;height:50.5%;background:var(--bg0);transition:transform 1s cubic-bezier(.76,0,.24,1) .15s;}
.pre-t{top:0;border-bottom:1px solid var(--teal2);box-shadow:0 1px 24px rgba(26,154,138,.55);}
.pre-b{bottom:0;}
#pre.done .pre-t{transform:translateY(-101%);}
#pre.done .pre-b{transform:translateY(101%);}
.pre-core{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:1.1rem;transition:opacity .4s,transform .55s,filter .4s;}
#pre.done .pre-core{opacity:0;transform:scale(1.18);filter:blur(6px);}
.pre-svg{width:118px;height:auto;overflow:visible;}
.pre-svg .c,.pre-svg .sun{transform-box:fill-box;transform-origin:50% 100%;animation:preGrow .9s cubic-bezier(.22,1,.36,1) backwards;}
.pre-svg .c2{animation-delay:.25s}.pre-svg .c3{animation-delay:.45s}.pre-svg .sun{animation-delay:.7s}
.pre-svg .ray{animation:preRay 1.3s ease-in-out infinite;}
.pre-svg .ray:nth-of-type(2){animation-delay:.15s}.pre-svg .ray:nth-of-type(3){animation-delay:.3s}.pre-svg .ray:nth-of-type(4){animation-delay:.45s}.pre-svg .ray:nth-of-type(5){animation-delay:.6s}
.pre-word{font-size:1.5rem;font-weight:300;color:var(--tx5);letter-spacing:-.01em;animation:preUp .8s cubic-bezier(.22,1,.36,1) .5s backwards;}
.pre-word b{font-weight:700;color:var(--teal2);}
.pre-bar{width:min(220px,60vw);height:2px;background:var(--brd2);border-radius:2px;overflow:hidden;}
.pre-bar i{display:block;height:100%;width:calc(var(--p,0)*1%);background:linear-gradient(90deg,var(--teal),var(--gold2));box-shadow:var(--gsm);}
.pre-pct{font-family:'Martian Mono',monospace;font-size:.65rem;color:var(--tx3);letter-spacing:.2em;}
@keyframes preGrow{from{scale:1 0;opacity:0;}}
@keyframes preRay{0%,100%{opacity:.25;}50%{opacity:1;}}
@keyframes preUp{from{opacity:0;transform:translateY(14px);}}

/* ══ SCROLL PROGRESS · SIDE DOTS · NAV ══ */
#sp{position:fixed;top:0;left:0;right:0;height:2px;z-index:700;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--teal),var(--teal3),var(--gold2));box-shadow:var(--gsm);}
nav.hide{transform:translateY(-100%);}
.nav-links{position:relative;}
.nav-ind{position:absolute;bottom:-4px;left:0;height:2px;width:var(--w,0);transform:translateX(var(--x,0));opacity:0;border-radius:2px;background:linear-gradient(90deg,var(--teal2),var(--gold2));box-shadow:var(--gsm);transition:transform .55s cubic-bezier(.22,1,.36,1),width .55s cubic-bezier(.22,1,.36,1),opacity .3s;pointer-events:none;}
.nav-links a.active:not(.nav-cta){color:var(--teal3);}
#dots{position:fixed;right:1.4rem;top:50%;transform:translateY(-50%);z-index:500;display:none;flex-direction:column;gap:.9rem;}
#dots a{position:relative;width:9px;height:9px;border-radius:50%;border:1.5px solid var(--tx2);transition:all .35s cubic-bezier(.22,1,.36,1);}
#dots a::before{content:attr(data-l);position:absolute;right:1.5rem;top:50%;transform:translate(8px,-50%);opacity:0;font-size:.62rem;letter-spacing:.12em;text-transform:capitalize;color:var(--teal3);white-space:nowrap;transition:all .3s;pointer-events:none;}
#dots a:hover::before{opacity:1;transform:translate(0,-50%);}
#dots a.on{background:var(--teal2);border-color:var(--teal2);box-shadow:var(--gsm);scale:1.35;}
@media(min-width:1280px){#dots{display:flex;}}

/* ══ HERO ENTRANCE ══ */
.ch{display:inline-block;opacity:0;animation:chIn 1s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(.3s + var(--i)*65ms);}
@keyframes chIn{from{opacity:0;transform:perspective(500px) rotateX(-80deg) translateY(.5em);filter:blur(8px);}to{opacity:1;transform:none;filter:none;}}
.hero-photo-card img{clip-path:inset(0 0 100% 0);animation:wipe 1.4s cubic-bezier(.76,0,.24,1) .5s forwards;}
@keyframes wipe{to{clip-path:inset(0);}}
.hero-photo-card img,.about-3d-card img{scale:1.12;translate:0 var(--py,0);}
.hero-badge,.xp-badge,.finfo{translate:0 var(--ty,0);}
.finfo{animation:ffloat 7s ease-in-out infinite,finPop .9s cubic-bezier(.22,1,.36,1) backwards;}
.fi1{animation-delay:0s,1.5s;}.fi2{animation-delay:3.5s,1.8s;}
@keyframes finPop{from{opacity:0;scale:.6;}}
.fi-spark span{transform-origin:bottom;animation:barUp .8s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(1.9s + var(--i)*70ms);}
@keyframes barUp{from{scale:1 0;}}
.cb-g{animation:livePulse 2.2s ease-in-out infinite;}
@keyframes livePulse{0%,100%{box-shadow:0 0 0 0 rgba(212,168,67,.35);}50%{box-shadow:0 0 0 6px rgba(212,168,67,0);}}

/* ══ SCROLL REVEAL VARIANTS ══ */
.rev.fx-l{transform:translateX(-70px);}
.rev.fx-r{transform:translateX(70px);}
.rev.fx-zoom{transform:translateY(34px) scale(.93);}
.rev.fx-flip{transform:perspective(900px) rotateX(26deg) translateY(50px);transform-origin:50% 100%;}
.rev.vis.fx-l,.rev.vis.fx-r,.rev.vis.fx-zoom,.rev.vis.fx-flip{transform:none;}
.stitle .wi{display:inline-block;opacity:0;transform:translateY(.7em) rotateX(-50deg);filter:blur(8px);transition:opacity .9s ease,transform .9s cubic-bezier(.22,1,.36,1),filter .9s ease;transition-delay:calc(var(--i)*70ms + .15s);}
.rev.vis .stitle .wi{opacity:1;transform:none;filter:none;}
.rev .seye-line{transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.22,1,.36,1) .3s;}
.rev.vis .seye-line{transform:scaleX(1);}
.about-3d-card img{clip-path:inset(0 0 100% 0);}
.rev.vis .about-3d-card img{clip-path:inset(0);transition:clip-path 1.4s cubic-bezier(.76,0,.24,1) .3s;}

/* staggered children (fill-mode backwards so hover transforms still work) */
.rev.vis .step,.rev.vis .soc,.rev.vis .disc-row{animation:slideIn .8s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(var(--i)*.1s + .25s);}
.rev.vis .tag{animation:pop .55s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(var(--i)*55ms + .5s);}
.rev.vis .fg{animation:slideUp .7s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(var(--i)*.09s + .3s);}
@keyframes slideIn{from{opacity:0;translate:-30px 0;}}
@keyframes slideUp{from{opacity:0;translate:0 20px;}}
@keyframes pop{from{opacity:0;scale:.6;}}

/* candle chart draw-in */
#csvg g{transform-box:fill-box;transform-origin:50% 100%;}
#csvg.pre g{opacity:0;}
#csvg.go g{animation:candle .6s cubic-bezier(.22,1,.36,1) backwards;animation-delay:calc(var(--i)*45ms);}
@keyframes candle{from{opacity:0;transform:scaleY(.15);}}

/* ══ BUTTONS: shimmer · ripple ══ */
.btn-teal::after,.btn-gold::after,.nav-cta::after{content:'';position:absolute;top:0;left:-130%;width:60%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .75s cubic-bezier(.22,1,.36,1);z-index:1;pointer-events:none;}
.btn-teal:hover::after,.btn-gold:hover::after,.nav-cta:hover::after{left:150%;}
.rip{position:absolute!important;width:10px;height:10px;margin:-5px;border-radius:50%;background:rgba(255,255,255,.5);pointer-events:none;z-index:0!important;animation:rip .7s ease-out forwards;}
@keyframes rip{to{transform:scale(34);opacity:0;}}

/* ══ ACCESSIBILITY ══ */
a:focus-visible,button:focus-visible{outline:2px solid var(--gold2);outline-offset:3px;}
@media(prefers-reduced-motion:reduce){
  #pre{display:none;}
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important;}
  .rev,.ch,.stitle .wi{opacity:1!important;transform:none!important;filter:none!important;}
  .hero-photo-card img,.about-3d-card img{clip-path:none!important;}
}
