/* ============================================================
   Spado Sport — Effects: radii, borders, shadows, motion
   Sporty = fairly tight corners, confident shadows.
   ============================================================ */

:root {
  /* Radii */
  --r-xs:   4px;
  --r-sm:   6px;
  --r-md:   10px;
  --r-lg:   16px;
  --r-xl:   22px;
  --r-2xl:  30px;
  --r-pill: 999px;

  /* Borders */
  --bw-hair: 1px;
  --bw:      1.5px;
  --bw-bold: 2px;

  /* Shadows — cool navy-tinted, never pure black */
  --shadow-xs: 0 1px 2px rgba(11,27,43,0.06);
  --shadow-sm: 0 1px 3px rgba(11,27,43,0.08), 0 1px 2px rgba(11,27,43,0.06);
  --shadow-md: 0 6px 16px rgba(11,27,43,0.10), 0 2px 4px rgba(11,27,43,0.06);
  --shadow-lg: 0 18px 40px rgba(11,27,43,0.14), 0 6px 12px rgba(11,27,43,0.08);
  --shadow-xl: 0 32px 64px rgba(11,27,43,0.20);
  /* Colored "energy" shadow for primary CTAs */
  --shadow-red:  0 10px 24px rgba(230,51,70,0.32);
  --shadow-navy: 0 10px 24px rgba(14,61,99,0.28);

  /* Focus ring */
  --focus-ring: 0 0 0 3px rgba(230,51,70,0.35);

  /* Motion — athletic, snappy, never floaty */
  --ease-out: cubic-bezier(0.16, 0.84, 0.32, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur: 200ms; /* @kind other */
  --dur-slow: 360ms; /* @kind other */
}
