/* ------------------------------------------------------------------
   Tipografía
   Archivo para la voz (grotesca industrial, muy apretada en tamaños
   grandes), Inter para leer, JetBrains Mono para todo lo que es un
   dato medido — así el laboratorio tiene su propio idioma visual.
   ------------------------------------------------------------------ */

body {
    font-family: var(--font-body);
    font-size: var(--fs-body);
    line-height: var(--lh-loose);
    color: var(--fg);
    background: var(--bg);
    font-feature-settings: 'kern' 1, 'liga' 1;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
    font-family: var(--font-display);
    font-weight: 800;
    line-height: var(--lh-tight);
    letter-spacing: var(--tr-display);
    text-wrap: balance;
}

.t-mega {
    font-family: var(--font-display);
    font-size: var(--fs-mega);
    font-weight: 800;
    line-height: 0.88;
    letter-spacing: -0.045em;
}

.t-xxl { font-size: var(--fs-xxl); line-height: var(--lh-tight); }
.t-xl  { font-size: var(--fs-xl);  line-height: var(--lh-snug); }
.t-l   { font-size: var(--fs-l);   line-height: var(--lh-snug); letter-spacing: -0.02em; }

.t-m {
    font-size: var(--fs-m);
    line-height: var(--lh-normal);
    font-weight: 400;
    letter-spacing: -0.01em;
}

/* Entradilla: el párrafo que sostiene un titular. Más grande que el
   cuerpo y más claro de color, para que se lea como voz y no como texto. */
.t-lead {
    font-size: clamp(1.125rem, 1.6vw, 1.4375rem);
    line-height: 1.5;
    color: var(--fg-muted);
    max-width: 52ch;
    text-wrap: pretty;
}

p {
    max-width: var(--measure);
    text-wrap: pretty;
}

/* Etiqueta mono: numeración de sección, kickers, unidades.
   Es la voz del instrumento. */
.t-label {
    font-family: var(--font-mono);
    font-size: var(--fs-label);
    font-weight: 500;
    letter-spacing: var(--tr-label);
    text-transform: uppercase;
    line-height: 1;
    color: var(--fg-muted);
}

.t-label--signal { color: var(--signal-text); }

/* Cifra grande: los datos de capacidad y de laboratorio.
   Tabular para que no bailen los dígitos al contar. */
.t-figure {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(2.75rem, 6vw, 5.5rem);
    line-height: 0.9;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
}

.t-unit {
    font-family: var(--font-mono);
    font-size: clamp(0.875rem, 1.1vw, 1rem);
    font-weight: 400;
    letter-spacing: 0.04em;
    color: var(--fg-muted);
}

.t-muted { color: var(--fg-muted); }

/* Una palabra suelta en el acento, dentro de un titular. Se usa con
   cuentagotas: si se subraya todo, no se subraya nada. */
.t-accent { color: var(--signal); }

strong, b { font-weight: 600; }

::placeholder {
    color: var(--fg-muted);
    opacity: 1;
}
