/* Desktop group-tours dropdown: prevent bottom clipping on laptop viewports */
/* The mobile overlay must never render at desktop widths. */
#mobile-nav {
  display: none !important;
}

@media (max-width: 1023px) {
  #mobile-nav {
  position: fixed;
  inset: 0;
  z-index: 1050;
  overflow-y: auto;
  background: #fff;
  opacity: 0;
  transition: opacity 0.3s ease;
  }

  #mobile-nav.open {
    display: block !important;
    opacity: 1;
  }
}

#header-container,
header.site-header,
.site-header .inner,
.site-header nav,
.site-header nav .group {
  overflow: visible;
}

/* Keep the brand mark proportional and prevent the navigation from squeezing it. */
.site-header .site-logo-link {
  flex: 0 0 auto;
  padding: 0.25rem 0.5rem;
}

.site-header .site-logo {
  display: block;
  width: 8.75rem;
  height: auto !important;
  max-width: none;
  aspect-ratio: 500 / 263;
  object-fit: contain;
  flex: none;
}

#mobile-nav .mobile-menu-logo img {
  display: block;
  width: 9rem;
  height: auto !important;
  object-fit: contain;
}

@media (min-width: 1280px) {
  .site-header .site-logo {
    width: 9.75rem;
  }
}

@media (min-width: 1024px) {
  /* The hamburger is mobile-only; desktop uses the full navigation above. */
  .site-header #mobileToggle {
    display: none !important;
  }

  /* Keep the dropdown trigger on the same center line as the other nav links. */
  .site-header nav > .group {
    display: flex;
    align-self: center;
    align-items: center;
  }

  .site-header .menu-panel {
    z-index: 1100;
    width: min(34rem, calc(100vw - 2rem));
  }

  .site-header .menu-panel-scroll {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 0;
    max-height: calc(100vh - 6.5rem);
    max-height: calc(100dvh - 6.5rem);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  .site-header .menu-panel-scroll a {
    white-space: normal;
    line-height: 1.35;
  }
}