/* Seven top-level links need the existing compact menu above the old 800px breakpoint. */
@media (min-width: 801px) and (max-width: 1000px) {
  .site-header .header-inner { gap: 16px; }
  .site-header .header-cta { margin-left: auto; }
  .site-header .menu-toggle { display: flex; order: 3; flex-direction: column; gap: 5px; background: transparent; border: 0; width: 30px; padding: 5px; }
  .site-header .menu-toggle span { display: block; height: 1.5px; width: 21px; background: var(--ink); }
  .site-header .header-inner nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--line); padding: 15px 25px 25px; flex-direction: column; align-items: flex-start; gap: 20px; margin-left: 0; max-height: calc(100svh - 150px); overflow-y: auto; box-shadow: 0 15px 25px #2923330a; }
  .site-header .header-inner nav.is-open { display: flex; }
  .site-header .nav-dropdown { padding: 0; }
  .site-header .nav-dropdown .dropdown-panel { position: static; display: block; box-shadow: none; border: 0; padding: 8px 0 0; width: auto; }
  .site-header .dropdown-panel small { display: none; }
  .site-header .dropdown-panel a { padding: 7px 12px; font-size: 12px; color: var(--muted); }
}

/* Keep the full link row visible where the logo strapline would otherwise crowd it. */
@media (min-width: 1001px) and (max-width: 1250px) {
  .site-header .header-inner { gap: 22px; }
  .site-header .header-inner nav { gap: 23px; }
  .site-header .brand > span { display: none; }
}