// ─────────────────────────────────────────────────────────────────────────────
// Component: Motion
// File:      src/scss/theme/_motion.scss
//
// Variants:  n/a — token definitions only
// Tokens:    --ease-*, --duration-*, --transition-*
// Usage:     transition: background var(--duration-base) var(--ease-out);
//
// Notes:     --ease-snap for interactions that must feel immediate.
//            Prefer --duration-fast for hover, --duration-base for state change.
// ─────────────────────────────────────────────────────────────────────────────

:root {
  --ease-out:  cubic-bezier(0.0, 0, 0.2, 1);
  --ease-in:   cubic-bezier(0.4, 0, 1, 1);
  --ease-snap: cubic-bezier(0.0, 0, 0.1, 1);

  --duration-fast:   80ms;
  --duration-base:   150ms;
  --duration-slow:   250ms;
  --duration-reveal: 400ms;

  // Shorthand transition helpers
  --transition-fast: var(--duration-fast) var(--ease-out);
  --transition-base: var(--duration-base) var(--ease-out);
  --transition-slow: var(--duration-slow) var(--ease-out);
}