/* Per-page anchor menu ("on this page"), injected sitewide by lib/page-nav.mjs.

   Scoped entirely to .wbanav. The seven market-report pages hand-code their own
   .anav menu and this file must never reach them -- it is injected before
   </head>, so it cascades after their inline <style> and would override it.

   Every declaration is defensive about the host page: these ~908 pages each
   carry their own bare `ul {...}` / `a {...}` / `nav {...}` rules, so anything
   not stated here is inherited from whatever that page happens to set. */

.wbanav {
  position: sticky;
  top: 0;
  z-index: 50;
  background: #fff;
  border-bottom: 1px solid var(--border, #e4e0d8);
  padding: 0 26px;
  margin: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  max-width: none;
  float: none;
  text-align: left;
  box-shadow: 0 1px 0 rgba(27, 42, 74, 0.04);
}

.wbanav::-webkit-scrollbar {
  display: none;
}

.wbanav ul {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: 1060px;
  display: flex;
  gap: 2px;
  white-space: nowrap;
  align-items: stretch;
}

.wbanav li {
  margin: 0;
  padding: 0;
  list-style: none;
  background: none;
  text-indent: 0;
  display: block;
}

.wbanav li::before,
.wbanav li::marker {
  content: none;
}

.wbanav a {
  display: inline-block;
  padding: 11px 14px;
  font-family: "DM Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: normal;
  text-transform: none;
  color: var(--navy, #1b2a4a);
  text-decoration: none;
  border-bottom: 3px solid transparent;
  background: none;
  text-shadow: none;
}

.wbanav a:hover,
.wbanav a:focus-visible {
  color: var(--orange, #d4842a);
  border-bottom-color: var(--orange, #d4842a);
}

.wbanav a.cta {
  color: var(--orange, #d4842a);
}

/* The menu is sticky, so an in-page jump would land the heading underneath it.
   Applied to every :target rather than only the menu's own, because the pages'
   existing anchors (FAQ links, TOCs, the SVCDEEP rails) jump to the same
   headings and sit under the same bar.

   Gated behind :has(.wbanav) because this sheet is linked on EVERY page --
   including the homepage, the error pages, and the seven that hand-code their
   own .anav. Without the gate these two rules would change scrolling behaviour
   on pages the menu never touched. Browsers without :has() simply keep their
   current behaviour, which is the pre-existing one. */
body:has(.wbanav) :target {
  scroll-margin-top: 56px;
}

html:has(.wbanav) {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html:has(.wbanav) {
    scroll-behavior: auto;
  }
}

@media (max-width: 700px) {
  .wbanav {
    padding: 0 14px;
  }
  .wbanav a {
    padding: 10px 11px;
    font-size: 12px;
  }
}

@media print {
  .wbanav {
    display: none;
  }
}