/* ═══════════════════════════════════════════════════════════
   SITE HEADER — thin navy top bar  +  pure white main bar
   (loaded last on every page so it wins over older header styles)
   ═══════════════════════════════════════════════════════════ */

/* ───────── 1. NAVY TOP BAR ───────── */
#topbar{
  position:absolute; top:0; left:0; right:0; height:40px;
  background:#0a1e3d; z-index:1001;
}
#topbar .tb-in{
  height:100%; display:flex; align-items:center; justify-content:flex-start;
  padding:0 3vw; gap:0;
}
#topbar a{ text-decoration:none; font-family:Garet,Montserrat,Arial,sans-serif; }
.tb-phone{display:inline-flex; align-items:center; gap:8px; color:#fff; font-size:.85rem; font-weight:500; letter-spacing:.3px; white-space:nowrap;}
.tb-phone svg{width:14px; height:14px; stroke:#fff; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.tb-phone:hover{color:#8fb8ff;}
.tb-sep{width:1px; height:16px; background:rgba(255,255,255,.3); margin:0 16px; flex-shrink:0;}
.tb-social{display:flex; align-items:center; gap:2px;}
.tb-social a{width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; transition:background .2s, color .2s;}
.tb-social a:hover{background:rgba(255,255,255,.16); color:#8fb8ff;}
.tb-social svg{width:15px; height:15px; fill:currentColor; display:block;}
.tb-btn{display:inline-flex; align-items:center; justify-content:center; gap:7px; height:26px; padding:0 15px; border-radius:30px; font-size:.78rem; font-weight:600; letter-spacing:.3px; white-space:nowrap; transition:all .2s;}
.tb-btn svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.tb-mail{border:1px solid rgba(255,255,255,.5); color:#fff; margin-right:10px;}
.tb-mail:hover{background:#fff; color:#0a1e3d;}
.tb-quote{background:#2979ff; border:1px solid #2979ff; color:#fff;}
.tb-quote:hover{background:#fff; border-color:#fff; color:#0a1e3d;}

/* ───────── 2. PURE-WHITE MAIN BAR ───────── */
body #site-header{
  position:fixed !important; top:40px; left:0; right:0; z-index:1000;
  height:76px; padding:0 3vw !important;
  display:grid !important; grid-template-columns:1fr auto 1fr; align-items:center;
  background:#ffffff !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  border:0 !important; border-bottom:1px solid #e7ecf5 !important;
  box-shadow:none;
  transition:box-shadow .25s;
}
body #site-header.scrolled{ background:#ffffff !important; padding:0 3vw !important; box-shadow:none; }
body #site-header.stuck{ box-shadow:0 6px 26px rgba(10,30,61,.13) !important; }

/* logo + name + sub-line (left) */
body .brand-lockup{
  position:static !important; transform:none !important; justify-self:start;
  display:flex; align-items:center; gap:11px; text-decoration:none;
}
body .brand-lockup img{ height:54px; width:auto; display:block; filter:none !important; }
body .brand-text{ display:flex !important; flex-direction:column; line-height:1.15; }
body .brand-text strong{ font-size:1.3rem; color:#0a1e3d !important; letter-spacing:.2px; white-space:nowrap; }
body .brand-text small{ font-family:Garet,Montserrat,Arial,sans-serif; font-size:.68rem; font-weight:400; color:#55627f !important; letter-spacing:.5px; margin-top:3px; white-space:nowrap; }
body .mob-brand{ display:none !important; }

/* centred menu */
body .nav-pill{
  display:flex !important; align-items:center; height:100%; justify-self:center;
  background:transparent !important; border:0 !important; border-radius:0 !important;
  padding:0 !important; gap:0 !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
body .nav-links{ height:100%; display:flex; align-items:stretch; gap:2px; }
body .nav-links > li{ display:flex; align-items:stretch; height:100%; }
body .nav-link{
  display:flex !important; align-items:center; height:100%;
  padding:0 15px !important; border-radius:0 !important;
  background:none !important; color:#0a1e3d !important;
  font-size:.92rem; font-weight:500; letter-spacing:.2px;
}
body .nav-link:hover, body .nav-link.active{ background:none !important; color:#2979ff !important; }
body .nav-link.active::after{
  bottom:0 !important; left:15px; right:15px; width:auto !important; transform:none !important;
  height:3px !important; background:#2979ff !important; border-radius:3px 3px 0 0 !important;
}
body .btn-quote{ display:none !important; }

/* mega menu on the white bar */
body .mega-menu{
  top:100% !important; margin-top:0; background:#ffffff !important;
  border:1px solid #e3eaf6 !important; border-top:0 !important; border-radius:0 0 18px 18px !important;
  box-shadow:0 26px 54px rgba(10,30,61,.18) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
body .mega-item > span, body .mega-item > a{ color:#0a1e3d !important; }
body .mega-item > span:hover, body .mega-item > a:hover{ color:#2979ff !important; background:#eef4ff !important; border-color:rgba(41,121,255,.2) !important; }
body .submenu{ background:#ffffff !important; border:1px solid #e3eaf6 !important; box-shadow:0 16px 38px rgba(10,30,61,.16) !important; }
body .submenu a{ color:#0a1e3d !important; }
body .submenu a:hover{ color:#2979ff !important; background:#eef4ff !important; }

/* hamburger (phones) */
body .mob-ham{ position:static !important; justify-self:end; grid-column:3; }

/* make room beside the centred menu */
@media (max-width:1209px){ body .brand-text small{ display:none; } }
@media (max-width:1079px){ body .brand-text{ display:none !important; } body .nav-link{ padding:0 11px !important; font-size:.86rem; } body .nav-link.active::after{ left:11px; right:11px; } }

/* ───────── 3. PHONES ───────── */
@media (max-width:768px){
  #topbar{ height:36px; }
  #topbar .tb-in{ padding:0 12px; }
  .tb-phone{ font-size:.76rem; gap:6px; }
  .tb-phone svg{ width:13px; height:13px; }
  .tb-sep{ margin:0 9px; height:14px; }
  .tb-social{ gap:0; }
  .tb-social a{ width:24px; height:24px; }
  .tb-social svg{ width:13px; height:13px; }
  .tb-btn{ height:24px; padding:0 11px; font-size:.72rem; }
  .tb-mail{ width:26px; padding:0; margin-right:6px; margin-left:0; }
  .tb-mail svg{ width:15px; height:15px; }
  .tb-mail span{ display:none; }
  .tb-quote{ margin-left:auto; }
  .tb-in{ justify-content:flex-start; }

  body #site-header{ top:36px; height:62px; padding:0 12px !important; display:flex !important; justify-content:space-between; }
  body .brand-lockup{ order:1; gap:8px; }
  body .brand-lockup img{ height:44px; }
  body .brand-text{ display:flex !important; }
  body .brand-text strong{ font-size:1.02rem; }
  body .brand-text small{ display:block !important; font-size:.56rem; letter-spacing:.3px; margin-top:2px; }
  body .nav-pill{ display:none !important; }
  body .mob-ham{ order:3; }
}
@media (max-width:400px){
  #topbar .tb-in{ padding:0 8px; }
  .tb-phone{ font-size:.72rem; }
  .tb-phone svg{ display:none; }
  .tb-sep{ margin:0 6px; }
  .tb-social a{ width:21px; height:21px; }
  .tb-social svg{ width:12px; height:12px; }
  .tb-mail{ width:24px; margin-right:4px; }
  .tb-btn{ padding:0 8px; font-size:.68rem; }
}

@media (max-width:340px){ .tb-social a:nth-child(n+4){ display:none; } }