/* Neurobusiness — Animation & Transition Tokens */
:root {

  /* ─── Durations ─────────────────────────────────────────── */
  --duration-instant:  50ms; /* @kind other */
  --duration-fast:     120ms; /* @kind other */
  --duration-base:     200ms; /* @kind other */
  --duration-moderate: 320ms; /* @kind other */
  --duration-slow:     480ms; /* @kind other */
  --duration-slower:   700ms; /* @kind other */
  --duration-slowest:  1000ms; /* @kind other */

  /* ─── Easing ────────────────────────────────────────────── */
  /* Standard: element enters/exits viewport or changes state */
  --ease-standard:  cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  /* Decelerate: element enters from outside */
  --ease-in:        cubic-bezier(0, 0, 0.2, 1); /* @kind other */
  /* Accelerate: element exits to outside */
  --ease-out:       cubic-bezier(0.4, 0, 1, 1); /* @kind other */
  /* Expressive: slight spring for interactive feedback */
  --ease-spring:    cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
  /* Linear: progress bars, loading */
  --ease-linear:    linear; /* @kind other */

  /* ─── Transition Shorthands ─────────────────────────────── */
  --transition-fast:     var(--duration-fast) var(--ease-standard); /* @kind other */
  --transition-base:     var(--duration-base) var(--ease-standard); /* @kind other */
  --transition-moderate: var(--duration-moderate) var(--ease-standard); /* @kind other */
  --transition-spring:   var(--duration-moderate) var(--ease-spring); /* @kind other */
  --transition-slow:     var(--duration-slow) var(--ease-in); /* @kind other */

  /* ─── Named Transitions (usage) ─────────────────────────── */
  /* Hover feedback (opacity, background, border) */
  --t-hover:  background-color var(--transition-fast), color var(--transition-fast),
              border-color var(--transition-fast), opacity var(--transition-fast),
              box-shadow var(--transition-fast); /* @kind other */
  /* Transform (scale, translate) */
  --t-transform: transform var(--transition-spring); /* @kind other */
  /* Combined interactive */
  --t-interactive: var(--t-hover), var(--t-transform); /* @kind other */
}

/* ─── Keyframes ─────────────────────────────────────────────── */
@keyframes nb-spin {
  to { transform: rotate(360deg); }
}

@keyframes nb-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes nb-slide-up {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes nb-slide-down {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes nb-scale-in {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}

@keyframes nb-pulse-brand {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 11, 114, 0); }
  50%       { box-shadow: 0 0 0 6px rgba(255, 11, 114, 0.2); }
}
