/* ============================================================
   GONFIXIT · Patch 002 · Ajustes de tamaños y cabecera
   Se anexa al final de styles.css. Sobreescribe lo que necesita.
   ============================================================ */

:root {
  /* Container ligeramente más ancho */
  --container: 1360px;

  /* Cabecera con más aire */
  --nav-pad-y: 22px;
  --nav-height: 96px;

  /* Logo más grande */
  --logo-h-desktop: 56px;
  --logo-h-tablet: 46px;
  --logo-h-mobile: 38px;
}

/* ===== Cabecera respira ===== */

.nav-inner {
  gap: clamp(20px, 3vw, 40px);
}

.nav-links {
  gap: clamp(22px, 2.6vw, 34px);
}
.nav-links > li > a {
  font-size: 14.5px;
}

/* CTA del nav: más generoso */
.nav-cta {
  font-size: 14px;
  padding: 12px 22px;
  border-radius: 10px;
  letter-spacing: -0.01em;
}

/* Selector de idiomas: más espacio interior */
.nav-lang {
  padding: 3px;
}
.nav-lang button {
  font-size: 11.5px;
  padding: 7px 12px;
}

@media (max-width: 1080px) {
  .nav-links { gap: 20px; font-size: 14px; }
}

/* ===== Hero más presente ===== */

.hero {
  padding: clamp(64px, 9vw, 140px) 0 clamp(44px, 6vw, 88px);
}

.hero h1 {
  font-size: clamp(42px, 7.5vw, 120px);
  line-height: 0.94;
  letter-spacing: -0.045em;
}

.hero-side p {
  font-size: clamp(15px, 1.4vw, 19px);
}

.hero-kicker {
  font-size: clamp(11px, 1.4vw, 13.5px);
  margin-bottom: 24px;
}

.hero-bar-val {
  font-size: clamp(26px, 3.3vw, 44px);
}
.hero-bar-lbl {
  font-size: clamp(12px, 1.2vw, 13px);
}

/* ===== Sección, títulos y módulos ===== */

.section {
  padding: clamp(64px, 9vw, 140px) 0;
}

.section-title {
  font-size: clamp(30px, 4.6vw, 64px);
}

.section-lead {
  font-size: clamp(15px, 1.4vw, 17px);
  max-width: 500px;
}

.module {
  padding: clamp(24px, 3.2vw, 36px);
}

.module-name {
  font-size: clamp(24px, 3.2vw, 32px);
}

.module-desc {
  font-size: 14.5px;
}

.module-metric-val {
  font-size: 36px;
}

/* ===== Botones del hero más generosos ===== */

.btn-primary {
  padding: 16px 26px;
  font-size: 15px;
  border-radius: 10px;
}
.btn-ghost {
  padding: 16px 24px;
  font-size: 15px;
  border-radius: 10px;
}

/* ===== Footer respira ===== */

.footer {
  padding-top: clamp(48px, 6vw, 80px);
}

/* En móvil pequeño, el logo no se hace minúsculo */
@media (max-width: 380px) {
  .logo img { height: 34px; }
}

/* ===== Drawer móvil: ajustar a la cabecera más alta ===== */
.nav-mobile-menu {
  top: var(--nav-height);
  max-height: calc(100vh - var(--nav-height));
}
