:root {
  /* Colores */
  --color-primary: #142B5C;
  --color-primary-dark: #0E1A40;
  --color-accent: #00BA7F;
  --color-cream: #FFF8E4;
  --color-beige: #CCB490;
  --color-white: #FFFFFF;

  /* Tipografía */
  --font-heading: 'Sora', sans-serif;
  --font-body: 'Inter', sans-serif;
  --font-accent: 'Fraunces', serif;

  /* Espaciado */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;

  /* Bordes: escala concéntrica tipo Apple, cada nivel "anidado" resta ~8px al anterior */
  --radius-sm: 0.625rem;  /* 10px: detalles chicos, tags */
  --radius-md: 1rem;      /* 16px: botones, tarjetas internas */
  --radius-lg: 1.5rem;    /* 24px: contenedores grandes (Hero, marco de foto) */
  --radius-xl: 2rem;      /* 32px: empalme entre secciones (curva de página) */

  /* Sombras */
  --shadow-card: 0 1px 2px rgba(20, 43, 92, 0.04), 0 12px 28px rgba(20, 43, 92, 0.08);
  --shadow-card-hover: 0 4px 8px rgba(20, 43, 92, 0.06), 0 20px 40px rgba(20, 43, 92, 0.14);
  --shadow-seam: 0 -16px 24px -16px rgba(20, 43, 92, 0.08);

  /* Layout */
  --container-max: 1120px;
  --container-padding: 1.25rem;
}