/* Shared motion layer — used by every site.
   All effects are progressive enhancements: without support, or with
   reduced-motion, everything renders fully visible and static. */

/* Hero load-in: fade + rise, runs once on page load. */
@media (prefers-reduced-motion: no-preference){
  .anim-in{opacity:0; animation:anim-rise 0.7s cubic-bezier(0.22,1,0.36,1) both;}
  .anim-in.d1{animation-delay:0.06s;}
  .anim-in.d2{animation-delay:0.14s;}
  .anim-in.d3{animation-delay:0.22s;}
  .anim-in.d4{animation-delay:0.30s;}
  @keyframes anim-rise{from{opacity:0; transform:translateY(18px);} to{opacity:1; transform:translateY(0);}}
}

/* Scroll reveal: elements fade/rise as they enter the viewport.
   Guarded by @supports so unsupported browsers keep content visible. */
@media (prefers-reduced-motion: no-preference){
  @supports (animation-timeline: view()){
    .reveal{
      opacity:0;
      animation:anim-reveal linear both;
      animation-timeline:view();
      animation-range:entry 0% cover 22%;
    }
    @keyframes anim-reveal{
      from{opacity:0; transform:translateY(26px);}
      to{opacity:1; transform:translateY(0);}
    }
  }
}

/* Infinite marquee for logo strips (pure CSS).
   Structure is always applied; only the motion is gated. */
.marquee{overflow:hidden;}
.marquee-track{display:flex; width:max-content;}
@media (prefers-reduced-motion: no-preference){
  .marquee-track{animation:marquee 34s linear infinite;}
  .marquee:hover .marquee-track{animation-play-state:paused;}
  @keyframes marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}
}