/* ============================================================
   Loden — brand tokens
   Fuente única de la identidad visual. Si un color, una fuente
   o un espaciado no está aquí, no se usa.

   Hereda de este archivo:
     · el sitio (src/assets/css/site.css)
     · brand-template.html (imágenes de los posts del motor)
     · la plantilla del reporte mensual del cliente
     · las plantillas de artículo

   Última revisión: septiembre 2026
   ============================================================ */

:root {

  /* ---------- COLOR ----------
     La regla, en una línea:
       tinta = la marca · terracota = el acento · menta = señal viva
     Si un color aparece fuera de su papel, está mal puesto.       */

  /* La marca. Texto, titulares, paneles oscuros, el logotipo. */
  --ink:          #12302F;   /* 13.3:1 sobre paper — cuerpo de texto */
  --ink-soft:     #55706E;   /* 5.1:1 sobre paper — texto secundario */

  /* El acento cálido. El punto del logo, enlaces, filos, botones. */
  --ember:        #A8512C;   /* 5.4:1 con texto blanco — apto para botones */
  --ember-soft:   #E8A882;   /* solo fondos y lavados; nunca texto */

  /* Señal viva. SOLO donde algo está ocurriendo:
     indicadores, datos en vivo, estados del sistema, el punto del logo. */
  --glow:         #7FE3D0;   /* usar con texto oscuro encima */

  /* Superficies. */
  --paper:        #FBF8F3;   /* fondo del sitio, crema cálido */
  --paper-doc:    #FDFCF9;   /* fondo de documentos, más suave */
  --paper-2:      #F2EDE4;   /* tablas, bloques de código, cajas */
  --mist:         #E2DACE;   /* bordes, reglas, separadores */

  /* Secundario. Paneles, detalles, fondos oscuros alternativos. */
  --petrol:       #0E5C5E;   /* 7.7:1 con texto blanco */
  --petrol-light: #14807E;   /* nunca para texto pequeño: 4.5:1, justo bajo AA */

  /* Fondo "amanecer": menta arriba a la derecha, albaricoque a la
     izquierda, crema de base. Solo en el sitio y en portadas.
     Nunca dentro de documentos de texto. */
  --wash-mint:    #BFEEDF;
  --wash-apricot: #F7DAC4;


  /* ---------- TIPOGRAFÍA ---------- */

  /* Web */
  --font-display: 'Fraunces', Georgia, serif;        /* titulares y logotipo */
  --font-body:    'Hanken Grotesk', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;  /* etiquetas */

  /* Documentos y PDF */
  --font-doc-head: 'Space Grotesk', sans-serif;
  --font-doc-body: 'Inter', sans-serif;


  /* ---------- ESCALA ---------- */

  --step-1:  0.5rem;
  --step-2:  1rem;
  --step-3:  1.5rem;
  --step-4:  2.5rem;
  --step-5:  4rem;

  --radius-sm: 6px;
  --radius:    12px;
  --radius-pill: 999px;

  --measure: 68ch;        /* ancho máximo de lectura cómoda */
  --content-max: 1120px;  /* ancho del contenedor */
}


/* ============================================================
   REGLAS DE USO — no son decorativas, son la disciplina

   1. El menta nunca es decoración. Si el elemento no representa
      algo que está pasando ahora, no lleva menta.

   2. La terracota es el único color cálido. Por eso la mirada va
      directo a ella: úsala donde quieras que el ojo caiga.

   3. Los documentos van en blanco o --paper-doc, con el logotipo
      arriba, y el color solo en filos y cabeceras. El degradado
      "amanecer" vive en el sitio, nunca en un documento de texto.

   4. Nunca texto pequeño sobre --petrol-light, --ember-soft ni
      --glow: no alcanzan el contraste mínimo.

   5. Cada cliente tendrá su propio archivo de tokens con la misma
      estructura. Este es el de Loden (cliente #0) y sirve de
      plantilla: se copian los nombres, se cambian los valores.
   ============================================================ */
