/* ============================================================================
   Blue·Wire — shared global nav. One nav, identical on every page.
   Self-contained (bw- prefixed classes); references design tokens with fallbacks
   so it looks the same regardless of a page's own CSS. Behaviour: bluewire-nav.js
   ============================================================================ */
.bw-nav{ position:sticky; top:0; z-index:60;
  background:color-mix(in srgb, var(--paper,#f2f1ec) 86%, transparent);
  backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--line,#d9d8cf);
  font-family:'Schibsted Grotesk', system-ui, sans-serif; }
.bw-nav *{ box-sizing:border-box; }
.bw-nav-wrap{ max-width:1240px; margin:0 auto; padding:0 32px; display:flex; align-items:center; height:68px; gap:36px; }
.bw-mark{ font-weight:700; letter-spacing:-.02em; display:inline-flex; align-items:baseline; font-size:23px; color:var(--ink,#16202d); text-decoration:none; }
.bw-mark .dot{ color:var(--accent,#1b50d0); margin:0 .12em; }
.bw-mark .wire{ font-family:'Newsreader', Georgia, serif; font-style:italic; font-weight:500; letter-spacing:0; }
.bw-nav-links{ display:flex; gap:28px; margin-left:8px; }
.bw-nav-links a{ font-weight:500; font-size:15px; color:var(--ink,#16202d); text-decoration:none; position:relative; padding:4px 0; }
.bw-nav-links a::after{ content:""; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:var(--accent,#1b50d0); transition:right .2s ease; }
.bw-nav-links a:hover::after, .bw-nav-links a[aria-current]::after{ right:0; }
.bw-nav-links a[aria-current]{ color:var(--accent-ink, var(--accent-hi,#173fa6)); }
.bw-nav-r{ margin-left:auto; display:flex; align-items:center; gap:8px; }
.bw-icon{ width:40px; height:40px; display:grid; place-items:center; border-radius:6px; color:var(--ink,#16202d); position:relative; text-decoration:none; }
.bw-icon:hover{ background:var(--paper-2,#e9e8e1); }
.bw-cart-count{ position:absolute; top:5px; right:5px; min-width:16px; height:16px; padding:0 4px;
  background:var(--accent,#1b50d0); color:#fff; font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:10px; font-weight:600; border-radius:9px; display:grid; place-items:center; line-height:1; }
.bw-cart-count[hidden]{ display:none; }
.bw-signin, .bw-account{ display:inline-flex; align-items:center; gap:9px; font-family:'Schibsted Grotesk', system-ui, sans-serif;
  font-weight:600; font-size:14.5px; color:var(--ink,#16202d); text-decoration:none; border:1px solid var(--line,#d9d8cf);
  background:#fff; border-radius:8px; padding:9px 15px; cursor:pointer; margin-left:6px; white-space:nowrap; }
.bw-signin:hover, .bw-account:hover{ border-color:var(--accent,#1b50d0); color:var(--accent-ink, var(--accent-hi,#173fa6)); }
.bw-account[hidden], .bw-signin[hidden]{ display:none; }
.bw-avatar{ width:24px; height:24px; border-radius:50%; background:var(--accent,#1b50d0); color:#fff; display:grid; place-items:center; font-size:12px; font-weight:700; }
@media(max-width:880px){ .bw-nav-links{ display:none; } }