/* ═══════════════════════════════════════════════
   AgroNutikas Web — motion.css (DS §06)
   Transition presets + reveal stagger.
   All durations/easings from tokens.css.
   ═══════════════════════════════════════════════ */

/* ── Transition presets ─────────────────────────────── */
.ds-transition-fast {
  transition-duration: var(--dur-fast);
  transition-timing-function: var(--ease-smooth);
}
.ds-transition {
  transition-duration: var(--dur-normal);
  transition-timing-function: var(--ease-smooth);
}
.ds-transition-slow {
  transition-duration: var(--dur-slow);
  transition-timing-function: var(--ease-smooth);
}

/* ── Hover lift (cards, buttons) ────────────────────── */
.ds-lift {
  transition: transform var(--dur-fast) var(--ease-smooth),
              box-shadow var(--dur-fast) var(--ease-smooth);
}
.ds-lift:hover {
  transform: translateY(-1px);
}

/* ── Reveal stagger (for grids) ─────────────────────── */
.rv-stagger > .rv:nth-child(1) { transition-delay: 0ms; }
.rv-stagger > .rv:nth-child(2) { transition-delay: 80ms; }
.rv-stagger > .rv:nth-child(3) { transition-delay: 160ms; }
.rv-stagger > .rv:nth-child(4) { transition-delay: 240ms; }
.rv-stagger > .rv:nth-child(5) { transition-delay: 320ms; }
.rv-stagger > .rv:nth-child(6) { transition-delay: 400ms; }

/* ── Button ripple keyframe ─────────────────────────── */
@keyframes ds-ripple {
  from { transform: scale(0); opacity: 0.5; }
  to   { transform: scale(2.5); opacity: 0; }
}

/* ── Spinner keyframe ───────────────────────────────── */
@keyframes ds-spin {
  to { transform: rotate(360deg); }
}

/* ── Reduced motion ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .rv { transition: none; opacity: 1; transform: none; }
  .ds-lift:hover { transform: none; }
  .rv-stagger > .rv { transition-delay: 0ms; }
}
