/* ==========================================================================
   Typography — H1–H6, cuerpo, párrafo introductorio, antetítulo y el
   acento itálico de los titulares.

   Restricción dura: Tiro Bangla solo existe en peso 400 (normal e
   itálica). Bootstrap NO expone la font-family ni el font-weight de los
   headings como variable (--bs-heading-color es la única, y solo para
   color): su reboot trae `font-weight: 500` fijo y hereda la
   font-family del body. Por eso family y weight se fuerzan aquí, con
   una regla normal, no con una variable de Bootstrap. No los vuelvas a
   tocar en ningún componente — la jerarquía se construye con tamaño,
   interlineado, letter-spacing y color, nunca con peso.
   ========================================================================== */

/* --------------------------------------------------------------------
   Escala de headings — mobile-first, tokens de tokens.css.

   Sin utilidades .aq-h1..h6 que desacoplen nivel semántico de tamaño
   visual (auditoría 5.5): es un caso legítimo — aparece en WordPress,
   donde a veces conviene un H3 con aspecto de H2 — pero código muerto
   invita a que se tome la vía canónica sin querer. Si la Fase 8 lo
   necesita, se agrega ahí deliberadamente.
   -------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--aq-font-serif);
	line-height: var(--aq-lh-heading);
}

h1 { font-size: var(--aq-fs-h1); }
h2 { font-size: var(--aq-fs-h2); }
h3 { font-size: var(--aq-fs-h3); }
h4 { font-size: var(--aq-fs-h4); }

/* h5/h6 no tienen tamaño propio en el diseño: se apoyan en la escala de
   cuerpo, conservando la fuente y el peso de heading fijados arriba. */
h5 { font-size: var(--aq-fs-body); }
h6 { font-size: var(--aq-fs-small); }

@media (min-width: 768px) {
	h1 { font-size: var(--aq-fs-h1-md); }
	h2 { font-size: var(--aq-fs-h2-md); }
	h3 { font-size: var(--aq-fs-h3-md); }
	h4 { font-size: var(--aq-fs-h4-md); }
}

@media (min-width: 1200px) {

	h1 { font-size: var(--aq-fs-h1-lg); }
	h2 { font-size: var(--aq-fs-h2-2-lg);}
	h3 { font-size: var(--aq-fs-h3-lg); }
	h4 { font-size: var(--aq-fs-h4-lg); }
}

/* --------------------------------------------------------------------
   Cuerpo de texto
   -------------------------------------------------------------------- */
body {
	font-size: var(--aq-fs-body);
	line-height: var(--aq-lh-body);
	color: var(--aq-text);
}

/* --------------------------------------------------------------------
   Párrafo introductorio (bajo el antetítulo + H2 de una sección)
   No se usa la clase .lead de Bootstrap: sus valores están hardcodeados
   y no pasan por nuestros tokens.
   -------------------------------------------------------------------- */
.aq-lead {
	font-family: var(--aq-font-sans);
	font-size: var(--aq-fs-lead);
	line-height: var(--aq-lh-body);
}

@media (min-width: 768px) {
	.aq-lead { font-size: var(--aq-fs-lead-md); }
}

@media (min-width: 1200px) {
	.aq-lead { font-size: var(--aq-fs-body-lg); }
}

.aq-lead-poli {
	font-family: var(--aq-font-sans);
	font-size: var(--aq-fs-lead);
	line-height: var(--aq-lh-body);
   color: var(--aq-text-2);
}

@media (min-width: 768px) {
	.aq-lead-poli { font-size: var(--aq-fs-lead-md); }
}

@media (min-width: 1200px) {
	.aq-lead-poli { font-size: var(--aq-fs-body-lg); }
}


/* --------------------------------------------------------------------
   Antetítulo — mayúsculas, dorado, letter-spacing amplio.
   Aparece en 7 secciones, siempre en Public Sans (nunca en la serif).
   -------------------------------------------------------------------- */
