/* ── BW V4 NAV — canonical shared stylesheet ── */
/* Loaded on all marketing pages. Overrides per-page inline nav CSS drift. */

.v4-wrap {
  display:flex; justify-content:center; flex-direction:column; align-items:center;
  padding:calc(1.4rem + env(safe-area-inset-top,0px)) 1rem 0;
  position:relative; z-index:5;
}
.v4 {
  display:flex; align-items:center; gap:0.5rem;
  background:linear-gradient(180deg, rgba(20,18,40,0.92), rgba(12,10,28,0.95));
  border:1px solid transparent; background-clip:padding-box;
  border-radius:999px;
  padding:0.45rem 0.55rem 0.45rem 1.4rem;
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
  box-shadow:
    0 24px 60px -16px rgba(0,0,0,0.7),
    0 0 50px -12px rgba(168,85,247,0.32),
    inset 0 1px 0 rgba(255,255,255,0.05);
  position:relative;
  max-width:calc(100vw - 32px);
}
.v4::before {
  content:''; position:absolute; inset:-1px; border-radius:inherit; padding:1px;
  background:linear-gradient(135deg, rgba(192,132,252,0.6), rgba(236,72,153,0.25) 50%, rgba(56,189,248,0.4));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  pointer-events:none;
}
.v4-brand {
  display:flex; align-items:center; gap:0.6rem;
  padding-right:1rem;
  border-right:1px solid var(--rule, #1e1a30);
  min-height:34px;
}
.v4-brand .word {
  font-family:'Heavyweight','Newsreader',serif;
  font-weight:400; font-size:1.05rem; letter-spacing:0.06em;
  text-transform:uppercase; color:#f5f3fa; line-height:1;
  white-space:nowrap;
}
.v4-brand .bw-img {
  width:26px; height:26px; flex-shrink:0; border-radius:6px;
  filter:drop-shadow(0 0 8px rgba(192,132,252,0.25));
}
.v4-nav {
  display:flex; align-items:center; gap:0.4rem;
  padding:0 0.4rem;
  font-family:'Newsreader',serif;
}
.v4-nav a {
  padding:0.5rem 0.9rem;
  font-size:0.98rem;
  color:var(--text, #e2e8f0);
  border-radius:999px;
  transition:background 0.15s ease, color 0.15s ease;
  white-space:nowrap;
  min-height:36px; display:inline-flex; align-items:center;
  text-decoration:none;
}
.v4-nav a:hover { background:rgba(192,132,252,0.1); color:var(--accent, #c084fc); }
.v4-nav a.is-current { color:var(--accent, #c084fc); background:rgba(192,132,252,0.08); }
.v4-nav a.is-pres {
  font-family:'Heavyweight','Space Grotesk',sans-serif;
  font-weight:400; font-size:0.82rem; letter-spacing:0.14em;
  text-transform:uppercase; color:#c4b5fd;
  animation:rxbreathe 5.5s ease-in-out infinite;
}
.v4-nav a.is-pres:hover { color:#e9d5ff; background:rgba(192,132,252,0.12); }
@keyframes rxbreathe {
  0%,100% { text-shadow:0 0 6px rgba(168,85,247,0.18); color:#c4b5fd; }
  50%      { text-shadow:0 0 12px rgba(192,132,252,0.5), 0 0 26px rgba(168,85,247,0.22); color:#e9d5ff; }
}
.v4-search {
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,0.03);
  border:1px solid var(--rule-strong, #2a2440);
  display:flex; align-items:center; justify-content:center;
  color:var(--muted, #94a3b8); cursor:pointer;
  margin:0 0.2rem; flex-shrink:0;
  transition:color 0.15s ease, border-color 0.15s ease;
  -webkit-tap-highlight-color:transparent;
}
.v4-search:hover { color:var(--accent, #c084fc); border-color:var(--accent, #c084fc); }
.v4-search svg { width:14px; height:14px; }
.v4-cta {
  display:inline-flex; align-items:center; gap:0.5rem;
  background:#e9d5ff; color:#080510;
  padding:0.55rem 1rem; border-radius:999px;
  font-family:'Newsreader',serif; font-weight:600;
  font-size:0.95rem; min-height:34px;
  white-space:nowrap; flex-shrink:0;
  transition:transform 0.15s ease, box-shadow 0.15s ease;
  text-decoration:none;
}
.v4-cta:hover { transform:translateY(-1px); box-shadow:0 10px 24px -8px rgba(168,85,247,0.55); }
.v4-cta .ar { font-style:italic; }
.v4-hamburger {
  display:none;
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(180deg, rgba(40,30,70,0.92), rgba(18,12,32,0.98));
  border:1.5px solid rgba(192,132,252,0.6);
  cursor:pointer; align-items:center; justify-content:center;
  padding:0; -webkit-tap-highlight-color:transparent;
  flex-direction:column; gap:5px;
  box-shadow:0 0 18px rgba(168,85,247,0.45), 0 6px 16px -4px rgba(0,0,0,0.55);
  transition:border-color 0.18s ease, box-shadow 0.18s ease;
}
.v4-hamburger:hover { border-color:var(--accent, #c084fc); box-shadow:0 0 26px rgba(168,85,247,0.7), 0 6px 18px -4px rgba(0,0,0,0.55); }
.v4-hamburger .l1, .v4-hamburger .l2 {
  width:18px; height:2px; border-radius:1px;
  background:linear-gradient(90deg, var(--accent, #c084fc), #e9d5ff);
  transition:transform 0.25s ease, opacity 0.2s ease;
  box-shadow:0 0 8px rgba(192,132,252,0.65);
}
.v4-hamburger.open .l1 { transform:translateY(2.8px) rotate(45deg); background:linear-gradient(90deg, #e9d5ff, #ec4899); }
.v4-hamburger.open .l2 { transform:translateY(-2.8px) rotate(-45deg); background:linear-gradient(90deg, #ec4899, #e9d5ff); }
.v4-nav-drawer {
  display:none; flex-direction:column;
  margin-top:0.7rem; padding:0;
  width:min(560px, calc(100vw - 28px));
  background:linear-gradient(180deg, rgba(20,18,40,0.96), rgba(8,6,22,0.98));
  border-radius:22px;
  border:1px solid transparent; background-clip:padding-box;
  -webkit-backdrop-filter:blur(22px); backdrop-filter:blur(22px);
  box-shadow:0 26px 52px -16px rgba(0,0,0,0.7), 0 0 80px -20px rgba(168,85,247,0.35);
  position:relative; overflow:hidden;
  max-height:0; opacity:0; transform:translateY(-6px);
  transition:max-height 0.36s cubic-bezier(.2,.7,.2,1), padding 0.24s ease, opacity 0.22s ease, transform 0.28s cubic-bezier(.2,.7,.2,1);
}
.v4-nav-drawer::before {
  content:''; position:absolute; inset:-1px; border-radius:inherit; padding:1px;
  background:linear-gradient(135deg, rgba(192,132,252,0.7), rgba(236,72,153,0.3) 50%, rgba(56,189,248,0.5));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.v4-nav-drawer.open {
  display:flex; max-height:560px;
  padding:0.8rem 1.1rem 1rem;
  opacity:1; transform:translateY(0);
}
.v4-nav-drawer a {
  display:flex; align-items:center; justify-content:space-between;
  font-family:'Newsreader',Georgia,serif; font-size:1.08rem;
  color:var(--text, #e2e8f0); padding:0.95rem 0.4rem;
  border-bottom:1px solid var(--rule, #1e1a30);
  min-height:52px;
  transition:color 0.16s ease, padding-left 0.18s ease;
  text-decoration:none;
}
.v4-nav-drawer a:last-child { border-bottom:none; }
.v4-nav-drawer a::after {
  content:'\203A';
  font-style:italic; font-weight:500;
  color:var(--dim, #6b7280); font-size:1.2rem; line-height:1;
  transition:color 0.18s ease, transform 0.22s ease;
  margin-left:1rem;
}
.v4-nav-drawer a:hover, .v4-nav-drawer a:active { color:var(--accent, #c084fc); padding-left:0.7rem; }
.v4-nav-drawer a:hover::after { color:var(--accent, #c084fc); transform:translateX(3px); }
.v4-nav-drawer a.is-current { color:var(--accent, #c084fc); }
.v4-nav-drawer a.is-pres {
  font-family:'Heavyweight','Space Grotesk',sans-serif;
  font-weight:400; font-size:0.95rem; letter-spacing:0.14em;
  text-transform:uppercase; color:#c4b5fd;
}
.v4-nav-drawer a.is-pres:hover { color:#e9d5ff; }
.v4-nav-drawer .drawer-signin {
  margin-top:0.45rem; padding:0.85rem 1rem;
  border:0; border-radius:14px;
  background:linear-gradient(135deg, #e9d5ff 0%, #f0e0ff 60%, #d8c4ff 100%);
  color:#080510;
  font-family:'Newsreader',serif; font-weight:600;
  letter-spacing:0; justify-content:center;
  box-shadow:0 1px 0 rgba(255,255,255,0.5) inset, 0 12px 28px -10px rgba(168,85,247,0.5);
}
.v4-nav-drawer .drawer-signin::after { content:'\2192'; color:#080510; font-style:italic; }
.v4-nav-drawer .drawer-signin:hover { color:#080510; padding-left:1rem; }
.v4-nav-drawer .drawer-signin:hover::after { transform:translateX(4px); color:#080510; }

@media (max-width:880px) {
  .v4 { padding:0.4rem 0.5rem 0.4rem 1rem; }
  .v4-brand { padding-right:0.7rem; }
  .v4-nav { display:none; }
  .v4-cta { display:none; }
  .v4-hamburger { display:flex; }
}
@media (max-width:520px) {
  .v4-cta { padding:0.5rem 0.85rem; font-size:0.88rem; gap:0.35rem; }
  .v4-brand .word { font-size:0.95rem; }
  .v4-brand .bw-img { width:22px; height:22px; }
}
