/* ==========================================================================
   THE CREATIVE ARCHIVE — tokens
   Concepto: una sala blanca con una ventana circular. Al cruzarla, el universo
   azul: un planeta cuyas órbitas llevan a cada sección. Después, el archivo
   (secciones editoriales en blanco frío) y el cierre en azul.
   Tema único y deliberado (sin modo oscuro): la dirección de arte define sus fondos.
   ========================================================================== */
:root {
  color-scheme: light;

  --paper: #F7F8FA;        /* blanco frío: dominante en el archivo */
  --ink: #15171B;          /* grafito */
  --blue: #1B2D66;         /* azul navy de marca (con la textura de tela en los fondos) */
  --blue-ui: #1B2D66;      /* el mismo azul para acentos sobre papel */
  --chrome: #B8C0C9;       /* plata */
  --halo: #B4C2EA;         /* acento claro sobre el azul (nodos, palabras destacadas) */

  --mist: #E6EBF0;
  --ink-2: #444A53;        /* 8.4:1 sobre --paper */
  --ink-3: #636A74;        /* 5.2:1 sobre --paper */
  --rule: rgb(21 23 27 / 0.14);
  --on-blue: #FFFFFF;
  --on-blue-2: rgb(255 255 255 / 0.78);
  --on-blue-rule: rgb(255 255 255 / 0.9);

  --font-sans: "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-serif: "Instrument Serif", "Iowan Old Style", "Times New Roman", Georgia, serif;

  --fs-meta: 0.8125rem;
  --fs-small: 0.875rem;
  --fs-body: clamp(1rem, 0.95rem + 0.22vw, 1.1875rem);
  --fs-lede: clamp(1.125rem, 0.95rem + 0.7vw, 1.5rem);
  --fs-h3: clamp(1.5rem, 1.1rem + 1.4vw, 2.5rem);
  --fs-h2: clamp(2.6rem, 1.2rem + 5.6vw, 7rem);
  --fs-mega: clamp(3.4rem, 0.8rem + 10.5vw, 12.5rem);

  --track-mega: -0.075em;
  --track-display: -0.055em;
  --track-tight: -0.03em;
  --track-label: 0.06em;

  --gutter: max(16px, env(safe-area-inset-left, 0px), 4vw);
  --gutter-r: max(16px, env(safe-area-inset-right, 0px), 4vw);
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: clamp(5rem, 2.5rem + 9vw, 11rem);

  --ease-out: cubic-bezier(0.2, 0.7, 0.1, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-1: 180ms;
  --dur-2: 420ms;
  --dur-3: 900ms;

  --header-h: 88px;
}
@media (max-width: 699px) {
  :root { --header-h: 72px; }
}