@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,600&display=swap');

/* ─────────────────────────────────────────
   BASE · Variables + Reset + Tipografía
   ───────────────────────────────────────── */

:root {
  /* Colores de marca */
  --azul:       #0f52b8;     /* Azul principal suavizado (brand: #004aad) */
  --azul-dark:  #0a3d8f;
  --azul-deep:  #06276a;     /* Para fondos oscuros de hero */
  --azul-claro: #eaf1fd;
  --azul-mid:   #ccdaf7;

  --rojo:       #f04e4e;     /* Rojo marca suavizado (brand: #ff5757) */
  --rojo-vivo:  #ff5757;     /* Para usar con fuentes blancas */
  --rojo-suave: #fef1f1;

  /* Neutros */
  --blanco:     #ffffff;
  --fondo:      #f5f7fb;
  --fondo-alt:  #eef1f8;
  --texto:      #0c1828;
  --gris:       #68758a;
  --gris-claro: #9aa4b3;
  --borde:      #e0e6f0;
  --borde-suave:#edf0f7;
}

*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
}

body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  background: var(--blanco);
  color: var(--texto);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img { display: block; max-width: 100%; }
a { text-decoration: none; }
ul { list-style: none; }

/* ── Utilidades compartidas ── */
.eyebrow {
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--rojo);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.eyebrow::after {
  content: '';
  flex: 0 0 18px;
  height: 1.5px;
  background: var(--rojo);
  opacity: 0.35;
  display: none;
}

h2.titulo {
  font-size: clamp(1.9rem, 3vw, 2.6rem);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -0.8px;
  color: var(--texto);
}
h2.titulo em {
  font-style: italic;
  color: var(--azul);
  font-weight: 700;
}