/* Header only. Override historical page-specific sizes without changing artwork. */
#cs-header-brand {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: var(--cs-header-logo-desktop, 280px) !important;
  max-width: 100% !important;
  min-width: 0 !important;
  line-height: 1 !important;
}
#cs-header-brand > a,
#cs-header-brand > .custom-logo-link {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  line-height: 1 !important;
}
#cs-header-brand img,
#cs-header-brand .custom-logo {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 58px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

/* Keep the existing desktop menu breakpoint and reserve its horizontal space. */
@media (min-width: 981px) and (max-width: 1150px) {
  #cs-header-brand {
    width: min(var(--cs-header-logo-desktop, 280px), clamp(220px, calc(35.5vw - 128px), 280px)) !important;
  }
}

/* The existing mobile header hides the CTA; reserve 44px + 12px for its toggle. */
@media (max-width: 980px) {
  #cs-header-brand {
    flex: 0 1 auto !important;
    width: var(--cs-header-logo-mobile, 240px) !important;
    max-width: calc(100% - 56px) !important;
  }
  #cs-header-brand img,
  #cs-header-brand .custom-logo {
    max-height: 48px !important;
  }
}
