/* ==========================================================================
   CUENTO DE HILOS — DESIGN TOKENS
   Color extraído de MANIFESTO/ebook_html/index.html (fuente de la verdad).
   El azul institucional (--cdh-teal) es un ACENTO, nunca un fondo dominante.
   Ver web/memoria/02-sistema-de-diseno.md
   ========================================================================== */

:root {
  /* Color — institucional (uso máximo recomendado: 10–15%) */
  --cdh-teal: #0E8C8A;
  --cdh-teal-dark: #0A6664;
  --cdh-teal-deep: #08514F;
  --cdh-teal-tint: #E7F3F2;

  /* Color — neutros (~80% del sistema) */
  --cdh-ivory: #F8F4EC;
  --cdh-paper: #FDFCFA;
  --cdh-sand: #EAE1CC;
  --cdh-linen: #E3DBC6;
  --cdh-ink: #242320;
  --cdh-ink-soft: #5B564C;
  --cdh-ink-faint: #8C8677;
  --cdh-rule: #DAD1BC;
  --cdh-linen-soft: #F1ECDE;  /* variante clara del lino, para franjas sin peso visual */
  --cdh-teal-mist: #CFE8E6;   /* texto secundario sobre fondos teal oscuros */

  /* Tipografía */
  --font-serif: 'Fraunces', serif;
  --font-sans: 'Inter', -apple-system, sans-serif;
  --font-jp: 'Noto Serif JP', 'Fraunces', serif;
  --font-jp-sans: 'Noto Sans JP', 'Inter', sans-serif;

  --fs-h1: clamp(2.3rem, 5vw + 1rem, 4.4rem);
  --fs-h2: clamp(1.6rem, 2.4vw + 1rem, 2.5rem);
  --fs-h3: clamp(1.2rem, 1.4vw + 1rem, 1.55rem);
  --fs-lede: clamp(1.08rem, 1vw + 1rem, 1.3rem);
  --fs-body: 1.05rem;
  --fs-kicker: 0.72rem;
  --fs-note: 0.82rem;

  /* Espaciado — generoso, editorial */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.75rem;
  --space-4: 3rem;
  --space-5: 4rem;
  --space-6: 5.5rem;
  --space-7: 8rem;

  /* Retícula — el margen mínimo se sube de 1.25rem a 1.75rem: en pantallas
     medianas nunca debe sentirse que el texto está pegado al borde. */
  --max-width: 1360px;
  --margin-edge: clamp(1.75rem, 6vw, 6.5rem);

  /* Movimiento — lento, invisible */
  --ease-editorial: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-slow: 1100ms;
  --duration-med: 650ms;
}