/* ==========================================================================
   TIPOGRAFÍA Y JERARQUÍA VISUAL — CONSTRUCCIONES JGP2410 C.A.
   Fuente de verdad: MASTER_CONTEXT.md y docs/DESIGN_SYSTEM.md
   ========================================================================== */

/* Fallback local / sistema: si Barlow está instalada en el sistema del usuario,
   se aprovecha localmente. Si no, se utilizan fuentes sans-serif condensadas
   y neutras del sistema operativo sin descargas externas ni archivos ficticios. */

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Barlow Regular'), local('Barlow-Regular');
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: local('Barlow Medium'), local('Barlow-Medium');
}

@font-face {
  font-family: 'Barlow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Barlow Bold'), local('Barlow-Bold');
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: local('Barlow Condensed ExtraBold'), local('BarlowCondensed-ExtraBold');
}

/* ==========================================================================
   JERARQUÍA DE TITULARES (H1 - H4)
   Titulares condensados, en mayúsculas, contundentes y de estilo industrial.
   ========================================================================== */

h1,
h2,
h3,
h4,
.heading-hero,
.heading-1,
.heading-2,
.heading-3,
.heading-4 {
  font-family: var(--font-headings);
  font-weight: var(--font-weight-extrabold);
  text-transform: uppercase;
  line-height: var(--line-height-tight);
  color: var(--color-deep-blue);
  letter-spacing: -0.01em;
}

.heading-hero {
  font-size: var(--font-size-hero);
  letter-spacing: -0.02em;
}

h1,
.heading-1 {
  font-size: var(--font-size-h1);
  letter-spacing: -0.015em;
}

h2,
.heading-2 {
  font-size: var(--font-size-h2);
}

h3,
.heading-3 {
  font-size: var(--font-size-h3);
}

h4,
.heading-4 {
  font-size: var(--font-size-h4);
}

/* ==========================================================================
   TEXTO CORRIDO Y ELEMENTOS EDITORIALES
   ========================================================================== */

p {
  margin-bottom: var(--space-4);
}

p:last-child {
  margin-bottom: 0;
}

.lead {
  font-size: var(--font-size-lead);
  line-height: var(--line-height-normal);
  color: var(--color-gray-muted);
}

.text-sm {
  font-size: var(--font-size-sm);
  line-height: var(--line-height-snug);
}

.text-xs {
  font-size: var(--font-size-xs);
  line-height: var(--line-height-snug);
}

.text-muted {
  color: var(--color-gray-muted);
}

.text-light {
  color: var(--color-white);
}

.text-yellow {
  color: var(--color-yellow);
}

.text-bold {
  font-weight: var(--font-weight-bold);
}

.text-medium {
  font-weight: var(--font-weight-medium);
}

/* Subtítulos de sección y etiquetas técnicas */
.section-kicker {
  display: inline-block;
  font-family: var(--font-body);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-primary-blue);
  margin-bottom: var(--space-2);
}

.section-kicker--yellow {
  color: var(--color-yellow);
}