/* =========================================================
   FLYWITHUS — RESPONSIVE PATCH 2026
   Aditivo: NO modifica desktop ≥1100px.
   Aplica solo en mobile/tablet (<860px) o cuando especifica.
   ========================================================= */

/* ---------------------------------------------------------
   Reduced motion (global, todos los viewports)
   --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  [data-parallax] { transform: none !important; }
}

/* ---------------------------------------------------------
   Hover effects sólo en hover-capable devices
   --------------------------------------------------------- */
@media (hover: none) and (pointer: coarse) {
  .feat:hover, .plan:hover, .gloss:hover,
  .fleet3-card:hover, .fleet3-card:hover .fleet3-card__media,
  .facility:hover, .reel__frame:hover, .spec:hover,
  .instr-card:hover, .intl-strip:hover, .nav__links a:hover,
  .dossier:hover, .boarding:hover,
  [data-magnetic]:hover {
    transform: none !important;
  }
  [data-magnetic] { transform: none !important; }
}

/* ---------------------------------------------------------
   Inputs 16px en mobile (evita auto-zoom iOS)
   --------------------------------------------------------- */
@media (max-width: 599px) {
  input, textarea, select { font-size: 16px !important; }
}

/* ---------------------------------------------------------
   Safe-area-inset (notch / home-indicator)
   --------------------------------------------------------- */
.fw-whatsapp { bottom: max(20px, env(safe-area-inset-bottom)); }

/* ---------------------------------------------------------
   HAMBURGER button
   --------------------------------------------------------- */
.nav__burger {
  display: none;
  background: transparent;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  width: 44px; height: 44px;
  padding: 0;
  cursor: pointer;
  position: relative;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: inherit;
}
.nav__burger:focus-visible {
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(27,58,107,0.4);
}
.nav__burger span {
  display: block;
  width: 18px; height: 1.5px;
  background: var(--white);
  transition: transform 220ms var(--ease), opacity 220ms var(--ease);
  border-radius: 1px;
}
body.is-menu-open .nav__burger span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
body.is-menu-open .nav__burger span:nth-child(2) { opacity: 0; }
body.is-menu-open .nav__burger span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

/* ---------------------------------------------------------
   MOBILE MENU overlay
   --------------------------------------------------------- */
.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgba(10,10,10,0.94);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  display: none;
  flex-direction: column;
  padding: 96px 24px 32px;
  padding-bottom: max(32px, env(safe-area-inset-bottom));
  overflow-y: auto;
  opacity: 0;
  transition: opacity 240ms var(--ease);
}
body.is-menu-open .mobile-menu { display: flex; opacity: 1; }
body.is-menu-open { overflow: hidden; }
.mobile-menu__head {
  font-family: ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--fg-3);
  padding-bottom: 18px;
  border-bottom: 1px dashed var(--line);
  margin-bottom: 4px;
}
.mobile-menu a, .mobile-menu .menu-item {
  font-family: inherit;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--white);
  padding: 18px 4px;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  background: transparent;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.mobile-menu a::after, .mobile-menu .menu-item::after {
  content: '→';
  font-size: 18px;
  color: var(--fg-3);
  font-weight: 400;
  transition: transform 220ms var(--ease), color 220ms var(--ease);
}
.mobile-menu a:hover::after, .mobile-menu .menu-item:hover::after {
  color: var(--brand);
  transform: translateX(4px);
}
.mobile-menu__cta {
  margin-top: 24px !important;
  background: var(--brand) !important;
  color: var(--white) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  border: 0 !important;
  border-radius: var(--radius) !important;
  padding: 18px 28px !important;
  justify-content: center !important;
  text-align: center !important;
  text-transform: uppercase !important;
  min-height: 56px !important;
}
.mobile-menu__cta::after { display: none !important; }
.mobile-menu__cta:hover { background: var(--brand-hover) !important; }
.mobile-menu__contact {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px dashed var(--line);
  font-family: ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fg-3);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mobile-menu__contact a {
  font: inherit;
  font-size: 11px;
  color: var(--fg-2);
  padding: 0;
  border: 0;
  min-height: auto;
  display: inline-block;
}
.mobile-menu__contact a::after { display: none; }

/* ---------------------------------------------------------
   MOBILE BREAKPOINT (<860px)
   --------------------------------------------------------- */
