/* Hallmark · tokens · La Ermita Full Sabor
 * theme: custom (tuned) · vibe: "amarillo canario, tinta negra, sazón de calle"
 * axes: light / roman-serif / chromatic-amber ~95°
 * Export portable: pegar tal cual en el proyecto Astro cuando se construya el sitio real.
 */

:root {
  /* ---- Color ---------------------------------------------------------- */
  /* Papel crema, tintado hacia el amarillo de marca. Nunca #fff. */
  --color-paper:      oklch(96.5% 0.014 92);
  --color-paper-2:    oklch(93.5% 0.018 92);
  --color-paper-3:    oklch(90.0% 0.020 92);

  /* Tinta: el negro de la marca, calentado. Nunca #000. */
  --color-ink:        oklch(19% 0.012 92);
  --color-ink-2:      oklch(38% 0.012 92);
  /* L 44 %, no 52 %: a 52 % el texto pequeño gris se queda en 3,8:1
     sobre el papel y no llega al 4,5:1 que pide la WCAG. */
  --color-muted:      oklch(44% 0.012 92);

  --color-rule:       oklch(80.0% 0.016 92);
  --color-rule-2:     oklch(87.5% 0.014 92);

  /* Amarillo de marca. Se usa como señal, no como fondo general. */
  --color-accent:     oklch(86% 0.175 95);
  --color-accent-2:   oklch(79% 0.165 88);
  --color-accent-ink: var(--color-ink);

  /* El amarillo no da contraste suficiente para un anillo de foco sobre
     papel claro: el foco usa el mismo tono, mucho más oscuro. */
  --color-focus:      oklch(45% 0.135 92);

  /* ---- Tipografía ----------------------------------------------------- */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body:    "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;

  --text-xs:        0.75rem;
  --text-sm:        0.875rem;
  --text-base:      1rem;
  --text-lg:        1.125rem;
  --text-xl:        1.375rem;
  --text-2xl:       1.75rem;
  --text-3xl:       2.25rem;
  --text-4xl:       3rem;
  --text-display-s: clamp(2.25rem, 5.5vw, 3.75rem);
  --text-display:   clamp(2.75rem, 8vw, 5.5rem);

  /* ---- Espacio (escala 4pt) ------------------------------------------- */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4.5rem;
  --space-4xl: 7rem;

  /* ---- Trazo y radios -------------------------------------------------- */
  --rule-hair:    1px;
  --rule-thick:   3px;
  --rule-gap:     3px;   /* separación de la doble regla de la cabecera */
  --radius-sm:    4px;
  --radius-md:    10px;
  --radius-pill:  999px;

  /* ---- Movimiento ------------------------------------------------------ */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-short:   120ms;
  --dur-mid:     220ms;
  --dur-long:    420ms;

  /* ---- Capas ----------------------------------------------------------- */
  --z-base:    0;
  --z-raised:  10;
  --z-sticky:  20;
  --z-nav:     30;
  --z-overlay: 40;
  --z-top:     50;
}