/* ============================================================
   GO FAST VALENCIA — Effects Tokens
   Shadows use navy tint for brand cohesion (not pure black)
   ============================================================ */

:root {
  /* ── Border radius ── */
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-2xl:  40px;
  --radius-pill: 999px;

  /* ── Shadows (navy-tinted) ── */
  --shadow-xs: 0 1px 2px rgba(26, 45, 92, 0.06);
  --shadow-sm: 0 1px 3px rgba(26, 45, 92, 0.10), 0 1px 2px rgba(26, 45, 92, 0.06);
  --shadow-md: 0 4px 12px rgba(26, 45, 92, 0.12), 0 2px 4px rgba(26, 45, 92, 0.08);
  --shadow-lg: 0 8px 24px rgba(26, 45, 92, 0.16), 0 4px 8px rgba(26, 45, 92, 0.06);
  --shadow-xl: 0 16px 48px rgba(26, 45, 92, 0.20), 0 8px 16px rgba(26, 45, 92, 0.08);
  --shadow-inner: inset 0 2px 6px rgba(26, 45, 92, 0.08);

  /* ── Focus ring ── */
  --focus-ring: 0 0 0 3px rgba(23, 169, 159, 0.40);

  /* ── Transitions ── */
  --transition-fast:   150ms ease;   /* @kind other */
  --transition-normal: 250ms ease;   /* @kind other */
  --transition-slow:   400ms ease;   /* @kind other */
  --transition-bounce: 350ms cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
}