@media (max-width: 859px) {
  .nav__burger { display: inline-flex; }
  .nav__links { display: none !important; }
  .nav__lang { display: none; }
  .nav__right > .btn:not(.nav__burger) { display: none; }
  .nav__right { gap: 8px; }

  /* Headlines clamp mins más chicos (desktop intacto) */
  .t-display { font-size: clamp(36px, 9vw, 132px); text-wrap: balance; }
  .t-h1 { font-size: clamp(28px, 5.5vw, 76px); text-wrap: balance; }
  .t-h2 { font-size: clamp(24px, 4vw, 52px); text-wrap: balance; }

  /* Touch targets ≥48px */
  .btn { min-height: 48px; padding: 14px 24px; }
  .btn--lg { min-height: 56px; }
  .btn--sm { min-height: 40px; }
  .faq summary { min-height: 56px; }
  .footer__col a { min-height: 44px; display: inline-flex; align-items: center; }

  /* Plans mobile */
  .plans { grid-template-columns: 1fr !important; gap: 20px !important; }
  .plan--featured {
    transform: none !important;
    order: -1;
    border-width: 2px;
    box-shadow: 0 8px 32px rgba(27,58,107,0.25);
  }
  .plan--featured:hover { transform: none !important; }
  .plan .btn { width: 100%; justify-content: center; }

  /* Timeline vertical con línea conectora izquierda */
  .timeline {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
    padding-left: 36px !important;
    position: relative;
    row-gap: 32px !important;
  }
  .timeline::before {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    left: 12px !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 1px !important;
    height: auto !important;
    background: var(--border-on-dark) !important;
  }
  .tnode { padding-right: 0; }
  .tnode__dot {
    position: absolute;
    left: -32px;
    top: 22px;
    margin: 0;
  }
  .timeline__bar { display: none !important; }

  /* Compare table — scroll horizontal en mobile */
  .compare {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .compare table { min-width: 600px; }

  /* Hero compact reduce padding mobile */
  .hero { padding-top: 100px; }
  .hero--compact { padding-top: 120px !important; padding-bottom: 60px !important; }

  /* Hero CTAs full-width */
  .hero__actions .btn { flex: 1 1 auto; }

  /* Scroll-cue es afordancia de desktop, oculta en mobile */
  .scroll-cue { display: none !important; }

  /* === Carrera: Respaldo institucional grid (inline 3-col) ===
     Override del style inline grid-template-columns:repeat(3,1fr) */
  section[style*="background:var(--bg-2)"] [style*="grid-template-columns:repeat(3,1fr)"],
  section[style*="background:var(--brand)"] [style*="grid-template-columns:repeat(3,1fr)"] {
    grid-template-columns: 1fr 1fr !important;
    gap: 1px !important;
  }

  /* === Carrera: Programas destacados grid (inline 1fr 1fr) ===
     Override inline grid-template-columns:1fr 1fr */
  .section [style*="grid-template-columns:1fr 1fr"][style*="border:1px solid var(--line)"] {
    grid-template-columns: 1fr !important;
  }
  .section [style*="grid-template-columns:1fr 1fr"][style*="border:1px solid var(--line)"] > article {
    border-right: 0 !important;
    border-bottom: 1px solid var(--line) !important;
    min-height: auto !important;
  }
  .section [style*="grid-template-columns:1fr 1fr"][style*="border:1px solid var(--line)"] > article:last-child {
    border-bottom: 0 !important;
  }

  /* Carrera: Section-head 2-col → stack en mobile */
  .section-head, .specs-head {
    grid-template-columns: 1fr !important;
    align-items: start !important;
    gap: 24px !important;
  }
  .section-head__lede { padding-bottom: 0 !important; }

  /* Inline-styled 2-col layouts (eyebrow+content, intro habilidades, etc.) */
  [style*="grid-template-columns:1.2fr 1fr"],
  [style*="grid-template-columns:1.4fr 1fr"],
  [style*="grid-template-columns:1.3fr 1fr"],
  [style*="grid-template-columns:1.5fr 1fr"],
  [style*="grid-template-columns:1.6fr 1fr"],
  [style*="grid-template-columns:1fr 1.2fr"],
  [style*="grid-template-columns:1fr 1.3fr"],
  [style*="grid-template-columns:1fr 1.4fr"],
  [style*="grid-template-columns:1fr 1.5fr"],
  [style*="grid-template-columns:1fr 1.6fr"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    align-items: start !important;
  }

  /* Convalidación 2-col también */
  .conval, .intl, .exp-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
}

@media (max-width: 599px) {
  /* En 599px o menos, Respaldo institucional → 1col */
  section[style*="background:var(--bg-2)"] [style*="grid-template-columns:repeat(3,1fr)"],
  section[style*="background:var(--brand)"] [style*="grid-template-columns:repeat(3,1fr)"] {
    grid-template-columns: 1fr !important;
  }
}

/* ---------------------------------------------------------
   SMALL MOBILE BREAKPOINT (<600px)
   --------------------------------------------------------- */
@media (max-width: 599px) {
  .footer__top { grid-template-columns: 1fr !important; gap: 32px !important; }
  .hero__actions { flex-direction: column; align-items: stretch; }
  .hero__actions .btn { justify-content: center; flex: 0 0 auto; }
  .cta-final__actions { flex-direction: column; align-items: stretch; }
  .cta-final__actions .btn { justify-content: center; }
}

/* ---------------------------------------------------------
   END RESPONSIVE PATCH 2026
   --------------------------------------------------------- */