/* Static-site shell: the announcement participates in layout instead of
   overlapping page content, and scales calmly from phone to desktop. */
#main-navbar {
  position: sticky !important;
  inset-block-start: 0;
  background: rgba(255, 255, 255, 0.98) !important;
  color: #102c4e;
  box-shadow: 0 1px 0 rgba(16, 44, 78, 0.12);
}

.static-shutdown-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 10px clamp(18px, 4vw, 64px);
  background: #c81e2a;
  color: #fff;
  font-size: clamp(14px, 1.15vw, 17px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.01em;
  text-align: center;
  text-wrap: balance;
}

.static-shutdown-banner > span {
  max-width: 1120px;
}

.static-shutdown-banner a {
  color: #fff;
  font-weight: 750;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

.static-shutdown-banner a:hover,
.static-shutdown-banner a:focus-visible {
  color: #eafaee;
}

@media (max-width: 639px) {
  #main-navbar > .container > .flex {
    min-height: 64px;
  }

  .static-shutdown-banner {
    min-height: 0;
    padding: 9px 18px 10px;
    font-size: 13px;
    line-height: 1.35;
  }

  #business-hero-section,
  #consumer-hero-section {
    padding-top: 1.25rem !important;
  }

  #mobile-menu.mobile-menu-active {
    position: fixed !important;
    inset: 0 !important;
    z-index: 9999 !important;
    width: 100vw !important;
    height: 100dvh !important;
    overflow-y: auto !important;
    background: #fff !important;
    color: #102c4e !important;
  }
}