.aq-overline {
	display: block;
	font-family: var(--aq-font-sans);
	font-size: var(--aq-fs-lead);
	line-height: 1;	
	text-transform: uppercase;
	color: var(--aq-gold);
}
.aq-overline h2{
   font-size:40px;
}

.aq-overline-2 {
	display: block;
	font-family: var(--aq-font-sans);
	font-size: var(--aq-fs-body);	
	line-height: 1;
	letter-spacing: var(--aq-ls-overline-2);
	text-transform: uppercase;
	color: var(--aq-gold-light);
}

/* --------------------------------------------------------------------
   Etiqueta pequeña en mayúsculas — patrón compartido por 5 usos que
   antes lo redefinían cada uno por su cuenta (nav, políticas,
   formulario, datos de contacto, compromisos; auditoría Fase 4.9).
   Solo las 4 propiedades realmente comunes; letter-spacing y color
   quedan fuera de esta clase porque SÍ varían por contexto:

   - Letter-spacing: dos escalones tokenizados (--aq-ls-caption /
     --aq-ls-caption-wide), aplicados con las clases modificadoras de
     abajo. No se unificó a un solo valor: puede ser intención del
     diseño (el tracking en mayúsculas escala con tamaño/función), no
     se puede confirmar sin el archivo original.
   - Color: se deja en la clase específica de cada componente (nunca
     acá), junto con cualquier otra declaración propia de ese contexto
     (display, text-decoration, position, etc.).

   Uso: aplicar junto a la clase modificadora de tracking y a la clase
   propia del componente, nunca reemplazándolas:
   <a class="aq-header__link aq-caption-label aq-caption-label--wide">
   -------------------------------------------------------------------- */
.aq-caption-label {
	font-family: var(--aq-font-sans);
	font-size: var(--aq-fs-body1);
   font-weight: var(--aq-fw-semibold);
	text-transform: uppercase;
}

.aq-caption-label-2 {
	font-family: var(--aq-font-sans);
	font-size: var(--aq-fs-h4);
   font-weight: var(--aq-fw-semibold);
	text-transform: capitalize;
   color: black;
}

.aq-caption-label--narrow {
	letter-spacing: var(--aq-ls-caption);
}

.aq-caption-label--wide {
	letter-spacing: var(--aq-ls-caption-wide);
}

/* --------------------------------------------------------------------
   Wordmark de marca — "Aquila Capital" en serif mayúscula, usado en
   header, menú móvil y footer (auditoría Fase 4.9). El tamaño (y el
   margen, donde aplique) queda en la clase propia de cada lugar,
   aplicada junto a esta en el HTML. El line-height NO se centraliza:
   solo el header lo necesita (título en dos líneas con <br>); meterlo
   aquí cambiaría el alto de línea de una sola línea del menú móvil y
   del footer, que hoy heredan el line-height del cuerpo.
   -------------------------------------------------------------------- */
.aq-brand-wordmark {
	font-family: var(--aq-font-serif);	
	letter-spacing: var(--aq-ls-wordmark);
	text-transform: uppercase;
}

/* --------------------------------------------------------------------
   Número decorativo — serif dorado usado como índice o cifra grande
   (Servicios, Valores y Principios, Trayectoria; auditoría Fase 4.9).
   Solo lo realmente común; tamaño y margen quedan en la clase propia de
   cada sección/componente, aplicada junto a esta en el HTML:
   <p class="aq-service-card__number aq-display-number">01.</p>
   -------------------------------------------------------------------- */
.aq-display-number {
	font-family: var(--aq-font-serif);
	line-height: 1;
	color: var(--aq-gold-light);
}
.aq-display-number-2 {
	font-family: var(--aq-font-serif);	
	line-height: 1;
	color: var(--aq-gold-2);
}

/* --------------------------------------------------------------------
   Acento itálico de los titulares (hero, banner interior).
   Itálica REAL de Tiro Bangla — nunca una oblicua sintética ni un peso
   distinto de 400.
   -------------------------------------------------------------------- */
.aq-accent-italic {
	font-family: var(--aq-font-serif);
	font-style: italic;	
	color: var(--aq-gold-light);
}