
/* =====================================================================
   3PL Hub global header (v1) — paste into the BD header template region
   (the same field that renders <div class="header">), replacing the
   existing <style> block, OR append after it.
   - All rules scoped under .h3h so they cannot collide with site CSS.
   - Hides BD's generated nav (.mobile-main-menu + .navbar) and renders
     the new full-width mega-menu in its place.
   - No HTML comments in the markup below (BD renders them as visible
     text). Keep all notes inside this <style> block.
   - No <input> tags (Froala strips them). No u or escaped quotes in JS.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap');

/* hide BD's native generated nav, keep it in the DOM for crawlers */
.header > .mobile-main-menu,
.header > nav.navbar{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;margin:-1px;padding:0;pointer-events:none}

.h3h, .h3h *{box-sizing:border-box;margin:0;padding:0;font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif}
.h3h{
  --h3h-navy:#0d1829;--h3h-ink:#0f1b3d;--h3h-muted:#6b7488;--h3h-blue:#2f6bed;
  --h3h-blue-dark:#1f54c9;--h3h-gold:#e3b23c;--h3h-line:#eef1f6;--h3h-h:72px;
  --h3h-radius:26px;--h3h-shadow:0 28px 60px -18px rgba(10,19,48,.28),0 8px 22px -10px rgba(10,19,48,.18);
  position:sticky;top:0;z-index:1000;display:block;width:100%;max-width:100%;overflow:visible;
  background:#0d1829;
}
.h3h-bar{max-width:1240px;margin:0 auto;height:var(--h3h-h);display:flex;align-items:center;gap:28px;padding:0 26px}
.h3h-logo{display:flex;align-items:center;flex-shrink:0;text-decoration:none}
.h3h-logo img{height:30px;width:auto;display:block}

