/* Shared header contract, paired with header.js.
 * Desktop brand/control layout and legacy menu ownership stay with the site.
 * At <=768px the brand and controls share one content-sized row.
 * Only successfully bound disclosures collapse; no-JS navigation stays in flow.
 * Popup paint is bounded on the popup, never on the fixed-menu ancestor.
 */
header[data-site-header][data-header-contract="1"] {
  --header-paper: var(--paper, #ffffff);
  --header-ink: var(--ink, #14110d);
  --header-line: var(--line, rgba(20, 17, 13, 0.16));
  --header-popup-paper: #ffffff;
  --header-popup-ink: #14110d;
  --header-popup-line: rgba(0, 0, 0, 0.16);
  --header-popup-shadow: 0 16px 36px rgba(0, 0, 0, 0.25);
}
[data-theme="dark"] header[data-site-header][data-header-contract="1"],
header[data-site-header][data-header-contract="1"][data-theme="dark"],
.theme-dark header[data-site-header][data-header-contract="1"] {
  --header-paper: var(--paper, #1a1e24);
  --header-ink: var(--ink, #f0f2f5);
  --header-line: var(--line, rgba(255, 255, 255, 0.16));
  --header-popup-paper: #1a1e24;
  --header-popup-ink: #f0f2f5;
  --header-popup-line: rgba(255, 255, 255, 0.16);
  --header-popup-shadow: 0 16px 36px rgba(0, 0, 0, 0.40);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) header[data-site-header][data-header-contract="1"] {
    --header-paper: var(--paper, #1a1e24);
    --header-ink: var(--ink, #f0f2f5);
    --header-line: var(--line, rgba(255, 255, 255, 0.16));
    --header-popup-paper: #1a1e24;
    --header-popup-ink: #f0f2f5;
    --header-popup-line: rgba(255, 255, 255, 0.16);
    --header-popup-shadow: 0 16px 36px rgba(0, 0, 0, 0.40);
  }
}
/* Preserve the desktop preference strip. */
header[data-site-header][data-header-contract="1"] .header-picker {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
header[data-site-header][data-header-contract="1"] .header-options {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
header[data-site-header][data-header-contract="1"] .header-picker-toggle,
header[data-site-header][data-header-contract="1"] button[data-header-menu] {
  display: none;
}
/* Visible fixed drawers must remain viewport-bound. */
header[data-site-header][data-scroll-header="mobile"] {
  transform: none;
}
@media (max-width: 768px) {
  header[data-site-header][data-header-contract="1"]:has(> [data-header-brand]):has(> [data-header-controls]),
  header[data-site-header][data-header-contract="1"] :has(> [data-header-brand]):has(> [data-header-controls]) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    margin-inline: 0;
    padding: 8px 16px;
  }
  header[data-site-header][data-header-contract="1"].header-enhanced:not([data-header-menu-invalid]):not(:has([data-header-picker-invalid])):has(> [data-header-brand]):has(> [data-header-controls]),
  header[data-site-header][data-header-contract="1"].header-enhanced:not([data-header-menu-invalid]):not(:has([data-header-picker-invalid])) :has(> [data-header-brand]):has(> [data-header-controls]) {
    flex-wrap: nowrap;
  }
  header[data-site-header][data-header-contract="1"] [data-header-brand] {
    color: var(--header-ink);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 0%;
    min-width: 0;
    max-width: none;
  }
  header[data-site-header][data-header-contract="1"] [data-header-brand],
  header[data-site-header][data-header-contract="1"] [data-header-brand] :is(a, span, strong, b, small, div, p, h1, h2) {
    min-width: 0;
    white-space: normal;
    overflow: visible;
    overflow-wrap: anywhere;
    text-overflow: clip;
    -webkit-line-clamp: unset;
    max-height: none;
  }
  header[data-site-header][data-header-contract="1"] [data-header-brand] > :is(img, svg) {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    object-fit: contain;
  }
  header[data-site-header][data-header-contract="1"] [data-header-controls] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: 4px;
    max-width: 100%;
  }
  header[data-site-header][data-header-contract="1"].header-enhanced:not([data-header-menu-invalid]):not(:has([data-header-picker-invalid])) [data-header-controls] {
    flex-wrap: nowrap;
  }
  header[data-site-header][data-header-contract="1"] [data-header-controls] button {
    appearance: none;
    font: inherit;
    box-sizing: border-box;
    min-width: 44px;
    min-height: 44px;
    flex-shrink: 0;
  }
  header[data-site-header][data-header-contract="1"] .header-picker[data-header-picker-ready="1"] > .header-picker-toggle,
  header[data-site-header][data-header-contract="1"] button[data-header-menu][data-header-menu-ready="1"] {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--header-ink);
    cursor: pointer;
  }
  header[data-site-header][data-header-contract="1"] :is(.header-picker-toggle, button[data-header-menu]) svg {
    width: 20px;
    height: 20px;
    pointer-events: none;
  }
  header[data-site-header][data-header-contract="1"] :is(.header-picker-toggle, button[data-header-menu])[aria-expanded="true"] {
    border-color: var(--header-line);
    background: var(--header-paper);
  }
  /* A failed/no-JS bind cannot strand links. Legacy handlers retain ownership. */
  header[data-site-header][data-header-contract="1"]:not(.header-enhanced) :is(.nav-menu, #navMenu, [data-nav-menu]),
  header[data-site-header][data-header-contract="1"][data-header-menu-invalid] :is(.nav-menu, #navMenu, [data-nav-menu]) {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    flex-basis: 100%;
  }
  header[data-site-header][data-header-contract="1"] .header-picker[data-header-picker-ready="1"] > .header-options,
  header[data-site-header][data-header-contract="1"] [data-nav-menu][data-header-menu-ready="1"] {
    display: none !important;
  }
  header[data-site-header][data-header-contract="1"] .header-picker[data-header-picker-ready="1"].is-open > .header-options,
  header[data-site-header][data-header-contract="1"] [data-nav-menu][data-header-menu-ready="1"][data-header-menu-open="true"] {
    display: flex !important;
    flex-direction: column;
    gap: 4px;
  }
  header[data-site-header] :is(.nav-menu, #navMenu, [data-nav-menu]):not([data-header-menu-ready]):is(.open, [data-visible="true"]) {
    display: block !important;
  }
  /* The 16px real clip margin retains a deep shadow with a bounded footprint.
   * Do not move contain/clip to the header: that would re-anchor fixed menus.
   * Scrollable content is retained, never made invisible to evade contrast QA. */
  header[data-site-header][data-header-contract="1"] .header-picker[data-header-picker-ready="1"] > .header-options,
  header[data-site-header][data-header-contract="1"] [data-nav-menu][data-header-menu-ready="1"],
  header[data-site-header] :is(.nav-menu, #navMenu, [data-nav-menu]):is(.open, [data-visible="true"]) {
    box-sizing: border-box;
    position: fixed !important;
    top: calc(var(--header-height, 64px) + 8px) !important;
    right: 16px !important;
    left: 16px !important;
    width: auto;
    margin: 0;
    padding: 12px;
    border: 1px solid var(--header-popup-line, rgba(0, 0, 0, 0.16)) !important;
    border-radius: 12px;
    background: var(--header-popup-paper, #ffffff) !important;
    color: var(--header-popup-ink, #14110d) !important;
    box-shadow: var(--header-popup-shadow, 0 16px 36px rgba(0, 0, 0, 0.25)) !important;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - var(--header-height, 64px) - 32px);
    max-height: calc(100dvh - var(--header-height, 64px) - 32px);
    overflow: auto;
    overscroll-behavior: contain;
    contain: paint;
    clip-path: inset(-16px);
    z-index: 99999 !important;
  }
  header[data-site-header][data-header-contract="1"] .header-picker[data-header-picker-ready="1"] > .header-options {
    left: auto !important;
    width: max-content;
    padding: 4px;
    z-index: 100000 !important;
  }
  header[data-site-header][data-header-contract="1"] .header-options > button,
  header[data-site-header][data-header-contract="1"] [data-nav-menu] a[href],
  header[data-site-header] :is(.nav-menu, #navMenu):is(.open, [data-visible="true"]) a[href] {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 44px;
    min-height: 44px;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: inherit !important;
    white-space: normal;
    overflow-wrap: anywhere;
    text-decoration: none;
  }
  header[data-site-header][data-header-contract="1"] .header-options > button[aria-pressed="true"] {
    border-color: var(--header-line);
  }
  header[data-site-header][data-header-contract="1"] :is(button, a):focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
  }
  header[data-site-header] :is(.nav-menu, #navMenu, [data-nav-menu]) .nav-links {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  header[data-site-header][data-scroll-header="mobile"] {
    transition: transform 220ms ease;
  }
  header[data-site-header][data-scroll-header="mobile"].is-header-hidden {
    transform: translateY(-100%);
  }
  header[data-site-header][data-scroll-header="mobile"]:focus-within {
    transition: none;
    transform: none;
  }
  /* The mobile navigation owns the remaining viewport, not a floating slice
   * over half-readable page copy. Preference disclosures remain content-sized. */
  header[data-site-header][data-header-contract="1"] [data-nav-menu][data-header-menu-ready="1"] {
    bottom: 0 !important;
    height: calc(100vh - var(--header-height, 64px) - 8px);
    height: calc(100dvh - var(--header-height, 64px) - 8px);
    max-height: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  /* Preference choices reserve their own header row; navigation remains a fixed drawer. */
header[data-site-header][data-header-contract="1"] .header-picker[data-header-picker-ready="1"] > .header-options {
 position:absolute !important;top:var(--disclosure-top,100%) !important;
 left:var(--disclosure-left,0px) !important;right:auto !important;
 width:var(--disclosure-width,100%) !important;max-width:none;
 max-height:var(--disclosure-max-height,calc(100dvh - var(--disclosure-row-height,64px) - 32px));
 margin:0;padding:8px;flex-direction:row !important;flex-wrap:wrap;
 box-shadow:none !important;clip-path:none;contain:paint;
}
header[data-site-header][data-header-contract="1"] .header-options > button {
 flex:1 1 44px;min-width:44px;min-height:44px;white-space:normal;
}
}
/* PINNED VISIBLE, independent of viewport: no nested media-query accident. */
@media (prefers-reduced-motion: reduce) {
  header[data-site-header][data-scroll-header="mobile"],
  header[data-site-header][data-scroll-header="mobile"].is-header-hidden {
    transition: none;
    transform: none;
  }
}