/* 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:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;pointer-events:none;
  background:#F5B33F;box-shadow:0 0 0 6px rgba(245,179,63,.25),0 0 24px rgba(245,179,63,.85);opacity:0}
.go > .tl-moon,.go .tl-moon{opacity:1;transition:left 3s cubic-bezier(.45,.15,.75,.75),opacity .4s ease}
.go > .tl-moon.out,.go .tl-moon.out{opacity:0;transition:left 3s cubic-bezier(.45,.15,.75,.75),opacity .6s 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}

/* 8 · gold rule under card headings draws itself (desktop) */
@media (min-width: 901px){
.js-motion .rule-card .rule-line{transform:scaleX(0);transform-origin:left center}
.js-motion .rule-card.go .rule-line{transform:none;transition:transform .9s cubic-bezier(.35,.6,.2,1) .25s}
}

@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}
}
