/* motion.css — shared motion layer (website-rebuild skill asset)
   Include AFTER base.css and BEFORE the skin css:
     <link rel="stylesheet" href="/assets/motion.css">
   Pairs with site-motion.js. Uses skin vars: --reveal-ease, --accent.
   Everything is inside a reduced-motion guard and degrades to fully
   visible content without JS (entrance rules are gated on body.motion,
   which only JS adds). Skins may override any piece. */
.progress{background:var(--accent,#c58a3d)}
@media(prefers-reduced-motion:no-preference){

/* page veil between navigations */
body{animation:sm-pagein .5s ease-out both}
@keyframes sm-pagein{from{opacity:0}to{opacity:1}}
body.leaving{opacity:0;transition:opacity .22s ease}

/* hero ken-burns settle (bg image layer) */
.hero .bg{animation:sm-kb 15s var(--reveal-ease,cubic-bezier(.16,1,.3,1)) both;will-change:transform}
@keyframes sm-kb{from{transform:scale(1.06)}to{transform:scale(1)}}

/* staged hero/page-head entrance (JS adds body.motion) */
body.motion .hero .eyebrow,body.motion .page-head .eyebrow,body.motion .page-head .crumb{opacity:0;animation:sm-down .8s var(--reveal-ease,cubic-bezier(.16,1,.3,1)) .1s forwards}
body.motion .hero .lead,body.motion .page-head .lead{opacity:0;animation:sm-up .9s var(--reveal-ease,cubic-bezier(.16,1,.3,1)) .7s forwards}
body.motion .hero .row{opacity:0;animation:sm-up .9s var(--reveal-ease,cubic-bezier(.16,1,.3,1)) .9s forwards}
body.motion .hero .heroline{opacity:0;animation:sm-up .9s var(--reveal-ease,cubic-bezier(.16,1,.3,1)) 1.06s forwards}
body.motion .nav{animation:sm-down .7s var(--reveal-ease,cubic-bezier(.16,1,.3,1)) both}
@keyframes sm-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes sm-down{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}

/* word-mask reveal (spans injected by site-motion.js) */
h1.split .wm{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.12em;margin-bottom:-.12em}
h1.split .wm>span{display:inline-block;transform:translateY(112%);animation:sm-word .85s var(--reveal-ease,cubic-bezier(.16,1,.3,1)) forwards;animation-delay:calc(var(--wi)*56ms + .26s)}
@keyframes sm-word{to{transform:none}}

/* primary button shine sweep (needs overflow-safe rounded buttons) */
.btn-primary,.cta{position:relative;overflow:hidden}
.btn-primary::after,.cta::after{content:"";position:absolute;top:0;bottom:0;left:-80%;width:55%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);transition:left .7s ease}
.btn-primary:hover::after,.cta:hover::after{left:130%}

/* FAQ open slide */
.faqs details[open] .ans{animation:sm-faq .4s var(--reveal-ease,cubic-bezier(.16,1,.3,1))}
@keyframes sm-faq{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* GPU hints for the JS parallax */
.hero .wrap,.bleed .bg{will-change:transform}
}