/* Final mobile header fit: five controls stay on one row at 360/390px.
   Labels remain intact; all controls keep a 44px tap height. */
@media (max-width: 400px) {
  #hcr-nav .hcr-nav-row {
    gap: 6px !important;
    margin-left: -4px !important;
    margin-right: -4px !important;
    width: calc(100% + 8px) !important;
    max-width: none !important;
    flex-wrap: nowrap !important;
  }
  #hcr-nav .hcr-nav-row > li.hcr-nav-li-text {
    flex: 0 1 auto !important;
    min-width: 0 !important;
  }
  #hcr-nav .hcr-nav-row > li.hcr-nav-li-text > .hcr-nav-btn {
    width: auto !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 5px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
  #hcr-nav .hcr-nav-row > li.hcr-nav-li-icon {
    flex: 0 0 38px !important;
    width: 38px !important;
  }
  #hcr-nav .hcr-nav-icon {
    width: 38px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
  }
  #hcr-nav .hcr-nav-row > li.hcr-nav-li-menu {
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }
  #hcr-nav .hcr-nav-menu {
    width: auto !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 6px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
}
@media (max-width: 374px) {
  #hcr-nav .hcr-nav-row { gap: 5px !important; }
  #hcr-nav .hcr-nav-row > li.hcr-nav-li-text > .hcr-nav-btn {
    padding: 0 4px !important;
    font-size: 12.5px !important;
  }
  #hcr-nav .hcr-nav-row > li.hcr-nav-li-icon,
  #hcr-nav .hcr-nav-icon { width: 36px !important; flex-basis: 36px !important; }
  #hcr-nav .hcr-nav-menu { min-width: 42px !important; padding: 0 5px !important; }
}

/* Final nav style: unselected primary pills copy the Menu button; active uses home block charcoal. */
#hcr-nav .hcr-nav-row .hcr-nav-btn[data-href] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 2px solid #2B2F36 !important;
  border-radius: 999px !important;
  color: #2B2F36 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
#hcr-nav .hcr-nav-row .hcr-nav-btn[data-href]:hover {
  background: #EEF0F2 !important;
  background-color: #EEF0F2 !important;
  border-color: #2B2F36 !important;
  color: #2B2F36 !important;
}
#hcr-nav .hcr-nav-row .hcr-nav-btn[data-href].is-active,
#hcr-nav .hcr-nav-row .hcr-nav-btn[data-href][aria-current="page"],
#hcr-nav-panel .hcr-nav-btn.is-active,
#hcr-nav-panel .hcr-nav-btn[aria-current="page"] {
  background: #2B2F36 !important;
  background-color: #2B2F36 !important;
  border-color: #2B2F36 !important;
  color: #FFFFFF !important;
}
