/* ==========================================================================
   Automation Pioneer 2026 — animations.css
   One motion language: short fade-rise reveals, eased with --ease-out,
   transform/opacity only. Everything is progressive enhancement:
   - reveal states apply only once main.js has set html.reveal-ready
   - scroll-linked effects use native scroll timelines behind @supports
   - prefers-reduced-motion removes movement and continuous loops
   ========================================================================== */

@property --progress{syntax:'<number>';inherits:true;initial-value:1}

@keyframes ap-rise{from{opacity:.01;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes ap-line{from{transform:translate3d(0,105%,0)}to{transform:none}}
@keyframes ap-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes ap-curtain{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@keyframes ap-float-in{from{opacity:0;transform:translate3d(0,28px,0) scale(.97)}to{opacity:1;transform:none}}
@keyframes ap-scan{0%{transform:translateY(-100%)}55%,100%{transform:translateY(380%)}}
@keyframes ap-pulse{from{stroke-dashoffset:1670}to{stroke-dashoffset:0}}
@keyframes ap-marquee{to{transform:translate3d(-50%,0,0)}}
@keyframes ap-parallax{from{transform:scale(1.04) translateY(0)}to{transform:scale(1.14) translateY(6%)}}
@keyframes ap-progress{from{--progress:0}to{--progress:1}}

@media (prefers-reduced-motion:no-preference){
  /* Hero entrance (CSS only; no JS needed) */
  .hero__eyebrow{animation:ap-rise var(--dur-3) var(--ease-out) both .05s}
  .hero__line{overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
  .hero__line-in{display:block;animation:ap-line .9s var(--ease-out) both}
  .hero__line:nth-child(2) .hero__line-in{animation-delay:.1s}
  .hero__title em::after{animation:ap-draw .7s var(--ease-out) both .75s}
  .hero__lead{animation:ap-rise var(--dur-3) var(--ease-out) both .3s}
  .hero__actions{animation:ap-rise var(--dur-3) var(--ease-out) both .42s}
  .hero__search{animation:ap-rise var(--dur-3) var(--ease-out) both .54s}
  .hero__frame::before{content:"";position:absolute;inset:0;z-index:2;background:var(--c-red-600);transform-origin:right;animation:ap-curtain 1s var(--ease-io) both .2s}
  .hero__chips li{animation:ap-rise .6s var(--ease-out) both}
  .hero__chips li:nth-child(1){animation-delay:.9s}.hero__chips li:nth-child(2){animation-delay:.96s}.hero__chips li:nth-child(3){animation-delay:1.02s}
  .hero__chips li:nth-child(4){animation-delay:1.08s}.hero__chips li:nth-child(5){animation-delay:1.14s}.hero__chips li:nth-child(6){animation-delay:1.2s}
  .hero__card{animation:ap-float-in .8s var(--ease-out) both 1s}
  .hero__scan{animation:ap-scan 7s var(--ease-io) infinite 1.6s}
  .hero__traces path{animation:ap-pulse 9s linear infinite}
  .hero__traces path:nth-child(2){animation-duration:12s;animation-delay:-4s}
  .hero__traces path:nth-child(3){animation-duration:10s;animation-delay:-7s}

  /* Scroll reveals (enabled by main.js) */
  html.reveal-ready [data-reveal]{opacity:0;transform:translate3d(0,24px,0);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);transition-delay:calc(var(--i,0) * 80ms)}
  html.reveal-ready [data-reveal].is-revealed{opacity:1;transform:none}

  /* Manufacturer marquee */
  .marquee__track{animation:ap-marquee 55s linear infinite}
  .marquee:hover .marquee__track,.marquee:focus-within .marquee__track,.marquee.is-paused .marquee__track{animation-play-state:paused}

  /* Native scroll-linked effects */
  @supports (animation-timeline:view()){
    .hero__img{animation:ap-parallax linear both;animation-timeline:view();animation-range:cover 50% cover 100%}
    .steps{animation:ap-progress linear both;animation-timeline:view();animation-range:entry 30% cover 55%}
  }
}

/* Reduced motion: no movement, no loops; content and states stay intact. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .hero__scan,.hero__traces{display:none}
  .marquee{mask-image:none;-webkit-mask-image:none}
  .marquee__track{animation:none!important;width:auto;justify-content:center;padding-inline:var(--gutter)}
  .marquee__group{flex-wrap:wrap;justify-content:center;padding-right:0}
  .marquee__group--clone{display:none}
  .hero__img,.steps{animation:none!important}
}