/* Motion layer (Oct 2026): curtain hold, slow photo drift, scroll fade-in, parallax, hover.
   Everything is off for visitors who ask their device for reduced motion. */
@media (prefers-reduced-motion: no-preference){
  /* 1. Homepage curtain: holds over the arch for ~12s, then leaves while the arch arrives */
  @keyframes mvPlateLong{
    0%{opacity:0;filter:blur(3px)}
    5%{opacity:.62;filter:blur(0)}
    82%{opacity:.62;filter:blur(0)}
    100%{opacity:0;filter:blur(7px)}}
  html.m-on header.hero .hero-plate{animation:mvPlateLong 15000ms linear 200ms both}
  html.m-on header.hero .hero-plate video{animation:heroPlateZoom 15000ms cubic-bezier(.33,0,.35,1) 200ms both}
  html.m-on header.hero::after{
    animation:heroArchArrive 16000ms cubic-bezier(.40,.02,.28,1) both,
              atmoDriftPseudo 22s var(--m-ease,ease-in-out) 16000ms infinite}

  /* 2. Slow drift on large photos (scale) — parallax uses the separate translate property */
  @keyframes mvDrift{0%{scale:1.04}100%{scale:1.10}}
  .mv-frame{overflow:hidden !important}
  .mv-drift{animation:mvDrift 28s ease-in-out infinite alternate;transform-origin:center center;will-change:scale,translate}

  /* 3. Fade-in on scroll */
  html.mv-ready .mv-in{transition:opacity 1000ms cubic-bezier(.22,.61,.36,1),translate 1000ms cubic-bezier(.22,.61,.36,1)}
  html.mv-ready .mv-in:not(.mv-shown){opacity:0;translate:0 22px}

  /* 4. Hover */
  .card,.svc-card,.finding,.rv-links a,.cta,.cta-ghost{transition:translate 260ms ease,box-shadow 260ms ease,background-color 220ms ease,color 220ms ease,border-color 220ms ease}
  .card:hover,.svc-card:hover,.finding:hover,.rv-links a:hover{translate:0 -4px;box-shadow:0 14px 30px -18px rgba(40,25,30,.35)}
  .cta:hover,.cta-ghost:hover{translate:0 -2px}
  a .mv-drift,a:hover .mv-drift{transition:filter 400ms ease}
  a:hover .mv-drift{filter:brightness(1.05)}
}
