/* ===== SBM Landing Header – FULL CSS ===== */

/* Full-bleed when NOT fixed */
.sbm-landing-header-wrap{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}

/* Fixed state (desktop & mobile): reset margins so iOS doesn't fight it */
.sbm-landing-header-wrap.is-fixed{
  position:fixed;
  top:0; left:0; right:0;
  width:100vw;
  margin-left:0;
  margin-right:0;
  z-index:1003;
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}

/* Smooth hide/reveal (desktop scroll behavior) */
.sbm-landing-header-wrap{ transition: transform .3s ease, opacity .3s ease; }
.sbm-landing-header-wrap.is-hidden{ transform: translateY(-100%); opacity: 0; pointer-events: none; }

/* Header bar */
.hs_cos_wrapper_type_module .sbm-landing-header{
  background: var(--sbm-bg, #042537);
  color: var(--sbm-fg, #FFFFFF);
}
.hs_cos_wrapper_type_module .sbm-landing-header a{
  color: var(--sbm-fg, #FFFFFF) !important;
}

/* Inner layout */
.sbm-landing-header__inner{
  max-width:1040px;
  margin:0 auto;
  padding:12px 10px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:8px;
}

.sbm-landing-header__logo img{ height:30px; display:block; }

.sbm-landing-header__slogan{
  text-align: left;
  font-size:14px;
  opacity:.9;
  color: var(--sbm-fg, #FFFFFF) !important;
}

.sbm-landing-header__right{ text-align:right; }
.sbm-landing-header__phone{ white-space:nowrap; text-decoration:none; padding-right:5px; }
.sbm-landing-header__phone:hover{ text-decoration:underline; }

/* CTA */
.hs_cos_wrapper_type_module a.sbm-landing-header__cta{
  text-transform: uppercase;
  background: var(--cta-bg);
  color: var(--cta-fg) !important;
  border: 1px solid var(--cta-fg);
  padding: 10px 16px;
  border-radius: 10px;
  font-weight: 600;
  white-space: nowrap;
  display: inline-block;
  text-decoration: none;
  transition: background .18s ease, color .18s ease, filter .18s ease;
}
.hs_cos_wrapper_type_module .sbm-landing-header__cta:hover{
  background: var(--cta-bg-hover);
  color: var(--cta-fg-hover) !important;
  border: 1px solid var(--cta-fg-hover);
}

/* Spacer gets height via JS */
.sbm-header-spacer{ height:0; }

/* Mobile stacking */
@media (max-width:980px){
  .sbm-landing-header__slogan{
    order:3;
    grid-column:1 / -1;
    font-size:14px;
    opacity:.9;
  }
}

/* Desktop layout */
@media (min-width:980px){
  .sbm-landing-header__inner{
    grid-template-columns:auto 1fr auto;
    gap:20px;
    padding:12px 20px;
  }
  .sbm-landing-header__logo img{ height:44px; }
  .sbm-landing-header__slogan{
    grid-column: 2;
    order: 0;
    justify-self: start;
    font-size: 1rem;
  }
  .sbm-landing-header__right{
    grid-column: 3;
    justify-self: end;
    display:flex;
    align-items:center;
    gap:18px;
    text-align:right;
  }
  .sbm-landing-header__phone{ padding-right:1rem; }
}
/* --- MOBILE: keep phone + button on one line, no extra right gap --- */
@media (max-width: 480px){
  /* Reduce right padding so the content can breathe */
  .sbm-landing-header__inner{
    grid-template-columns: auto 1fr;   /* two columns: logo | right block */
    padding-right: 6px;                /* was 10px */
  }
  /* Put phone + CTA in a single row, aligned right */
  .sbm-landing-header__right{
    grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
  }
  /* Don’t add extra spacing before the CTA */
  .sbm-landing-header__phone{
    padding-right: 4px;
    white-space: nowrap;
    font-size: 14px;
  }
  .hs_cos_wrapper_type_module a.sbm-landing-header__cta{padding: 8px 10px;}
  .sbm-landing-header__slogan{
    display:none;
  }