/*
 * WordPress / GeneratePress adapter for the canonical Statx header.
 * Visual tokens and shared behavior remain owned by statx-header.css.
 * These rules only make the shared shell authoritative over GeneratePress.
 */

.site-header.sx-header {
  position: fixed !important;
  top: var(--sx-header-offset-top) !important;
  left: 0 !important;
  right: var(--sx-scrollbar-gap) !important;
  width: auto !important;
  max-width: none !important;
  height: var(--sx-header-height-mobile) !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: var(--sx-header-z) !important;
  transform: none !important;

  background: var(--sx-header-bg) !important;
  border-bottom: 1px solid var(--sx-header-border) !important;
  -webkit-backdrop-filter: var(--sx-header-blur) !important;
  backdrop-filter: var(--sx-header-blur) !important;
  box-shadow: 0 18px 44px -32px rgba(0, 0, 0, 0.68) !important;
  color: #fff !important;
}

.site-header.sx-header .inside-header.sx-header-inner {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: 1rem !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0.875rem var(--sx-header-pad-inline) !important;
  background: transparent !important;
}

.site-header.sx-header .main-navigation,
.site-header.sx-header .inside-navigation,
.site-header.sx-header .main-nav {
  background: transparent !important;
}

/* WordPress-only decoration; the native menu carries these through reparenting. */
.sx-header .main-nav a, .sx-site-menu .main-nav a { gap: .65rem; }
.sx-nav-icon {
  display: block;
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  stroke: currentColor;
}

/*
 * GeneratePress owns native mobile toggles normally.
 * The unified Statx shell owns the only visible mobile trigger here.
 */
.site-header.sx-header .mobile-menu-control-wrapper,
.site-header.sx-header .menu-toggle,
.site-header.sx-header button.menu-toggle,
.site-header.sx-header .menu-bar-items {
  display: none !important;
}

.site-header.sx-header .sx-site-burger {
  display: none !important;
}

@media (max-width: 1023px) {
  html.sx-header-js .site-header.sx-header .sx-site-burger {
    display: inline-grid !important;
  }

  .site-header.sx-header .main-navigation {
    display: none !important;
  }

  .site-header.sx-header.sx-menu-open {
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
  }

  /*
   * Progressive fallback if JS is genuinely unavailable.
   * Do not leave navigation inaccessible.
   */
  html:not(.sx-header-js) .site-header.sx-header {
    position: relative !important;
    top: auto !important;
    height: auto !important;
  }

  html:not(.sx-header-js) .site-header.sx-header .inside-header.sx-header-inner {
    flex-wrap: wrap !important;
  }

  html:not(.sx-header-js) .site-header.sx-header .main-navigation {
    display: block !important;
    width: 100% !important;
  }
}

@media (min-width: 1024px) {
  .site-header.sx-header .main-navigation .sx-nav-icon {
    display: none;
  }

  .site-header.sx-header {
    height: var(--sx-header-height-desktop) !important;
  }

  .site-header.sx-header .main-navigation {
    display: block !important;
    margin-left: auto !important;
  }
}
