/* =====================================================================
   Fuentes de Ensutex — decisión de Carlitos del 22-09-2026.
   · Títulos: Hussar Bold (KineticPlasma / Robert Jablonski, SIL OFL).
     Viene en un solo grosor: se declara para todo el rango para que el
     navegador no la engorde por su cuenta.
   · Texto: Jost (indestructible type, SIL OFL), geométrica estilo Futura.
     Reemplaza a Geo Sans Light, que pedía donación para uso comercial.
   Las otras marcas NO cambian: ModoFan usa Saira Stencil One + Manrope y
   REBXN Bebas Neue + Space Grotesk.
   Todo local, con font-display: swap (nada de Google Fonts en caliente).
   ===================================================================== */

@font-face {
  font-family: 'Hussar Bold';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(../fonts/hussar-bold/hussar-bold-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url(../fonts/jost/jost-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url(../fonts/jost/jost-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  --ens-font-display-family: 'Hussar Bold', 'Jost', system-ui, -apple-system, sans-serif;
  --ens-font-body-family: 'Jost', system-ui, -apple-system, sans-serif;
  /* Nombres viejos que algunas hojas leen con `var(--font-display, …)`. */
  --font-display-family: var(--ens-font-display-family);
  --font-body-family: var(--ens-font-body-family);
}

/* =====================================================================
   RITMO TIPOGRÁFICO DE ENSUTEX — 22-09-2026
   ---------------------------------------------------------------------
   Lo que pidió Carlitos: "ojo con los interlineados". El problema era que
   los títulos grandes venían con line-height 1 (Tailwind) y con
   `tracking-tighter` (-0.05em): las líneas quedaban pegadas y la tilde de
   una mayúscula (Á, É, Ó, Ñ) tocaba la línea de arriba.
   Aquí se les da aire. NO se cambia ningún tamaño de letra ni de botón:
   sólo interlineado, interletrado y el grosor real de cada fuente.

   Las páginas de marca quedan fuera: ModoFan (body.mf) y REBXN (body.rx)
   tienen su propia tipografía y su propio ritmo. Tampoco se toca
   assets/brands/**.

   ¿Por qué `!important` y por qué cada regla va escrita DOS veces? Porque
   cada sección trae su interlineado escrito a mano en su propia hoja y con
   `!important` (`.ens-faq h2 { line-height: 1.04 !important }`,
   `#catalogo h2 { line-height: 1 !important }`,
   `#contacto h2 { line-height: 1 !important }`, los `tracking-tighter` de
   Tailwind…). Entre dos reglas `!important` gana la más específica, así que
   la segunda versión de cada regla (la que lleva `main#main-content`) existe
   sólo para tener un id en el selector y poder ganarle a esas reglas con id.
   Ningún tamaño de letra ni de botón se toca: sólo interlineado, interletrado
   y grosor.
   ===================================================================== */

/* --- 1 · Los títulos van en Hussar Bold ----------------------------------
   Hussar Bold trae UN solo grosor. Se declara `font-weight: 400` y
   `font-synthesis: none` para que el navegador no la engorde por su cuenta
   cuando una clase de Tailwind pide `font-black` (900). */
body:not(.mf):not(.rx) :is(h1, h2, h3, h4, h5, h6, .font-display,
    .ens-doors__title, [id$="-title"], [id$="__title"], [class*="title"]),
body:not(.mf):not(.rx) main#main-content :is(h1, h2, h3, h4, h5, h6, .font-display,
    .ens-doors__title, [id$="-title"], [id$="__title"], [class*="title"]) {
  font-family: var(--ens-font-display-family);
  font-weight: 400 !important;
  font-synthesis: none;
  /* Anula el `tracking-tighter` (-0.05em) de Tailwind: apretaba las letras. */
  letter-spacing: -0.01em !important;
  /* Títulos chicos y medianos: 1.2 da aire de sobra (se pedía ≥ 1.2). */
  line-height: 1.2 !important;
}

/* --- 2 · Títulos en MAYÚSCULAS: todavía más aire -------------------------
   La tilde de una Á/É/Ó mayúscula sube por encima de la altura de la
   mayúscula: en Hussar, a 48px, la tinta de una É llega a 56px sobre la línea
   base mientras la caja de la fuente declara 43px. Con el interlineado a 1.12
   la tilde se metía en la línea de arriba (se midió: 2,3px de choque). Por eso
   1.22: 58,6px de avance contra los 57px que hacen falta. */
body:not(.mf):not(.rx) :is(h1, h2, h3, h4, h5, h6, .font-display,
    .ens-doors__title, [id$="-title"], [id$="__title"],
    [class*="__title"], [class*="section-title"]):is(.uppercase, [class*="uppercase"]),
body:not(.mf):not(.rx) main#main-content :is(h1, h2, h3, h4, h5, h6, .font-display,
    .ens-doors__title, [id$="-title"], [id$="__title"],
    [class*="__title"], [class*="section-title"]):is(.uppercase, [class*="uppercase"]) {
  line-height: 1.22 !important;
}

/* El titular del hero va en mayúsculas, pero las hereda del bloque que lo
   contiene: por eso el bloque de arriba no lo ve (busca la clase .uppercase).
   Se queda con el 1.2 del bloque 1, que ya es más que el 1.1875 que pide una
   tilde de mayúscula a 48px (se midió: 57,6px de avance contra 57px), y así el
   hero no cambia de alto más de lo justo: la composición del hero en celular
   la está tocando otro compañero y ahí no se mete nadie. */

/* --- 3 · Etiquetas y "eyebrows" -----------------------------------------
   Son rótulos chicos en mayúscula, no titulares: se quedan en la fuente de texto
   (Antes decía Jost y Hussar; desde el 03-oct la familia de texto es Archivo y la de
   titulares Anton, y el token --ens-font-body-family de abajo es el que manda.)
   Va después del bloque de títulos, y con `!important` para poder pisarlo. */
body:not(.mf):not(.rx) :is(.ens-eyebrow, .lista-eyebrow, .toc-title,
    [class*="eyebrow"], [class*="kicker"], [class*="__label"],
    .ens-process-step__number),
body:not(.mf):not(.rx) main#main-content :is(.ens-eyebrow, .lista-eyebrow, .toc-title,
    [class*="eyebrow"], [class*="kicker"], [class*="__label"],
    .ens-process-step__number) {
  font-family: var(--ens-font-body-family);
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.5 !important;
}

/* --- 4 · Texto corrido --------------------------------------------------
   Párrafos, listas y bajadas: Jost 400 con interlineado 1.6. Se limita a
   `main` para no alterar la geometría del menú ni del cajón móvil. */
body:not(.mf):not(.rx) main :is(p, li, .lead, dd, dt, blockquote),
body:not(.mf):not(.rx) main#main-content :is(p, li, .lead, dd, dt, blockquote) {
  font-family: var(--ens-font-body-family);
  font-weight: 400;
  line-height: 1.6 !important;
}

/* Las bajadas que acompañan a un titular grande van algo más sueltas. */
body:not(.mf):not(.rx) main :is(.lead, [class*="__lead"], [class*="__intro"],
    [class*="__subtitle"], [class*="__bajada"]),
body:not(.mf):not(.rx) main#main-content :is(.lead, [class*="__lead"], [class*="__intro"],
    [class*="__subtitle"], [class*="__bajada"]) {
  line-height: 1.62 !important;
}

