/*
  SPES NOSTRA — Design tokens
  Paleta e identidad definidas en la guía de marca. No se sustituye por
  colores nuevos: las ilustraciones/fotografía pueden tener libertad
  artística, pero la interfaz se reconoce por estos tokens.
*/

:root {
  /* Paleta de marca */
  --color-marfil: #F5F1E8;
  --color-tinta: #292826;
  --color-oro: #B28A4A;
  --color-oliva: #7C846B;
  --color-azul-niebla: #AEBCC2;
  --color-piedra: #D5CCBD;

  /* Superficies */
  --bg-page: var(--color-marfil);
  --bg-surface: #FFFFFF;
  --bg-surface-suave: #FBF9F4;
  --bg-tinta: var(--color-tinta);

  /* Texto */
  --text-principal: var(--color-tinta);
  --text-suave: #5B5850;
  --text-sobre-tinta: var(--color-marfil);
  --text-oro: var(--color-oro);

  /* Bordes */
  --border-suave: rgba(41, 40, 38, 0.12);
  --border-medio: rgba(41, 40, 38, 0.22);

  /* Tipografía */
  --font-serif: "Cormorant Garamond", Georgia, serif;
  --font-sans: "Montserrat", -apple-system, BlinkMacSystemFont, sans-serif;

  /* Espaciado (escala 4pt) */
  --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;

  /* Radios y transiciones: discretos, nada de estética SaaS */
  --radius-s: 4px;
  --radius-m: 8px;
  --radius-l: 16px;
  --transition-suave: 200ms ease;

  /* Contenedor editorial */
  --max-width: 1200px;
  --max-width-texto: 680px;

  /* Sombra mínima, solo para separar tarjetas del fondo marfil */
  --shadow-suave: 0 1px 2px rgba(41, 40, 38, 0.04), 0 4px 16px rgba(41, 40, 38, 0.06);
}
