/* ===================================================================
   TOKENS — godlives.co
   Fuente: web/sistema-visual.md §1. No duplicar valores hardcodeados
   en otros archivos: todo componente consume estas variables.
   =================================================================== */

:root {
  /* Fondos */
  --color-bg:          #fffaf3; /* fondo general del sitio, "papel" */
  --color-bg-alt:      #f7efe1; /* franjas alternas, footer, secciones secundarias */
  --color-bg-suave:    #f4e9d7; /* cajas destacadas: cita, comentario del equipo, tarjeta activa */

  /* Tinta */
  --color-text:        #2c241d; /* texto principal, títulos */
  --color-text-suave:  #55483b; /* párrafos largos, meta, descripciones secundarias */

  /* Acento (marca) */
  --color-accent:         #9a5a2c; /* iconos, bordes destacados, kickers, detalles — NO texto pequeño */
  --color-accent-oscuro:  #6e3f1d; /* CTAs, links interactivos, títulos de énfasis, foco */
  --color-accent-suave:   #c98a4f; /* estados hover claros sobre fondo oscuro, ilustraciones */

  /* Bordes y líneas */
  --color-borde:        #e4cda3; /* bordes de tarjeta, separadores, líneas punteadas */
  --color-borde-suave:  #ecdcb8; /* bordes muy discretos, inputs en reposo */

  /* Cajas especiales (heredadas del libro) */
  --color-disclaimer-bg:     #f1ece1;
  --color-disclaimer-borde:  #c9b28c;

  /* Superficie clara sobre fondo oscuro */
  --color-crema-alta: #fffdf9;

  /* Funcionales — solo estados de formulario, uso mínimo, nunca decorativo */
  --color-exito:  #6f7d52;
  --color-alerta: #9c4a3c;

  /* Overlay para imágenes con texto encima */
  --overlay-oscuro: rgba(44, 36, 29, 0.55);

  /* Tipografía */
  --font-lectura: Georgia, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", "Noto Serif", serif;
  --font-titulos: Georgia, "Palatino Linotype", "Noto Serif", serif;
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --text-xs:   0.8125rem;
  --text-sm:   0.9375rem;
  --text-base: 1.0625rem;
  --text-lg:   1.1875rem;
  --text-xl:   clamp(1.3rem, 4vw, 1.6rem);
  --text-2xl:  clamp(1.6rem, 5vw, 2rem);
  --text-3xl:  clamp(2rem, 7vw, 2.75rem);
  --text-4xl:  clamp(2.3rem, 9vw, 3.4rem);

  --leading-lectura: 1.85;
  --leading-ui:       1.4;
  --leading-titulo:   1.25;

  --medida-lectura: 34rem;

  /* Espaciado */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  0.75rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.25rem;
  --space-xl:  3.5rem;
  --space-2xl: 5rem;
  --space-3xl: 7.5rem;

  /* Radios y sombras */
  --radius-sm:   0.3rem;
  --radius-md:   0.6rem;
  --radius-lg:   1rem;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(44, 36, 29, 0.06);
  --shadow-md: 0 4px 16px rgba(110, 63, 29, 0.08);
  --shadow-lg: 0 12px 32px rgba(110, 63, 29, 0.12);

  /* Contenedores */
  --container-max: 72rem;
  --container-lectura-max: var(--medida-lectura);

  /* Movimiento */
  --duration-fast: 150ms;
  --duration-base: 300ms;
  --duration-slow: 550ms;
  --easing-suave: cubic-bezier(0.4, 0, 0.2, 1);
}