/* SISTEL · tokens de marca (Brandbook Editorial v2 + prototipo ADN SISTEL)
   95 % monocromo. El azul es una señal: una palabra, un punto, una figura por pantalla. */
:root {
  --sistel-black: #000000;
  --sistel-ink: #171717;        /* negro suave: cuerpo largo */
  --sistel-gray: #6E6E73;       /* eyebrows, notas, metadatos */
  --sistel-gray-2: #8E8E93;     /* gris sobre negro */
  --sistel-surface: #F5F5F7;    /* único fondo permitido */
  --sistel-line: #E5E5EA;       /* separadores, bordes de tabla */
  --sistel-line-dark: #333333;  /* separadores sobre negro */
  --sistel-white: #FFFFFF;
  --sistel-blue: #374EF7;       /* señal */

  --font: "Mulish", -apple-system, "Segoe UI", Roboto, sans-serif;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

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

  --container: 1240px;
  --gutter: 32px;

  --ease: cubic-bezier(.2, .7, .3, 1);
  --t-fast: .15s;
  --t-base: .35s;
  --t-slow: .6s;

  --eyebrow: 600 10.5px/1 var(--font);
  --eyebrow-tracking: .16em;
}

@media (max-width: 720px) {
  :root { --gutter: 18px; }
}