/* ULTRA-compact mobile header (Helix Ultimate) */
@media (max-width: 991px) {

  /* 1) Kill extra vertical space */
  #sp-header,
  #sp-header .container,
  #sp-header .container-inner,
  #sp-header .row {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    min-height: 0 !important;
  }

  /* 2) Force a compact height + center alignment */
  #sp-header .container-inner .row {
    align-items: center !important;
    flex-wrap: nowrap !important;
  }

  /* 3) Shrink the logo block (often has fixed padding/min-height) */
  #sp-logo,
  #sp-logo .sp-column,
  #sp-logo .logo {
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
    min-height: 0 !important;
  }

  /* 4) Shrink the actual logo image */
  #sp-logo img {
    max-height: 30px !important;  /* try 26–34px */
    width: auto !important;
    display: block !important;
  }

  /* 5) Pull the menu/toggler up & shrink it */
  #sp-menu,
  #sp-menu .sp-column {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    line-height: 1 !important;
    text-align: right !important;
  }

  /* Helix offcanvas toggle button (hamburger) */
  .offcanvas-toggler,
  .offcanvas-toggle,
  a.burger-icon,
  button.burger-icon {
    padding: 6px 8px !important;   /* smaller click area */
    margin: 0 !important;
    line-height: 1 !important;
  }

  /* 6) If mega menu markup adds height, hide it on mobile */
  .sp-megamenu-parent {
    display: none !important;
  }
}