/* ============================================================
   Catamarca Capital — Spacing, radius, shadow, motion tokens
   ============================================================ */

:root {
  /* ---------- Spacing scale (4px base) ---------- */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ---------- Radii ----------
     Brand is modern but the isotipo is pixel/geometric — keep radii
     moderate; pills used for tags & claim chips. */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   18px;
  --radius-xl:   28px;
  --radius-pill: 999px;

  /* ---------- Border widths ---------- */
  --bw-hair: 1px;   /* @kind spacing */
  --bw-1:    1.5px; /* @kind spacing */
  --bw-2:    2px;   /* @kind spacing */
  --bw-3:    3px;   /* @kind spacing */

  /* ---------- Shadows ----------
     Soft, cool-tinted; never heavy. Logo manual forbids shadows ON
     the logo, but UI cards may use restrained elevation. */
  --shadow-xs: 0 1px 2px rgba(0, 36, 84, 0.06);
  --shadow-sm: 0 2px 8px rgba(0, 36, 84, 0.07);
  --shadow-md: 0 8px 24px rgba(0, 36, 84, 0.09);
  --shadow-lg: 0 18px 48px rgba(0, 36, 84, 0.12);

  /* ---------- Layout ---------- */
  --container-max:  1200px;
  --container-text: 720px;
  --header-h:       72px;

  /* ---------- Motion ----------
     Energetic but never gimmicky: quick ease-out, occasional gentle
     overshoot to echo "movimiento". */
  --ease-out:      cubic-bezier(0.2, 0.7, 0.2, 1); /* @kind other */
  --ease-in-out:   cubic-bezier(0.6, 0, 0.2, 1); /* @kind other */
  --ease-overshoot:cubic-bezier(0.2, 0.9, 0.3, 1.25); /* @kind other */
  --dur-fast:  140ms; /* @kind other */
  --dur-base:  220ms; /* @kind other */
  --dur-slow:  360ms; /* @kind other */
}