.h3h-nav{display:flex;align-items:center;gap:2px}
.h3h-item{position:static}
.h3h-item > button,.h3h-link{
  display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;
  font-weight:600;font-size:15px;color:#e7ecf8;padding:9px 14px;border-radius:10px;
  text-decoration:none;transition:background .18s,color .18s;line-height:1;
}
.h3h-item > button:hover,.h3h-link:hover,.h3h-item.h3h-open > button{background:rgba(255,255,255,.08);color:#fff}
.h3h-item > button .h3h-chev{width:14px;height:14px;opacity:.8;transition:transform .25s}
.h3h-item.h3h-open > button .h3h-chev{transform:rotate(180deg)}

.h3h-right{margin-left:auto;display:flex;align-items:center;gap:6px}
.h3h-cta{background:var(--h3h-blue);color:#fff !important;font-weight:700;font-size:14.5px;padding:10px 20px;border-radius:11px;text-decoration:none;box-shadow:0 6px 16px -6px rgba(47,107,237,.7);transition:transform .15s,background .18s;white-space:nowrap;border:0;cursor:pointer}
.h3h-cta:hover{background:var(--h3h-blue-dark);transform:translateY(-1px);color:#fff !important}

/* account area: logged-out shows Log in; logged-in shows avatar + My Account */
.h3h-avatar{width:30px;height:30px;border-radius:50%;flex-shrink:0;background:#33406a center/cover no-repeat}
.h3h-acct{position:relative;height:var(--h3h-h);display:none;align-items:center}
.h3h-acct > button{padding:6px 10px}
.h3h-acct .h3h-mega{left:auto;right:0;width:auto;min-width:210px;border-radius:0 0 16px 16px;padding:12px}
.h3h-acct .h3h-inner{display:block;max-width:none}
body.user-session .h3h-acct{display:flex}
body.user-session .h3h-loginlink{display:none}
.h3h-m-in{display:none}
body.user-session .h3h-m-in{display:block}
body.user-session .h3h-m-out{display:none}
.h3h-m-flat{display:flex;align-items:center;justify-content:space-between;color:#fff;font-weight:700;font-size:16px;padding:16px 4px;text-decoration:none}

.h3h-burger{display:none;background:none;border:0;cursor:pointer;padding:8px;margin-left:auto}
.h3h-burger span{display:block;width:24px;height:2.5px;background:#fff;border-radius:2px;margin:5px 0;transition:.3s}

/* mega panels */
.h3h-mega{
  position:absolute;left:0;right:0;top:100%;background:#fff;
  border-radius:0 0 var(--h3h-radius) var(--h3h-radius);box-shadow:var(--h3h-shadow);
  padding:34px 26px 38px;opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;z-index:90;
}
.h3h-item.h3h-open .h3h-mega{opacity:1;visibility:visible;transform:translateY(0)}
.h3h-inner{max-width:1240px;margin:0 auto;display:grid;gap:30px}
.h3h-inner.h3h-promo-grid{grid-template-columns:1fr 320px}
.h3h-cols{display:grid;gap:14px 40px}
.h3h-grp{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--h3h-blue);margin-bottom:14px}.h3h-stack .h3h-grp:not(:first-child){margin-top:30px}
.h3h-ml{display:flex;gap:13px;align-items:flex-start;text-decoration:none;padding:11px 12px;border-radius:13px;transition:background .15s}
.h3h-ml:hover{background:var(--h3h-line)}
.h3h-ml .h3h-ico{flex-shrink:0;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#eef3ff;color:var(--h3h-blue)}
.h3h-ml .h3h-ico svg{width:19px;height:19px}
.h3h-ml .h3h-t{display:block;font-weight:700;font-size:14.5px;color:var(--h3h-ink);line-height:1.25}
.h3h-ml .h3h-d{display:block;font-weight:500;font-size:12.5px;color:var(--h3h-muted);margin-top:3px;line-height:1.35}
.h3h-ml.h3h-simple{padding:9px 12px}
.h3h-ml.h3h-simple .h3h-t{font-size:14px;font-weight:600}
.h3h-stack{display:flex;flex-direction:column;gap:2px}
.h3h-res{grid-template-columns:1.05fr 1.25fr 1.1fr .95fr;gap:24px}.h3h-res .h3h-ml{padding:7px 10px}.h3h-res .h3h-t{font-size:13px}.h3h-res .h3h-grp{font-size:10px}.h3h-res .h3h-grp:first-child{margin-top:0!important}

.h3h-card{background:linear-gradient(160deg,#0d1a40,#13245a);color:#fff;border-radius:18px;padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.h3h-card .h3h-pk{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--h3h-gold)}
.h3h-card h4{font-size:19px;font-weight:800;margin:10px 0 8px;line-height:1.25;color:#fff}
.h3h-card p{font-size:13px;color:#c2cbe6;font-weight:500;line-height:1.5;margin-bottom:18px}
.h3h-card a.h3h-pbtn{align-self:flex-start;background:#fff;color:var(--h3h-navy) !important;font-weight:700;font-size:13px;padding:9px 16px;border-radius:9px;text-decoration:none;transition:transform .15s}
.h3h-card a.h3h-pbtn:hover{transform:translateX(3px);color:var(--h3h-navy) !important}

/* mobile nav */
.h3h-mnav{position:absolute;left:0;right:0;top:100%;background:var(--h3h-navy);color:#fff;max-height:0;overflow:hidden;transition:max-height .35s ease;z-index:80;border-radius:0 0 var(--h3h-radius) var(--h3h-radius)}
.h3h.h3h-mopen .h3h-mnav{max-height:calc(100vh - var(--h3h-h));overflow-y:auto;box-shadow:var(--h3h-shadow)}
.h3h-mnav-inner{padding:10px 18px 30px}
.h3h-acc{border-bottom:1px solid rgba(255,255,255,.08)}
.h3h-acc > button{width:100%;display:flex;align-items:center;justify-content:space-between;background:none;border:0;color:#fff;font-weight:700;font-size:16px;padding:16px 4px;cursor:pointer}
.h3h-acc > button .h3h-chev{width:18px;height:18px;color:#8fa3cf;transition:transform .28s}
.h3h-acc.h3h-open > button .h3h-chev{transform:rotate(180deg)}
.h3h-sub{max-height:0;overflow:hidden;transition:max-height .3s ease}
.h3h-acc.h3h-open .h3h-sub{max-height:none}
.h3h-sub a{display:block;color:#bcc7e6;text-decoration:none;font-weight:500;font-size:14.5px;padding:11px 4px 11px 14px;border-left:2px solid rgba(255,255,255,.12);margin-left:4px}
.h3h-sub a:hover{color:#fff;border-color:var(--h3h-blue)}
.h3h-sub .h3h-subh{font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--h3h-gold);padding:14px 4px 4px;border:0;margin-left:0}
.h3h-mcta{padding:20px 4px 0;display:flex;flex-direction:column;gap:12px}
.h3h-mcta .h3h-cta{text-align:center;padding:14px}
.h3h-mcta .h3h-ghost{text-align:center;border:1.5px solid rgba(255,255,255,.25);color:#fff;border-radius:11px;padding:13px;font-weight:700;font-size:14.5px;text-decoration:none}

.h3h-grp-link{cursor:pointer}.h3h-grp-link:hover{text-decoration:underline}
@media (max-width:980px){
  .h3h-nav,.h3h-right .h3h-cta,.h3h-right .h3h-link{display:none}
  .h3h-burger{display:block}
  .h3h-bar{gap:0}
}


/* mobile account button fix (2026-07-19): keep label on one line; below 980px hide the bare text label (font-size:0), avatar + chevron keep fixed px sizes */
.h3h-right .h3h-acct > button{white-space:nowrap}
@media (max-width:980px){
  .h3h-right .h3h-acct > button{font-size:0;gap:4px;padding:6px 8px}
}


/* mobile header gap fix (2026-07-19): BD theme l-styles sets .header margin-top 50px at max-width 1100px to clear its native navbar. The h3h header hides that navbar, so the 50px is dead space pushing page content down on mobile. */
@media only screen and (max-width:1100px){
  .header{margin-top:0 !important}
}
