/* Motion system shared by every page.
   Content is hidden for animation only while html has the "mo" class, which a tiny
   inline script adds and removes again if motion.js fails to load. With reduced
   motion ("rm"), movement is replaced by fades; counters and charts still run. */
:root{--ease:cubic-bezier(.16,1,.3,1);--ease-io:cubic-bezier(.65,0,.35,1)}

/* page-to-page transitions (Chrome, Edge, Safari 18.2+) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:.26s var(--ease-io) both mo-vt-out}
::view-transition-new(root){animation:.55s var(--ease) both mo-vt-in}
@keyframes mo-vt-out{to{opacity:0;transform:translateY(-10px)}}
@keyframes mo-vt-in{from{opacity:0;transform:translateY(16px)}}

/* ---------- reveal ---------- */
.mo .reveal{opacity:0;transform:translateY(32px);transition:opacity 1s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0s)}
.mo .reveal.in{opacity:1;transform:none}

/* ---------- staggered groups: children (items) or the children's contents (default) ---------- */
.mo [data-stagger]:not([data-stagger=items])>*>*,
.mo [data-stagger=items]>*{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .95s var(--ease);transition-delay:calc(var(--i,0)*85ms + .12s)}
.mo [data-stagger].in:not([data-stagger=items])>*>*,
.mo [data-stagger=items].in>*{opacity:1;transform:none}

/* ---------- split headings ---------- */
.mo [data-words]:not(.split),.mo [data-letters]:not(.split){visibility:hidden}
.mo .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.mo .wi{display:inline-block;transform:translateY(108%);transition:transform 1s var(--ease);transition-delay:calc(var(--i,0)*42ms + var(--d,0s))}
.mo [data-words].in .wi{transform:none}
.mo .wd{display:inline-block;white-space:nowrap}
.mo .chm{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em 0 .26em;margin:-.04em 0 -.26em}
.mo .ch{display:inline-block;transform:translateY(112%) rotate(7deg);transform-origin:0 100%;animation:mo-ch 1.15s var(--ease) both;animation-delay:calc(var(--i,0)*38ms + .12s)}
@keyframes mo-ch{to{transform:none}}

/* ---------- hero name on the homepage (static letters, no script needed) ---------- */
.mo h1.nm .ln span.ch{display:inline-block;transform:translateY(110%) rotate(6deg);transform-origin:0 100%;transition:none;animation:mo-ch 1.2s var(--ease) both;animation-delay:calc(var(--i,0)*42ms + .1s)}

/* ---------- charts ---------- */
.mo .fill[data-w]{transition:width 1.35s var(--ease);transition-delay:calc(var(--i,0)*95ms + .15s)}
.mo .waffle i,.mo .wgrid i{transform:scale(.25);opacity:0;transition:transform .55s var(--ease),opacity .45s ease;transition-delay:calc(var(--i,0)*11ms + .25s)}
.mo .in .waffle i,.mo .in .wgrid i,.mo .waffle.in i,.mo .wgrid.in i{transform:none;opacity:1}
.mo [data-draw]{transition:stroke-dashoffset 2s var(--ease) .2s}
.mo [data-pop]{opacity:0;transform:scale(.4);transform-box:fill-box;transform-origin:center;transition:opacity .4s ease,transform .6s var(--ease);transition-delay:calc(var(--i,0)*120ms + .9s)}
.mo .in [data-pop]{opacity:1;transform:none}
.mo .axis{opacity:0;transition:opacity .6s ease 1.2s}
.mo .in .axis{opacity:1}

/* ---------- images settle as they reveal ---------- */
.mo .reveal .frame img,.mo .reveal.frame img,.mo .reveal .flagshot img{transform:scale(1.06);transition:transform 1.8s var(--ease),opacity .2s}
.mo .reveal.in .frame img,.mo .reveal.in.frame img,.mo .reveal.in .flagshot img{transform:none}

/* ---------- pointer effects ---------- */
[data-tilt]{transition:transform .7s var(--ease);transform-style:preserve-3d;will-change:transform}
[data-tilt].tilting{transition:transform .12s linear}
.spot-host{isolation:isolate}
.spot{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0!important;transform:none!important;transition:opacity .45s ease!important;border-radius:inherit;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),var(--spot,rgba(217,58,16,.10)),transparent 62%)}
.spot-host:hover>.spot{opacity:1!important}
[data-magnetic]{transition:translate .5s var(--ease),filter .2s,background-color .2s,color .2s,border-color .2s}
/* buttons: a light sweep on hover */
.btn.solid{position:relative;overflow:hidden;isolation:isolate}
.btn.solid::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.26) 50%,transparent 75%);transform:translateX(-130%);transition:transform .9s var(--ease)}
.btn.solid:hover::after{transform:translateX(130%)}

/* ---------- ambient: a slow-drifting accent orb ---------- */
.orb{position:absolute;pointer-events:none;z-index:-1;width:min(60vw,720px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,var(--accent-soft,rgba(217,58,16,.08)),transparent 62%);filter:blur(6px);animation:mo-orb 18s ease-in-out infinite alternate}
@keyframes mo-orb{0%{transform:translate(-6%,-4%) scale(1)}50%{transform:translate(8%,6%) scale(1.12)}100%{transform:translate(-2%,10%) scale(.95)}}

/* section labels decode in */
[data-scramble]{font-variant-ligatures:none}

/* ---------- reduced motion: fades only ---------- */
.rm .reveal,.rm [data-stagger]>*,.rm [data-stagger]>*>*{transform:none!important;transition:opacity .7s ease!important}
.rm .ch,.rm h1.nm .ln span.ch{transform:none!important;animation:mo-fade .9s ease both!important;animation-delay:calc(var(--i,0)*25ms)!important}
.rm .wi{transform:none!important;opacity:0;transition:opacity .8s ease!important;transition-delay:calc(var(--i,0)*30ms)!important}
.rm [data-words].in .wi{opacity:1}
@keyframes mo-fade{from{opacity:0}to{opacity:1}}
.rm .fill[data-w]{transition:width .01s,opacity .8s ease!important}
.rm .waffle i,.rm .wgrid i{transform:none!important}
.rm .orb{animation:none}
.rm .reveal .frame img,.rm .reveal .flagshot img{transform:none!important}
@media (prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation-name:mo-fade}}

@media print{
  .mo .reveal,.mo [data-stagger]>*,.mo [data-stagger]>*>*,.mo .wi,.mo .ch,.mo .waffle i{opacity:1!important;transform:none!important;animation:none!important}
  .mo [data-words],.mo [data-letters]{visibility:visible!important}
  .orb,.spot{display:none!important}
}
