.header-menu__item:hover > a.header-menu__link:not([href]) {
  color: #fff;
}

.header-menu__item:focus-within > .inner-menu {
  height: auto;
  width: min(705px, 95vw);
  background-color: #fff;
  z-index: 10;
  opacity: 1;
  padding: 21px;
}
@media (max-width: 1630px) {
  .header-menu__item:focus-within > .inner-menu {
    width: 300px;
    right: auto;
    left: -1px;
  }
}
.inner-menu .navigation-parent { flex-direction: column; }
.navigation-children { padding: 8px 0 0 12px; }
.inner-menu .navigation-children li { width: 100%; margin-right: 0; }
.header-menu__link > img, .footer-menu__link > img { width: 32px; height: 32px; object-fit: contain; margin-right: 8px; }
.mobile-menu [data-navigation-depth="2"] .header-menu__link { padding-left: 32px; }

/* Keep long submenus in the scroll flow instead of shrinking the flex list. */
.mobile-menu {
  overflow: hidden;
}
.mobile-menu__wrapper {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  padding-bottom: max(8px, env(safe-area-inset-bottom));
}
.mobile-menu__wrapper > * {
  flex-shrink: 0;
}
.mobile-menu .header-menu__list {
  flex-direction: column;
  flex-wrap: nowrap;
}
.mobile-menu :is(a, button):focus {
  outline: none;
}
.mobile-menu :is(a, button):focus-visible {
  outline: 2px solid #27814e;
  outline-offset: -2px;
}

/* A persistent header must dismiss the clicked dropdown even while hovered. */
#site-root .header-menu__item.navigation-dismissed > .inner-menu {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
