:root{--motion-ease:cubic-bezier(.22,1,.36,1);--motion-duration:700ms}
html.motion-ready .motion-reveal{opacity:0;transform:translateY(22px);transition:opacity var(--motion-duration) var(--motion-ease),transform var(--motion-duration) var(--motion-ease)}
html.motion-ready .motion-reveal.motion-visible{opacity:1;transform:translateY(0)}
html.motion-ready .motion-reveal[data-motion-delay="1"]{transition-delay:80ms}
html.motion-ready .motion-reveal[data-motion-delay="2"]{transition-delay:160ms}
html.motion-ready .motion-reveal[data-motion-delay="3"]{transition-delay:240ms}
.site-header{animation:header-arrive 600ms var(--motion-ease) both}
.brand .mark{transition:transform 350ms var(--motion-ease),filter 350ms ease}
.brand:hover .mark{transform:translateY(-2px) rotate(-4deg) scale(1.06);filter:drop-shadow(0 5px 5px rgba(22,46,81,.18))}
.navlink{position:relative;transition:color 180ms ease,transform 180ms ease}
.navlink:hover{transform:translateY(-1px)}
.btn{transition:background 180ms ease,color 180ms ease,border-color 180ms ease,transform 180ms var(--motion-ease),box-shadow 180ms ease!important}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(22,46,81,.16)}
.btn:active{transform:translateY(0);box-shadow:none}
.card{transition:border-color 260ms ease,box-shadow 260ms ease,transform 260ms var(--motion-ease)}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(22,46,81,.09)}
@keyframes header-arrive{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@keyframes section-arrive{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}
@supports(animation-timeline:view()){
  section>.container>h1,
  section>.container>h2,
  section>.container>p,
  section>.container>ol,
  section>.container>div:not(.stats-grid),
  footer>.container>div{
    animation:section-arrive linear both;
    animation-timeline:view();
    animation-range:entry 5% cover 28%;
  }
}
@media(prefers-reduced-motion:reduce){
  .site-header{animation:none}
  html.motion-ready .motion-reveal,html.motion-ready .motion-reveal.motion-visible{opacity:1;transform:none;transition:none}
  .brand .mark,.navlink,.btn,.card{transition:none!important}
  .brand:hover .mark,.navlink:hover,.btn:hover,.btn:active,.card:hover{transform:none}
  section>.container>h1,section>.container>h2,section>.container>p,section>.container>ol,section>.container>div,footer>.container>div{animation:none}
}