/* ============================================================
   VARIABLES DE MARCA — Astrología y Herbolaria · Francisca Giner Mellado
   ============================================================
   Este archivo concentra TODA la paleta y tipografía del sitio.
   Si algún día cambias un color o una fuente, solo necesitas
   editarlo aquí: se actualiza automáticamente en todas las páginas.

   Proporciones de uso (respétalas al agregar nuevas secciones):
   - Champán / rosa pálido → ~70% de las superficies (fondos)
   - Ciruela                → ~25% (texto, líneas, navegación)
   - Oro                    → ≤5% (solo detalles: hover, íconos, acentos)
   ============================================================ */

:root {
  /* --- Paleta de marca --- */
  --color-champan: #F2E6D6;      /* fondo dominante 1 */
  --color-rosa-palido: #F6E9E4;  /* fondo dominante 2 (alterna con champán) */
  --color-ciruela: #3E2D5C;      /* texto, navegación, líneas, estructura */
  --color-ciruela-suave: #5A4478; /* variante más clara de ciruela para texto secundario */
  --color-oro: #B8924A;          /* acento escaso: SOLO hover, íconos, detalles puntuales */
  --color-blanco: #FFFFFF;

  /* --- Tipografía --- */
  --fuente-titulos: 'Cormorant Garamond', serif;
  --fuente-cuerpo: 'Mulish', sans-serif;

  /* --- Escala tipográfica (mobile-first, se ajusta en base.css con media queries) --- */
  --tamano-h1: 2.25rem;
  --tamano-h2: 1.75rem;
  --tamano-h3: 1.35rem;
  --tamano-cuerpo: 1.0625rem; /* 17px — legible en celular */
  --tamano-pequeno: 0.9rem;

  /* --- Espaciado --- */
  --espacio-xs: 0.5rem;
  --espacio-sm: 1rem;
  --espacio-md: 2rem;
  --espacio-lg: 3.5rem;
  --espacio-xl: 5.5rem;

  /* --- Otros --- */
  --radio-borde: 4px;
  --ancho-contenido: 1100px;
  --ancho-lectura: 68ch; /* ancho ideal para artículos de blog */
}
