/**
 * Fly456.com — tipografía pro SaaS (Geist Sans, self-hosted).
 *
 * La home WebCard declara Inter sin @font-face (faux-bold 800–950).
 * Este CSS carga Geist real (variable 100–900) y remapea pesos a 400–600.
 *
 * Publicar: bash scripts/deploy-fly456-overrides.sh
 * (sube /fonts/geist/* + /css/fly456-overrides.css y reinyecta el <link>).
 *
 * Alternativa manual: WebCard → Ajustes → CSS personalizado (tras subir las fuentes).
 */

/* ——— Self-host Geist (OFL) — latin + latin-ext ——— */
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/geist/geist-latin-ext-wght-normal.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;
}

@font-face {
  font-family: "Geist";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/geist/geist-latin-wght-normal.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;
}

/* ——— Base ——— */
html,
body,
.page {
  font-family: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif !important;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1, "liga" 1;
  font-weight: 400;
  letter-spacing: -0.011em;
}

/* ——— Cuerpo: 400, lectura cómoda ——— */
.hero p,
.channel-card p,
.channel-desc,
.channel-text,
.compare-item,
.compare-box .subtitle,
.plan-copy,
.faq-item p,
.disclaimer-box,
.final-payment-copy,
.footer-col p,
.footer-copy,
.upgrade-note,
.pricing-trust,
.lead {
  font-weight: 400 !important;
  letter-spacing: -0.01em !important;
}

.compare-item,
.channel-desc,
.faq-item p,
.plan-copy,
.disclaimer-box {
  line-height: 1.6 !important;
}

.compare-box .subtitle,
.pricing-trust,
.upgrade-note {
  font-weight: 500 !important;
}

/* ——— Nav / pills / badges: 500 ——— */
.nav a,
.brand-pill,
.route-pill,
.free-badge,
.channel-user,
.channel-status,
.channel-count,
.channels-bottom-pill,
.hero-point,
.cta-with-price span,
.check,
.channel-btn,
.footer-bottom,
.footer-bottom-links a,
.footer-col a {
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

/* Eyebrows / labels uppercase: 500 + tracking abierto */
.hero-eyebrow,
.saving-hero-eyebrow,
.section-title .eyebrow,
.upgrade-badge,
.route-example-label,
.plan-badge,
.footer-col h3 {
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
}

/* ——— Subtítulos / cards: 600 ——— */
.compare-box h3,
.channel-card h4,
.group-title h3,
.step-card h3,
.faq-item h3,
.footer-title,
.route-example-main,
.plan-duration,
.plan-alerts,
.plan-cost,
.plan-subprice,
.brand-name,
.brand-icon,
.vs-bubble,
.step-number,
.hero-tagline {
  font-weight: 600 !important;
  letter-spacing: -0.025em !important;
}

/* ——— Display + CTAs: 600 (sin 700–950) ——— */
.hero h1,
.hero-compare h2,
.saving-hero h2,
.section-title h2,
.channels-header h2,
.upgrade-card h2,
.final-cta-card h2,
.primary-cta,
.secondary-cta,
.hero-main-btn,
.nav .nav-cta,
.upgrade-btn,
.upgrade-btn span,
.saving-hero-action a,
.saving-hero-action a span,
.plan-cta,
.plan-price {
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
}

.primary-cta,
.secondary-cta,
.hero-main-btn,
.nav .nav-cta,
.upgrade-btn,
.plan-cta,
.channel-btn,
.saving-hero-action a {
  letter-spacing: -0.015em !important;
}

/* ——— Techos en pantallas grandes (menos “hinchado”) ——— */
@media (min-width: 1100px) {
  .hero h1 {
    font-size: clamp(40px, 3.8vw, 52px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.035em !important;
  }

  .saving-hero h2 {
    font-size: clamp(28px, 2.6vw, 38px) !important;
    line-height: 1.12 !important;
  }

  .section-title h2 {
    font-size: clamp(28px, 3vw, 40px) !important;
    line-height: 1.12 !important;
  }

  .channels-header h2,
  .upgrade-card h2,
  .final-cta-card h2 {
    font-size: 30px !important;
    line-height: 1.15 !important;
  }

  .hero-compare h2 {
    font-size: 28px !important;
  }

  .plan-price {
    font-size: 52px !important;
    letter-spacing: -0.04em !important;
    line-height: 1 !important;
  }
}

/* ——— mobile topbar (deploy/fly456-com-mobile-topbar.css) ——— */

@media (max-width: 820px) {
  /* Barra con enlaces + "Configurar Premium" (HTML custom .topbar) */
  header.topbar {
    display: none !important;
  }

  /* Hero como primer bloque visible */
  section.hero {
    padding-top: 32px !important;
    padding-bottom: 48px !important;
  }

  /* Menos margen superior del contenedor blanco en móvil */
  .page {
    margin-top: 0 !important;
  }
}

@media (min-width: 821px) {
  header.topbar {
    display: flex !important;
  }
}