/* Directly enqueued after the legacy CSS; no palette or build changes. */
.skip-link {
  position: fixed;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 11000;
  padding: 0.75rem 1rem;
  background: #fff;
  transform: translateY(-200%);
}

.skip-link:focus {
  transform: translateY(0);
}

#main-content,
[data-accessible-tabs] [role="tab"] {
  scroll-margin-top: var(--medius-header-offset, 8rem);
}

.banner [hidden],
[data-accessible-tabs][data-tabs-ready] [hidden] {
  display: none !important;
}

/* Without JS, expose ordinary nested link lists rather than dead controls. */
.banner [data-accessible-navigation]:not(.navigation-ready) {
  position: static;
}

.banner [data-accessible-navigation]:not(.navigation-ready) .dropdown-menu {
  display: block;
  position: static;
  float: none;
}

.banner .navigation-ready .dropdown-menu:not([hidden]) {
  display: block;
  visibility: visible;
}

.banner .submenu-toggle {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 50px;
  padding: 0;
  border: 0;
  background: transparent;
  /* Match the existing navbar link palette, not the body's darker text. */
  color: rgba(0, 0, 0, 0.5);
  font: inherit;
  font-size: 18px;
  cursor: pointer;
}

.banner .nav-link:is(:hover, :focus) + .submenu-toggle,
.banner .submenu-toggle:is(:hover, :focus) {
  color: rgba(0, 0, 0, 0.7);
}

.banner .active > .submenu-toggle {
  color: rgba(0, 0, 0, 0.9);
}

/* Reuse Bootstrap's original small CSS caret via .dropdown-toggle.
   Its decorative size is independent of the button's larger hit area. */
.banner .submenu-toggle[aria-expanded="true"]::after {
  transform: rotate(180deg);
}

.banner .dropdown > .nav-link,
.banner .dropdown > .dropdown-item {
  padding-right: 2.75rem;
  padding-left: 2.75rem;
}

.banner .navbar-toggler:focus-visible,
.banner .submenu-toggle:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

@media (max-width: 991.98px) {
  .banner .dropdown-menu {
    position: static;
    float: none;
  }

  .banner #navbarNav {
    max-height: calc(100vh - var(--medius-header-offset, 8rem));
    max-height: calc(100dvh - var(--medius-header-offset, 8rem));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}

@media (min-width: 992px) {
  .banner .navigation-ready .dropdown {
    display: flex;
    align-items: flex-start;
  }

  .banner .submenu-toggle {
    position: static;
    display: block;
    flex: 0 0 28px;
    min-width: 28px;
    min-height: 30px;
    padding: 0.5rem 0;
    font-size: 14px;
    line-height: 1;
    text-align: left;
  }

  .banner .submenu-toggle::after {
    /* Preserve the original caret's gap and baseline beside the label. */
    margin-left: 0.255em;
  }

  .banner .navbar-nav .dropdown > .nav-link,
  .banner .navbar-nav .dropdown > .dropdown-item {
    padding-left: 1rem;
    padding-right: 0;
  }

  .banner .nav-secondary .submenu-toggle {
    color: #fff;
    font-size: 12px;
  }
}

/* A readable document is the no-JS fallback. JS makes it a single-panel tabset. */
[data-accessible-tabs]:not([data-tabs-ready]) [role="tablist"] {
  display: none;
}

[data-accessible-tabs]:not([data-tabs-ready]) [role="tabpanel"] {
  display: block !important;
}

.tabs .tabs__nav button.nav-link {
  width: 100%;
  border: 0;
  text-align: left;
  cursor: pointer;
}

.tabs .tabs__title > :is(h1, h2) {
  display: inline-block;
  font-size: 1.5rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.tabs .tabs__headline > :is(h2, h3, h4) {
  font-size: 2.25rem;
  margin-bottom: 1.25rem;
}

.tabs .news__headline:is(h3, h4, h5) {
  font-weight: 400;
  margin: 0 0 4px;
}

@media (min-width: 768px) {
  .tabs .tabs__title > :is(h1, h2) {
    font-size: 2.5rem;
    letter-spacing: 3px;
  }
}