/* Mobile navigation: native button, no jQuery or hover dependency. */
#navigation-box button.show-menu { display: none; }
@media screen and (max-width: 767px) {
  #navigation-box { float: none; width: 100%; height: auto; }
  #navigation-box.mobile-nav-ready button.show-menu {
    display: block; box-sizing: border-box; width: 100%; min-height: 48px;
    margin: 0; padding: 12px 16px; border: 0; border-radius: 0;
    font: inherit; font-size: 16px; color: #fff; background: #062955;
    text-align: center; cursor: pointer; -webkit-appearance: none; appearance: none;
    touch-action: manipulation;
  }
  #navigation-box button.show-menu:focus-visible,
  #navigation-box .top-nav a:focus-visible { outline: 3px solid #f4c55c; outline-offset: -3px; }
  #navigation-box > ul.top-nav { display: block; position: static; width: 100%; }
  #navigation-box.mobile-nav-ready > ul.top-nav { display: none; }
  #navigation-box.mobile-nav-ready.mobile-menu-open > ul.top-nav { display: block; }
  #navigation-box .top-nav li { display: block; float: none; width: 100%; margin: 0; }
  #navigation-box .top-nav li a {
    box-sizing: border-box; display: block; width: 100%; min-height: 44px;
    height: auto; line-height: 1.4; padding: 12px 18px; text-align: left;
    white-space: normal; border: 0; border-bottom: 1px solid #4962a0;
    background: #324e80; color: #fff;
  }
  #navigation-box .top-nav li ul { display: block; position: static; width: 100%; }
  #navigation-box .top-nav li ul li a,
  #navigation-box .top-nav li:hover ul a {
    min-height: 44px; height: auto; line-height: 1.4; padding: 12px 32px;
    font-size: 14px; text-align: left; background: #225293;
  }
}