/* ===========================================================================
   UCL Express — Elevation, shadow, motion tokens
   Shadows are cool-navy tinted, crisp, never fuzzy-grey. Motion is quick and
   confident with a slight ease-out — nothing bouncy.
   =========================================================================== */

:root {
  /* Shadows — tinted with navy for cohesion */
  --shadow-xs: 0 1px 2px rgba(16, 32, 136, 0.08);
  --shadow-sm: 0 1px 3px rgba(16, 32, 136, 0.10), 0 1px 2px rgba(16, 32, 136, 0.06);
  --shadow-md: 0 4px 12px rgba(16, 32, 136, 0.10), 0 2px 4px rgba(16, 32, 136, 0.06);
  --shadow-lg: 0 12px 28px rgba(16, 32, 136, 0.14), 0 4px 8px rgba(16, 32, 136, 0.06);
  --shadow-xl: 0 24px 48px rgba(10, 21, 96, 0.18);

  /* Accent glow — for CTAs / motion moments only, use sparingly */
  --glow-flame: 0 6px 20px rgba(241, 90, 32, 0.35);

  /* Focus ring */
  --ring: 0 0 0 3px rgba(42, 61, 190, 0.35); /* @kind shadow */

  /* Borders */
  --border-width: 1px;          /* @kind spacing */
  --border-width-strong: 2px;   /* @kind spacing */

  /* Motion */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);   /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);   /* @kind other */
  --dur-fast: 120ms;   /* @kind other */
  --dur-base: 200ms;   /* @kind other */
  --dur-slow: 320ms;   /* @kind other */
  --transition-base: all var(--dur-base) var(--ease-out); /* @kind other */
}