/* ==========================================================================
   Design tokens — Cyntya Frayre / Justicia para adolescentes
   Single source of truth for color, type, spacing, radii, motion.
   ========================================================================== */
:root {
  /* Color — exact brand palette */
  --navy: #1B2A3A;
  --slate: #4C5F76;
  --ivory: #F7F5F1;
  --white: #FFFFFF;
  --text: #17212B;
  --muted: #66717D;
  --border: #E4E4E1;

  /* Semantic aliases (still resolve to the 7 tokens above) */
  --bg: var(--white);
  --bg-alt: var(--ivory);
  --bg-dark: var(--navy);
  --link: var(--navy);
  --focus-ring: var(--navy);

  /* Type */
  --font-serif: "Cormorant Garamond", "Playfair Display", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  --fs-hero: clamp(2.75rem, 3.4vw + 2rem, 6.5rem);
  --fs-h1: clamp(2.5rem, 2.6vw + 1.6rem, 4.25rem);
  --fs-h2: clamp(2rem, 2vw + 1.3rem, 3.25rem);
  --fs-h3: clamp(1.375rem, 1.2vw + 1rem, 1.75rem);
  --fs-lead: clamp(1.05rem, 0.5vw + 1rem, 1.25rem);
  --fs-eyebrow: clamp(0.8rem, 0.3vw + 0.7rem, 1rem);
  --fs-numeral: clamp(3.5rem, 6vw + 1rem, 8rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-caption: 0.75rem;

  --lh-tight: 0.98;
  --lh-heading: 1.08;
  --lh-body: 1.65;
  --tracking-tight: -0.02em;

  /* Spacing scale (4px base) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;

  /* Layout */
  --container-max: 1280px;
  --reading-max: 780px;
  --gutter: var(--space-5);

  /* Radii */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;

  /* Motion */
  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 250ms ease;

  /* Elevation (used sparingly) */
  --shadow-sm: 0 1px 2px rgba(23, 33, 43, 0.06);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0ms;
    --transition-base: 0ms;
    --transition-slow: 0ms;
  }
}
