/* Motion layer — reveal, press and hover patterns from the design system. */
@media (prefers-reduced-motion: no-preference) {
  /* Scroll reveal: main.js adds .is-in when an element enters the viewport. */
  .js [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity var(--duration-slow) var(--ease-out-strong), transform var(--duration-slow) var(--ease-out-strong); }
  .js [data-reveal].is-in { opacity: 1; transform: none; }
  .press { transition: transform var(--duration-fast) var(--ease-out-strong); }
  .press:active { transform: scale(0.97); }
}

@media (hover: hover) and (pointer: fine) {
  .lift { transition: transform var(--duration-base) var(--ease-out-strong); }
  .lift:hover { transform: translateY(-2px); }
}

@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; }
  [data-reveal] { opacity: 1; transform: none; }
}