/**
 * Design tokens — Camino Real Coaching
 * Paleta tomada de la captura: azul real, amarillo cita, naranja CTA y crema.
 */
:root {
  /* Colores */
  --color-terracotta: #f28a00;
  --color-terracotta-dark: #c96f00;
  --color-terracotta-light: #ffb13b;
  --color-sage: #24468f;
  --color-sage-light: #3a5fab;
  --color-forest: #18387f;
  --color-cream: #fbf4ea;
  --color-cream-dark: #efe4d5;
  --color-gold: #f5c400;
  --color-white: #ffffff;
  --color-text: #10234a;
  --color-text-muted: #556072;
  --color-text-light: #ffffff;

  /* Tipografía */
  --font-display: "Cormorant Garamond", "Georgia", serif;
  --font-body: "Source Sans 3", "Helvetica Neue", sans-serif;

  /* Escala tipográfica */
  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;
  --text-3xl: 2.75rem;
  --text-4xl: 3.5rem;
  --text-hero: clamp(2.5rem, 6vw, 4.25rem);

  /* Espaciado */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-section: clamp(4rem, 10vw, 7rem);

  /* Layout */
  --max-width: 72rem;
  --max-width-narrow: 42rem;
  --header-height: 5.75rem;

  /* Efectos */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.25rem;
  --radius-full: 9999px;
  --shadow-sm: 0 2px 8px rgba(16, 35, 74, 0.08);
  --shadow-md: 0 8px 32px rgba(16, 35, 74, 0.12);
  --shadow-lg: 0 16px 48px rgba(16, 35, 74, 0.16);
  --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);

  /* CTA */
  --cta-primary-bg: var(--color-terracotta);
  --cta-primary-hover: var(--color-terracotta-dark);
  --cta-secondary-border: var(--color-sage);
}