/* =========================================================================
   TOKENS — único punto de tematización del sitio.
   Para clonar este proyecto a otro cliente: cambia las primitivas (paleta,
   fuentes) y revisa las semánticas. Los componentes solo consumen semánticas.
   ========================================================================= */

:root {
  /* ---- Primitivas: paleta Meryma'at (carbón / marfil / piedra / latón) ---- */
  --carbon-950: #0d0e0f;
  --carbon-900: #131416;
  --carbon-800: #1a1c1e;
  --stone-700: #232528;
  --stone-600: #3a3d41;
  --ivory-100: #f1ebdf;
  --ivory-300: #ddd5c4;
  --sand-400: #a89f8e;
  --brass-300: #d8b87e;
  --brass-400: #c6a26a;
  --brass-500: #a98849;

  /* ---- Semánticas: color ---- */
  --color-bg: var(--carbon-900);
  --color-bg-deep: var(--carbon-950);
  --color-surface: var(--carbon-800);
  --color-surface-raised: var(--stone-700);
  --color-text: var(--ivory-100);
  --color-text-soft: var(--ivory-300);
  --color-muted: var(--sand-400);
  --color-accent: var(--brass-400);
  --color-accent-bright: var(--brass-300);
  --color-line: rgba(241, 235, 223, 0.14);
  --color-line-soft: rgba(241, 235, 223, 0.08);
  --color-scrim: rgba(13, 14, 15, 0.55);

  /* ---- Tipografía ---- */
  --font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-body: "Archivo", "Helvetica Neue", system-ui, sans-serif;

  /* Escala fluida (mobile-first, crece con el viewport) */
  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  --text-md: clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
  --text-lg: clamp(1.375rem, 1.2rem + 0.9vw, 1.875rem);
  --text-xl: clamp(1.75rem, 1.4rem + 1.8vw, 2.75rem);
  --text-2xl: clamp(2.25rem, 1.6rem + 3.2vw, 4rem);
  --text-display: clamp(2.625rem, 1.5rem + 5.6vw, 5.75rem);
  --text-mega: clamp(4.5rem, 3rem + 7.5vw, 9rem);

  --leading-tight: 1.04;
  --leading-snug: 1.2;
  --leading-body: 1.65;
  --tracking-wide: 0.18em;

  /* ---- Espaciado ---- */
  --space-2xs: 0.375rem;
  --space-xs: 0.625rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-section: clamp(4.5rem, 3rem + 8vw, 9rem);

  /* ---- Layout ---- */
  --container-max: 1180px;
  --gutter: clamp(1.25rem, 4vw, 3rem);

  /* ---- Forma ---- */
  --radius-sm: 2px;
  --radius-md: 4px;

  /* ---- Movimiento ---- */
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --dur-slow: 700ms;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* ---- Header ---- */
  --header-height: 4.25rem;
}
