/* ══════════════════════════════════════════════════════════════════
   BBA shared site header — self-contained, mirrors the homepage nav.
   Used on product.html / status.html / support.html / pay.html so every
   page carries the same sticky bar. Values hardcoded (not :root vars) so
   it renders identically regardless of the host page's tokens.
═══════════════════════════════════════════════════════════════════ */
.bba-promo{background:#0A1524;color:#cdd9e6;font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:13px;text-align:center;padding:8px 16px;border-bottom:1px solid rgba(255,255,255,.07);line-height:1.4}
.bba-promo a{color:#fff;text-decoration:none;font-weight:600;white-space:nowrap}
.bba-promo a:hover{text-decoration:underline}
.bba-promo .bba-dot{color:#2BB9C9}

.bba-header{position:sticky;top:0;z-index:100;background:#102A4A;height:72px;border-bottom:1px solid rgba(43,185,201,.15);transition:border-color .2s ease,box-shadow .3s ease}
.bba-header.bba-scrolled{border-bottom-color:rgba(43,185,201,.30);box-shadow:0 2px 16px rgba(10,30,54,.55)}
.bba-header-inner{max-width:1200px;margin:0 auto;padding:0 32px;height:100%;display:flex;align-items:center;gap:40px}
.bba-logo{flex-shrink:0;text-decoration:none;display:flex;align-items:center}
.bba-logo img{display:block;height:48px;width:auto}

.bba-nav{display:flex;align-items:center;gap:24px;margin-left:auto}
.bba-nav>a{position:relative;font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:14px;font-weight:500;color:rgba(255,255,255,.75);text-decoration:none;white-space:nowrap;padding-bottom:3px;transition:color .12s ease}
.bba-nav>a:hover{color:#fff}
.bba-nav>a:not(.bba-cart)::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:1px;background:#2BB9C9;transition:width .25s ease}
.bba-nav>a:not(.bba-cart):hover::after{width:100%}
.bba-nav>a:focus-visible{outline:2px solid rgba(255,255,255,.6);outline-offset:2px}

.bba-cart{display:flex;align-items:center;gap:7px;padding:8px 15px;border:1px solid rgba(43,185,201,.5);border-radius:999px;color:#fff!important;font-weight:600;margin-left:6px;position:relative}
.bba-cart:hover{background:rgba(43,185,201,.16);border-color:rgba(43,185,201,.85)}
.bba-cart-badge{background:linear-gradient(120deg,#0C6E78,#2BB9C9);color:#fff;font-family:'IBM Plex Mono',monospace;font-size:11px;line-height:1;min-width:18px;height:18px;border-radius:999px;display:none;align-items:center;justify-content:center;padding:0 5px}
.bba-cart-badge.on{display:inline-flex}

.bba-burger{display:none;background:none;border:none;cursor:pointer;padding:6px;color:rgba(255,255,255,.8);margin-left:auto;flex-shrink:0}
.bba-burger:focus-visible{outline:2px solid rgba(255,255,255,.6);outline-offset:2px;border-radius:4px}

.bba-drawer{display:none;position:absolute;top:72px;left:0;right:0;background:#102A4A;border-top:1px solid rgba(43,185,201,.15);padding:8px 0 16px;z-index:99}
.bba-drawer.open{display:block}
.bba-drawer a{display:block;font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:15px;font-weight:500;color:rgba(255,255,255,.8);text-decoration:none;padding:12px 28px;border-bottom:1px solid rgba(255,255,255,.06)}
.bba-drawer a:hover{color:#fff;background:rgba(255,255,255,.04)}

@media(max-width:1120px){
  .bba-nav{display:none}
  .bba-burger{display:flex;align-items:center}
}
@media(max-width:640px){
  .bba-header-inner{padding:0 18px;gap:16px}
  .bba-logo img{height:42px}
}

/* BBA brand weave (2026-07-13): promo bullet -> red spark */
.bba-promo .bba-dot{display:none}
.bba-promo::before{content:"";display:inline-block;width:8px;height:8px;margin-right:7px;vertical-align:-1px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0 L14.4 9.6 L24 12 L14.4 14.4 L12 24 L9.6 14.4 L0 12 L9.6 9.6 Z' fill='%23E9504B'/%3E%3C/svg%3E") center/contain no-repeat}
