/* =====================================================================
   CELTIC — VARIABLES DEL SISTEMA DE DISEÑO
   ---------------------------------------------------------------------
   Este es el "panel de control" del sitio. TODO lo visual (colores,
   letras, espacios) se define acá una sola vez. Si querés cambiar un
   color en todo el sitio, lo cambiás acá y se actualiza en todas las
   páginas. No hace falta tocar nada más.
   ===================================================================== */

:root {

  /* ---------- COLORES DE LA MARCA (los 5 pedidos) ----------
     Cada color tiene un "código" (empieza con #). Para cambiarlo,
     reemplazá el código entre las llaves. Podés usar un buscador de
     colores online (ej. "color picker") para conseguir el código nuevo. */

  --color-principal:  #2C343C;  /* Azul pizarra casi negro — fondo del logo, encabezados */
  --color-secundario: #C8925A;  /* Dorado / ámbar — botones, links, acentos */
  --color-terciario:  #8A8D93;  /* Gris plata — líneas, detalles, textos secundarios */
  --color-fondo:      #EADFC6;  /* Pergamino — fondo general del sitio */
  --color-alerta:     #A8322E;  /* Rojo apagado — avisos y errores */

  /* ---------- Variantes útiles (derivadas de las de arriba) ----------
     Tonos de apoyo para textos y superficies. Podés ajustarlos también. */

  --color-texto:         #2C343C;  /* Color del texto normal (sobre el pergamino) */
  --color-texto-claro:   #F4ECDD;  /* Texto claro (para usar sobre fondos oscuros) */
  --color-secundario-oscuro: #A9743F; /* Dorado más oscuro, para el "hover" de botones */
  --color-linea:         #D6C7A6;  /* Líneas suaves sobre el pergamino */
  --color-panel:         #F3EAD6;  /* Superficie apenas más clara que el fondo (tarjetas) */

  /* ---------- TIPOGRAFÍAS (las letras) ----------
     Se cargan desde Google Fonts en el <head> de cada página.
     Cinzel = títulos (como el "CELTIC" del logo).
     EB Garamond = texto y relatos (como el menú). */

  --fuente-titulos: 'Cinzel', 'Times New Roman', serif;
  --fuente-texto:   'EB Garamond', Georgia, 'Times New Roman', serif;

  /* ---------- ESPACIOS ----------
     Escala de separaciones para que todo respire parejo.
     (Los valores están en "rem": 1rem ≈ 16px, el tamaño de una letra normal.) */

  --espacio-1: 0.25rem;   /* muy chico */
  --espacio-2: 0.5rem;
  --espacio-3: 1rem;      /* base */
  --espacio-4: 1.5rem;
  --espacio-5: 2.5rem;
  --espacio-6: 4rem;      /* muy grande, separación entre secciones */

  /* ---------- OTROS DETALLES VISUALES ---------- */

  --ancho-maximo: 1100px;         /* Ancho máximo del contenido en pantallas grandes */
  --borde-redondeado: 10px;       /* Esquinas redondeadas de tarjetas y botones */
  --borde-redondeado-chico: 6px;
  --sombra-suave: 0 2px 10px rgba(44, 52, 60, 0.12);
  --sombra-media: 0 6px 22px rgba(44, 52, 60, 0.18);
  --transicion: 0.25s ease;       /* Velocidad de las animaciones suaves */
}
