/* ═══ MENÚ SUPERIOR CON DESPLEGABLES + MENÚ MÓVIL EN ACORDEÓN ═══
   Markup generado por scripts/build_nav.py — cargado en todas las páginas. */

/* ─── Desktop ─── */
.nav-links { align-self: stretch; align-items: stretch; margin: 0; padding: 0; }
.nav-links > li { display: flex; align-items: center; position: relative; }
.nav-links > li.has-menu:first-child { position: static; } /* Destinos: panel a todo lo ancho */
.nav-caret { margin-left: 5px; vertical-align: 1px; opacity: .7; transition: transform .2s ease; }
.has-menu:hover > a .nav-caret, .has-menu:focus-within > a .nav-caret, .has-menu.open > a .nav-caret { transform: rotate(180deg); }

.mega {
  position: absolute; top: 100%; left: 50%;
  min-width: 250px;
  background: var(--ivory);
  border: 0.5px solid var(--border); border-top: none;
  box-shadow: 0 22px 44px rgba(14,20,17,.13);
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translate(-50%, -6px);
  transition: opacity .18s ease, transform .18s ease, visibility 0s linear .22s;
  z-index: 1000;
}
.mega.mega-wide { left: 0; right: 0; transform: translateY(-6px); border-left: none; border-right: none; }
.has-menu:hover > .mega, .has-menu:focus-within > .mega, .has-menu.open > .mega {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translate(-50%, 0); transition-delay: 0s;
}
.has-menu:hover > .mega.mega-wide, .has-menu:focus-within > .mega.mega-wide, .has-menu.open > .mega.mega-wide { transform: none; }

.mega-inner {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 1.4rem 2.6rem;
  padding: 1.75rem 2rem 1.25rem;
  max-width: 1240px; margin: 0 auto;
}
.mega-wide .mega-inner { padding: 2.1rem 2.5rem 1.4rem; }
.mega-col { min-width: 140px; }
.mega ul { list-style: none; margin: 0; padding: 0; }
.mega-col-2 ul { display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); column-gap: 1.75rem; }

/* Reset de los estilos de .nav-links a para los enlaces dentro del panel */
.nav .nav-links .mega a {
  display: block; padding: .3rem 0; white-space: nowrap;
  font-family: 'Poppins', sans-serif; font-size: 13px; letter-spacing: .02em;
  color: var(--charcoal); opacity: .82; transition: color .2s, opacity .2s;
}
.nav .nav-links .mega a::after { display: none; }
.nav .nav-links .mega a:hover, .nav .nav-links .mega a:focus-visible { color: var(--forest); opacity: 1; }
.nav .nav-links .mega a.active { color: var(--forest); opacity: 1; font-weight: 500; }
.nav .nav-links .mega .mega-title {
  display: block; margin: 0 0 .7rem; padding: 0 0 .55rem;
  border-bottom: 0.5px solid var(--border);
  font-family: 'Poppins', sans-serif; font-size: 9.5px; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase; color: var(--muted); opacity: 1;
}
.nav .nav-links .mega a.mega-title:hover { color: var(--forest); }
.nav .nav-links .mega .mega-all {
  flex-basis: 100%; text-align: center; margin-top: .2rem; padding: .95rem 0 .2rem;
  border-top: 0.5px solid var(--border);
  font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--forest-mid); opacity: 1;
}

/* Mientras un desplegable está abierto, la barra se vuelve sólida (aunque esté sobre el hero) */
.nav:has(.has-menu:hover), .nav:has(.has-menu:focus-within), .nav:has(.has-menu.open) {
  background: rgba(250,248,244,.98); border-bottom-color: var(--border);
}
.nav:has(.has-menu:hover) .brand-logo-white, .nav:has(.has-menu:focus-within) .brand-logo-white, .nav:has(.has-menu.open) .brand-logo-white { display: none; }
.nav:has(.has-menu:hover) .brand-logo-cafe, .nav:has(.has-menu:focus-within) .brand-logo-cafe, .nav:has(.has-menu.open) .brand-logo-cafe { display: block; }
.nav:has(.has-menu:hover) .nav-links > li > a, .nav:has(.has-menu:focus-within) .nav-links > li > a, .nav:has(.has-menu.open) .nav-links > li > a { color: var(--charcoal); opacity: .8; }
.nav .nav-links > li.has-menu:hover > a, .nav .nav-links > li.has-menu:focus-within > a { opacity: 1; }
.nav:has(.has-menu:hover) .nav-cta, .nav:has(.has-menu:focus-within) .nav-cta, .nav:has(.has-menu.open) .nav-cta { background: var(--forest-mid); color: var(--ivory); border-color: var(--forest-mid); }

/* Sección actual marcada en la barra (también para páginas de país, meses, etc.) */
.nav-links > li > a.section-active::after { transform: scaleX(1); }

/* Anclas internas: que no queden debajo de la barra fija */
[id^="lm-"] { scroll-margin-top: 90px; }

@media (max-width: 1240px) {
  .mega-wide .mega-inner { gap: 1.4rem 1.9rem; padding-left: 1.5rem; padding-right: 1.5rem; }
  .nav .nav-links .mega-wide a { font-size: 12.5px; }
}
@media (max-width: 1100px) { .mega { display: none; } }

/* ─── Móvil: acordeón ─── */
.mobile-nav .m-group { border-bottom: 0.5px solid var(--border); }
.mobile-nav .m-row { display: flex; align-items: center; }
.mobile-nav .m-row > a { flex: 1; border-bottom: none; }
.m-toggle {
  position: relative; flex: 0 0 44px; width: 44px; height: 44px;
  background: none; border: none; cursor: pointer; color: var(--forest);
}
.m-toggle::before, .m-toggle::after {
  content: ''; position: absolute; top: 50%; left: 50%; width: 14px; height: 1.2px;
  background: currentColor; transform: translate(-50%, -50%); transition: transform .25s ease, opacity .25s ease;
}
.m-toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
.m-toggle[aria-expanded="true"]::after { transform: translate(-50%, -50%) rotate(0deg); opacity: 0; }
.m-sub { display: none; padding: 0 0 1.1rem; }
.m-group.open .m-sub { display: block; }
.mobile-nav .m-sub .m-sub-title {
  display: block; margin: 0; padding: .85rem 0 .35rem; border: none;
  font-family: 'Poppins', sans-serif; font-size: 10px; font-weight: 500;
  letter-spacing: .2em; text-transform: uppercase; color: var(--muted);
}
.m-sub-links { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1rem; }
.mobile-nav .m-sub-links a {
  padding: .45rem 0; border: none;
  font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 400;
  letter-spacing: .01em; color: var(--charcoal); line-height: 1.35;
}
.mobile-nav .m-sub-links a.active { color: var(--forest); font-weight: 500; }
@media (max-width: 340px) { .m-sub-links { grid-template-columns: 1fr; } }

/* Desplegables compactos (todos menos Destinos): columnas lado a lado, ancho según contenido */
.mega:not(.mega-wide) { width: max-content; }
.mega:not(.mega-wide) .mega-inner { display: grid; grid-template-columns: repeat(var(--cols, 1), auto); align-items: start; gap: 1.2rem 3rem; padding: 1.75rem 2.25rem 1.25rem; }
.mega-inner.cols-2 { --cols: 2; }
.mega-inner.cols-3 { --cols: 3; }
.mega:not(.mega-wide) .mega-all { grid-column: 1 / -1; }
.mega-col-3 ul { display: grid; grid-template-columns: repeat(3, max-content); column-gap: 2rem; }
