/* Header navy re-skin — sits on top of your existing tt-header rules */

.tt-header--navy{
  background: var(--tt-color-deep-navy);
  border-bottom: none;
}

.tt-header--navy .tt-nav__link{
  color: #fff;
}
.tt-header--navy .tt-nav__item:hover > .tt-nav__link,
.tt-header--navy .tt-nav__item:focus-within > .tt-nav__link{
  color: var(--tt-color-brand-orange);
}
.tt-header--navy .tt-nav__caret{
  color: rgba(255,255,255,.6);
}
.tt-header--navy .tt-nav__item:hover > .tt-nav__link .tt-nav__caret{
  color: var(--tt-color-brand-orange);
}

/* Tagline under the logo */
.tt-header__tagline{
  display:block;
  font-size:10px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: rgba(255,255,255,.7);
  margin-top:2px;
}

/* CTA — rounded rectangle with arrow, not a full pill */
.tt-header--navy .tt-header__cta{
  border-radius: 10px;
  padding: 12px 22px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--tt-color-brand-orange);
}
.tt-header--navy .tt-header__cta:hover{
  background: var(--tt-color-orange-deep);
}
.tt-header__cta-arrow{
  width:16px; height:16px;
}

/* Burger lines need to be white on navy */
.tt-header--navy .tt-burger > summary span{
  background: #fff;
}

/* Mobile: nav is hidden below 1199px anyway, but keep the burger visible/white */
@media (max-width:1199px){
  .tt-header--navy{ background: var(--tt-color-deep-navy); }
}