/* ============================================================================
   WebPros Design System — MOTION TOKENS
   Restrained motion (150–250ms, ease-out) that conveys state, never
   choreography. No bounce/elastic on product content; honor reduced-motion.
   ========================================================================== */

:root {
  /* easings */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */

  /* durations: 1 press · 2 hover/color · 3 enter-exit · 4 drawer */
  --dur-1: 80ms; /* @kind other */
  --dur-2: 140ms; /* @kind other */
  --dur-3: 220ms; /* @kind other */
  --dur-4: 320ms; /* @kind other */
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}