/* SSM 2026-08-19: adding the "Damp and Timber Surveys" nav item overflowed the
   Astra desktop header. The theme's primary-header grid uses fixed thirds
   (417px | 325px | 417px), so the menu column starves, Contact Us wraps to a
   second line and the phone button collapses to a vertical one-character
   sliver. Fix: lay the primary header row out as flex (logo and button take
   natural width, menu takes the rest) and keep the whole menu on ONE row at
   every desktop width via banded type sizes. In the 922-1099px squeeze band
   the header phone button is hidden (the same number stays in the top bar and
   the hero button). Mobile (<=921px) hamburger behaviour untouched. */
@media (min-width: 922px) {
  .ast-primary-header-bar .ast-builder-grid-row {
    display: flex !important;
    align-items: center;
    column-gap: 16px;
  }
  .ast-primary-header-bar .site-header-primary-section-left { flex: 0 0 auto; }
  .ast-primary-header-bar .site-header-primary-section-center { flex: 1 1 auto; min-width: 0; justify-content: center; }
  .ast-primary-header-bar .site-header-primary-section-right { flex: 0 0 auto; }
  .ast-primary-header-bar .site-logo-img img { max-width: 120px; }
  .ast-builder-menu .main-header-menu { flex-wrap: nowrap !important; justify-content: center; }
  .main-header-menu > .menu-item { white-space: nowrap; }
  .ast-builder-button-wrap .ast-custom-button {
    white-space: nowrap !important;
    min-width: max-content !important;
  }
}
@media (min-width: 1240px) {
  .main-header-menu > .menu-item > .menu-link { padding: 0 6px !important; font-size: 14px !important; }
}
@media (min-width: 922px) and (max-width: 1239px) {
  .main-header-menu > .menu-item > .menu-link { padding: 0 4px !important; font-size: 12.5px !important; }
}
@media (min-width: 922px) and (max-width: 1099px) {
  .ast-primary-header-bar .ast-builder-button-wrap { display: none !important; }
}
/* Legibility: white header text sits on a light photo on the home hero -
   soft shadow lifts it without changing the design. */
.ast-theme-transparent-header .main-header-menu .menu-link,
.ast-theme-transparent-header .ast-above-header-bar,
.ast-theme-transparent-header .ast-builder-html-element {
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
}
