/* Tyto motion layer — loaded on every page. Initial "hidden" states only apply
   when motion.js has run (html.js-motion) and the visitor allows motion. */

/* 1 · headline word reveal + gold shimmer */
.split .wm{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .04em .14em;margin:0 -.04em -.14em}
.split .wi{display:inline-block;will-change:transform}
.js-motion .split .wi{transform:translateY(112%)}
.js-motion .split.go .wi{transform:none;transition:transform .95s cubic-bezier(.2,.75,.2,1) calc(var(--i,0) * 42ms)}
.js-motion .split.go .gold .wi{
  background:linear-gradient(100deg,#F5B33F 0%,#F5B33F 38%,#FFF1CF 50%,#F5B33F 62%,#F5B33F 100%);
  background-size:300% 100%;background-position:100% 0;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:tyShimmer 2.8s ease-in-out calc(.9s + var(--i,0) * 42ms) 1 both}
.js-motion .split.go .gold .wi{text-shadow:none}
.js-motion .split.go .gold{filter:drop-shadow(0 2px 6px rgba(30,16,60,.45))}
@keyframes tyShimmer{from{background-position:100% 0}to{background-position:0 0}}

/* 2 · strike → replace */
.js-motion .fix s{text-decoration:none;background:linear-gradient(#A9AECB,#A9AECB) left 58% / 0% 2px no-repeat;transition:background-size .7s ease .25s}
.js-motion .fix.go s{background-size:100% 2px}
.js-motion .fix .fix-arr,.js-motion .fix b{opacity:0;transform:translateX(-8px);display:inline-block}
.js-motion .fix.go .fix-arr{opacity:1;transform:none;transition:opacity .4s ease .95s,transform .4s ease .95s}
.js-motion .fix.go b{opacity:1;transform:none;transition:opacity .5s ease 1.15s,transform .5s ease 1.15s}

/* 4 · timelines draw themselves + moon */
.js-motion .band .hz{transform:scaleX(0);transform-origin:left center}
.js-motion .band.go .hz{transform:none;transition:transform 2.6s cubic-bezier(.35,.6,.2,1)}
.js-motion .band .mk .pt,.js-motion .band .mk .ln{opacity:0}
.js-motion .band .mk .pt{transform:scale(.3)}
.js-motion .band.go .mk .pt{opacity:1;transform:none;transition:opacity .45s ease calc(.25s + var(--k,0) * .4s),transform .6s cubic-bezier(.3,1.6,.5,1) calc(.25s + var(--k,0) * .4s)}
.js-motion .band.go .mk .ln{opacity:1;transition:opacity .8s ease calc(.45s + var(--k,0) * .4s)}
.js-motion .tlb-grid::before{transform:scaleX(0);transform-origin:left center}
.js-motion .tlb.go .tlb-grid::before{transform:none;transition:transform 2.6s cubic-bezier(.35,.6,.2,1)}
.js-motion .tlb-step .pt,.js-motion .tlb-step .ln{opacity:0}
.js-motion .tlb-step .pt{transform:scale(.3)}
.js-motion .tlb.go .tlb-step .pt{opacity:1;transform:none;transition:opacity .45s ease calc(.25s + var(--k,0) * .4s),transform .6s cubic-bezier(.3,1.6,.5,1) calc(.25s + var(--k,0) * .4s)}
.js-motion .tlb.go .tlb-step .ln{opacity:1;transition:opacity .8s ease calc(.45s + var(--k,0) * .4s)}
.tl-moon{position:absolute;z-index:3;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;pointer-events:none;
  box-shadow:inset -6px -2px 0 0 #FBF8F1,0 0 18px rgba(251,248,241,.55);opacity:0}
.go > .tl-moon,.go .tl-moon{opacity:1;transition:left 2.6s cubic-bezier(.35,.6,.2,1),opacity .4s ease}

/* 5 · twinkling stars */
.ty-stars{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.ty-stars i{position:absolute;border-radius:50%;background:#FFFFFF;opacity:.15;animation:tyTwinkle var(--d,4s) ease-in-out var(--dl,0s) infinite}
@keyframes tyTwinkle{0%,100%{opacity:.12}50%{opacity:var(--o,.85)}}
.tlb{isolation:isolate}
.tlb > .ty-stars{z-index:-1;border-radius:inherit}

/* 7 · typing chat */
.ty-typing{display:inline-flex !important;gap:5px;align-items:center;min-height:20px}
.ty-typing span{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.35;animation:tyDot 1s ease-in-out infinite}
.ty-typing span:nth-child(2){animation-delay:.15s}
.ty-typing span:nth-child(3){animation-delay:.3s}
@keyframes tyDot{0%,100%{opacity:.25;transform:none}50%{opacity:.9;transform:translateY(-3px)}}
.ty-hidden{display:none !important}
.ty-pop{animation:tyPop .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes tyPop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}

/* 8 · phone: cards stack while scrolling */
@media (max-width: 640px){
  .ty-stack > *{position:sticky;top:calc(78px + var(--s,0) * 12px)}
  .ty-stack > .glass-d{background:linear-gradient(160deg,#2B2870,#1B1950) !important;box-shadow:0 -10px 30px rgba(8,6,36,.35)}
  .ty-stack{padding-bottom:12px}
}

@media (prefers-reduced-motion: reduce){
  .js-motion .split .wi,.js-motion .fix s,.js-motion .fix .fix-arr,.js-motion .fix b,
  .js-motion .band .hz,.js-motion .band .mk .pt,.js-motion .band .mk .ln,
  .js-motion .tlb-grid::before,.js-motion .tlb-step .pt,.js-motion .tlb-step .ln{transform:none !important;opacity:1 !important;transition:none !important;animation:none !important}
  .js-motion .fix s{background-size:100% 2px}
  .tl-moon,.ty-stars{display:none}
  .ty-stack > *{position:static}
}
