/* isnos ai · tokens de marca · noviembre de 2026 */
@import url("https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@600&display=swap");

:root {
  /* Paleta */
  --isnos-petroleo: #0B3C49;
  --isnos-lima: #C6D84A;
  --isnos-niebla: #EEF2F3;
  --isnos-tinta: #152126;
  --isnos-petroleo-medio: #3B6470;
  /* Apoyo: el "ai" sobre petróleo y las líneas del patrón */
  --isnos-petroleo-suave: #BCD0D4;
  --isnos-patron: #12495A;
  --isnos-blanco: #FFFFFF;

  /* Uso */
  --color-fondo: var(--isnos-niebla);
  --color-superficie: var(--isnos-blanco);
  --color-texto: var(--isnos-tinta);
  --color-texto-suave: var(--isnos-petroleo-medio);
  --color-marca: var(--isnos-petroleo);
  --color-fondo-oscuro: var(--isnos-petroleo);
  --color-texto-sobre-oscuro: var(--isnos-niebla);
  /* El lima solo sobre petróleo o tinta (7.6:1). Sobre niebla o blanco no llega a 1.5:1: nunca texto lima en claro. */
  --color-acento-sobre-oscuro: var(--isnos-lima);
  --color-enlace: var(--isnos-petroleo-medio);

  /* Tipografía */
  --font-logo: "Space Grotesk", system-ui, sans-serif;     /* solo logo; el wordmark ya va en curvas */
  --font-texto: "Figtree", "Avenir Next", system-ui, sans-serif;
  --font-datos: "JetBrains Mono", ui-monospace, Menlo, monospace;   /* cifras, etiquetas, código */
  --peso-texto: 400; --peso-medio: 500; --peso-titulo: 700;
  --texto-xs: 0.75rem; --texto-sm: 0.875rem; --texto-base: 1.0625rem; --texto-lg: 1.25rem;
  --texto-xl: 1.625rem; --texto-2xl: 2.25rem; --texto-3xl: 3.25rem;
  --interlineado: 1.5; --interlineado-titulo: 1.12;
  --tracking-etiqueta: 0.08em;

  /* Forma y espacio */
  --radio-sm: 8px; --radio-md: 14px; --radio-lg: 20px;
  --radio-isotipo: 22%;   /* contenedor cuadrado del isotipo */
  --espacio-1: 4px; --espacio-2: 8px; --espacio-3: 12px; --espacio-4: 16px; --espacio-6: 24px; --espacio-8: 32px; --espacio-12: 48px; --espacio-16: 64px;
  --ancho-contenido: 1120px;
}

/* Base opcional */
body { margin: 0; background: var(--color-fondo); color: var(--color-texto); font-family: var(--font-texto); font-size: var(--texto-base); line-height: var(--interlineado); }
h1, h2, h3 { color: var(--color-marca); line-height: var(--interlineado-titulo); font-weight: var(--peso-titulo); }
a { color: var(--color-enlace); }
.isnos-etiqueta { font-family: var(--font-datos); font-size: var(--texto-xs); letter-spacing: var(--tracking-etiqueta); text-transform: uppercase; color: var(--color-texto-suave); }
.isnos-cifra { font-family: var(--font-datos); font-variant-numeric: tabular-nums; }
.isnos-oscuro { background: var(--color-fondo-oscuro); color: var(--color-texto-sobre-oscuro); }
.isnos-oscuro .isnos-acento { color: var(--color-acento-sobre-oscuro); }