.site-header .menu-home,
.site-header .menu-apply { display: none; }
.site-header .brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.menu-backdrop { display: none; }

@media (max-width: 1050px) {
  /* Keep the sticky header anchored to the viewport, even far down the page. */
  body.menu-open { overflow: visible; overflow-x: clip; }
  .site-header {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    min-height: 66px;
    padding: 8px 14px;
    overflow: visible;
  }
  .site-header > .header-cta { display: none; }
  .site-header .brand-mark { width: 44px; height: 44px; min-width: 44px; }
  .site-header .brand { min-width: 0; gap: 10px; }
  .site-header .brand-copy strong { font-size: 1.03rem; }
  .site-header .brand-copy small { font-size: .58rem; }
  .site-header .menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-width: 94px;
    height: 44px;
    padding: 10px 14px;
    border: 1px solid var(--forest-800);
    border-radius: 999px;
    background: var(--forest-800);
    color: #fff;
    font: 700 14px/1.2 "DM Sans", Arial, sans-serif;
    box-shadow: 0 5px 14px #57334f20;
  }
  .site-header .menu-toggle svg { color: currentColor; flex: 0 0 20px; }
  .site-header .menu-toggle[aria-expanded=true] { background: var(--forest-950); }
  .site-header .main-nav,
  .site-header .main-nav.open {
    position: absolute;
    top: calc(100% + 8px);
    right: 12px;
    bottom: auto;
    left: 12px;
    z-index: 110;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    justify-content: stretch;
    gap: 0;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #fffdfd;
    box-shadow: 0 18px 44px #35263230;
    transition: opacity 160ms ease, transform 160ms ease, visibility 160ms;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px);
  }
  .site-header .main-nav.open { visibility: visible; opacity: 1; pointer-events: auto; transform: none; }
  .site-header .main-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 10px 12px;
    border: 0;
    border-radius: 12px;
    color: var(--forest-950);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    transform: none;
  }
  .site-header .main-nav a > svg { display: block; width: 18px; height: 18px; flex: 0 0 18px; color: var(--forest-700); }
  .site-header .main-nav a > svg:last-child:not(:first-child),
  .site-header .main-nav a::after { display: none; }
  .site-header .main-nav a:hover,
  .site-header .main-nav a[aria-current] { background: var(--sage-100); }
  .site-header .main-nav a:focus-visible { outline: 2px solid var(--forest-800); outline-offset: -2px; }
  .site-header .main-nav .menu-apply {
    grid-column: 1 / -1;
    justify-content: center;
    margin-top: 4px;
    background: var(--forest-800);
    color: #fff;
  }
  .site-header .main-nav .menu-apply:hover { background: var(--forest-950); }
  .site-header .main-nav .header-facebook {
    grid-column: 1 / -1;
    margin: 0;
    padding: 10px 12px;
    border: 0;
    background: transparent;
  }
  .site-header .main-nav .facebook-symbol { width: 18px; height: 18px; flex: 0 0 18px; font-size: 17px; }
  body.menu-open .menu-backdrop { display: block; position: fixed; inset: 0; z-index: 95; background: #35263252; touch-action: none; }
  body.menu-open .mobile-action-bar { pointer-events: none; transform: translateY(110%); opacity: 0; }
}

/* Short phone viewports fit the same full link set without a scrolling panel. */
@media (max-width: 1050px) and (max-height: 650px) {
  .site-header .main-nav,
  .site-header .main-nav.open { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 6px; }
  .site-header .main-nav a { padding-inline: 9px; font-size: .86rem; gap: 8px; }
}
@media (min-width: 560px) and (max-width: 1050px) and (max-height: 500px) {
  .site-header .main-nav,
  .site-header .main-nav.open { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 8px; }
  .site-header .main-nav .menu-apply { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header .main-nav { transition: none; }
}

@media (min-width: 1051px) and (max-width: 1400px) {
  .site-header { gap: 16px; padding-inline: 24px; }
  .site-header .brand-copy strong { white-space: nowrap; }
  .site-header .main-nav { gap: 2px; }
  .site-header .main-nav a { padding: 10px 6px; font-size: .8rem; white-space: nowrap; }
  .site-header .header-cta { padding-inline: 14px; white-space: nowrap; }
}