html {
  scroll-padding-top: var(--site-header-height, 0px);
  scrollbar-gutter: stable;
}

.site-header-block {
  box-sizing: border-box;
  isolation: isolate;
  width: 100%;
  z-index: 1000;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.site-header-block.alignfull,
.site-header-block.wp-block {
  max-width: none;
}

.site-header-block.is-mode-sticky-solid {
  background: var(--site-header-background, var(--site-header-scrolled-background, var(--wp--preset--color--base, #fff)));
  background-color: var(--site-header-background, var(--site-header-scrolled-background, var(--wp--preset--color--base, #fff)));
  color: var(--site-header-color, var(--site-header-scrolled-color, inherit));
  position: sticky;
  top: 0;
}

.site-header-block.is-mode-sticky-solid.is-scrolled {
  background: var(--site-header-scrolled-background, var(--site-header-background, var(--wp--preset--color--base, #fff)));
  background-color: var(--site-header-scrolled-background, var(--site-header-background, var(--wp--preset--color--base, #fff)));
  color: var(--site-header-scrolled-color, var(--site-header-color, inherit));
  box-shadow: 0 1px 0 rgb(0 0 0 / 0.08);
  backdrop-filter: var(--site-header-scrolled-backdrop-filter, none);
  -webkit-backdrop-filter: var(--site-header-scrolled-backdrop-filter, none);
}

body.admin-bar .site-header-block.is-mode-sticky-solid {
  top: var(--wp-admin--admin-bar--height, 32px);
}

.wp-block-template-part:has(> .site-header-block.is-mode-sticky-solid) {
  isolation: isolate;
  position: sticky;
  top: 0;
  z-index: 1000;
}

body.admin-bar .wp-block-template-part:has(> .site-header-block.is-mode-sticky-solid) {
  top: var(--wp-admin--admin-bar--height, 32px);
}

.wp-block-template-part:has(> .site-header-block.is-mode-sticky-solid) > .site-header-block.is-mode-sticky-solid {
  position: relative;
  top: auto;
}

.wp-block-template-part:has(> .site-header-block.is-mode-static-transparent) {
  position: static;
  z-index: 1000;
}

.site-header-block.is-mode-static-transparent {
  background: transparent;
  background-color: transparent;
  color: var(--site-header-color, inherit);
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.site-header-block.is-mode-static-transparent > * {
  background: transparent !important;
  background-color: transparent !important;
}

.wp-block-template-part:has(> .site-header-block.is-mode-transparent-until-scroll:not(.has-overlap-first-section)) {
  isolation: isolate;
  position: sticky;
  top: 0;
  z-index: 1000;
}

body.admin-bar .wp-block-template-part:has(> .site-header-block.is-mode-transparent-until-scroll:not(.has-overlap-first-section)) {
  top: var(--wp-admin--admin-bar--height, 32px);
}

.wp-block-template-part:has(> .site-header-block.is-mode-transparent-until-scroll:not(.has-overlap-first-section)) > .site-header-block.is-mode-transparent-until-scroll {
  position: relative;
  top: auto;
}

.site-header-block.is-mode-transparent-until-scroll {
  background: transparent;
  color: var(--site-header-color, inherit);
  position: sticky;
  top: 0;
}

body.admin-bar .site-header-block.is-mode-transparent-until-scroll {
  top: var(--wp-admin--admin-bar--height, 32px);
}

.site-header-block.is-mode-transparent-until-scroll.has-overlap-first-section {
  left: 0;
  position: fixed;
  right: 0;
}

.site-header-block.is-mode-transparent-until-scroll:not(.is-scrolled) {
  background: transparent !important;
  background-color: transparent !important;
}

.site-header-block.is-mode-transparent-until-scroll:not(.is-scrolled) > * {
  background: transparent !important;
  background-color: transparent !important;
}

.site-header-block.is-mode-transparent-until-scroll.is-scrolled {
  background: var(--site-header-scrolled-background, var(--wp--preset--color--base, #fff));
  background-color: var(--site-header-scrolled-background, var(--wp--preset--color--base, #fff));
  color: var(--site-header-scrolled-color, inherit);
  box-shadow: 0 1px 0 rgb(0 0 0 / 0.08);
  /* Glass treatment: blur belongs on the wrapper — it owns the scrolled
     surface (children are forced transparent in this mode), and descendants
     cannot blur past an animated ancestor anyway (backdrop root). */
  backdrop-filter: var(--site-header-scrolled-backdrop-filter, none);
  -webkit-backdrop-filter: var(--site-header-scrolled-backdrop-filter, none);
}

.site-header-block.is-mode-transparent-until-scroll.is-scrolled > * {
  background: transparent !important;
  background-color: transparent !important;
}

.site-header-block.has-header-text-color :where(.wp-block-site-title, .wp-block-site-title a, .wp-block-navigation-item__content, .wp-block-heading, p, a:not(.wp-block-button__link)),
.site-header-block.is-scrolled :where(.wp-block-site-title, .wp-block-site-title a, .wp-block-navigation-item__content, .wp-block-heading, p, a:not(.wp-block-button__link)) {
  color: inherit;
}

.site-header-block.is-scrolled.has-button-treatment-inherit :where(.wp-block-button__link, .wp-element-button) {
  color: inherit;
}

.site-header-block.is-scrolled.has-button-treatment-invert :where(.wp-block-button__link, .wp-element-button) {
  background: var(--site-header-scrolled-color, currentColor);
  background-color: var(--site-header-scrolled-color, currentColor);
  color: var(--site-header-scrolled-background, Canvas);
}

/*
 * A dynamic site title can be longer than the source wordmark. In a flex
 * header row, give a leading brand only the remaining space and reserve the
 * intrinsic width of persistent controls on its right. The title may be the
 * first child or immediately follow a leading site logo; a centered title in
 * a true three-zone composition is intentionally excluded.
 */
.site-header-block :where(.site-header-inner.is-layout-flex):has(> .wp-block-site-title:first-child ~ *) > .wp-block-site-title:first-child,
.site-header-block :where(.site-header-inner.is-layout-flex):has(> .wp-block-site-logo:first-child + .wp-block-site-title ~ *) > .wp-block-site-logo:first-child + .wp-block-site-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-header-block :where(.site-header-inner.is-layout-flex):has(> .wp-block-site-title:first-child ~ *) > .wp-block-site-title:first-child > a,
.site-header-block :where(.site-header-inner.is-layout-flex):has(> .wp-block-site-logo:first-child + .wp-block-site-title ~ *) > .wp-block-site-logo:first-child + .wp-block-site-title > a {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-header-block :where(.site-header-inner.is-layout-flex) > .wp-block-site-title:first-child ~ *,
.site-header-block :where(.site-header-inner.is-layout-flex) > .wp-block-site-logo:first-child + .wp-block-site-title ~ * {
  flex: 0 0 auto;
}

/*
 * Generated brands often wrap a decorative mark and wp:site-title in their
 * own leading flex group. That leading brand group is the flexible title
 * region; the outer header's navigation and utility controls must keep their
 * width. Requiring it to be first preserves true three-zone layouts whose
 * brand is deliberately centered between left and right controls.
 */
.site-header-block :where(.wp-block-group.is-layout-flex):has(> :where(.wp-block-group.is-layout-flex):first-child > .wp-block-site-title) > :where(.wp-block-group.is-layout-flex):first-child:has(> .wp-block-site-title) {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100%;
  overflow: hidden;
}

.site-header-block :where(.wp-block-group.is-layout-flex):has(> :where(.wp-block-group.is-layout-flex):first-child > .wp-block-site-title) > :where(.wp-block-group.is-layout-flex):first-child ~ * {
  flex: 0 0 auto;
}

.site-header-block :where(.wp-block-group.is-layout-flex):has(> :where(.wp-block-group.is-layout-flex):first-child > .wp-block-site-title) > :where(.wp-block-group.is-layout-flex):first-child:has(> .wp-block-site-title) .wp-block-site-title,
.site-header-block :where(.wp-block-group.is-layout-flex):has(> :where(.wp-block-group.is-layout-flex):first-child > .wp-block-site-title) > :where(.wp-block-group.is-layout-flex):first-child:has(> .wp-block-site-title) .wp-block-site-title > a {
  min-width: 0 !important;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/*
 * WooCommerce inserts account and mini-cart blocks into headers through the
 * Hooked Blocks API. They arrive as direct siblings of the existing
 * navigation, so a normal space-between header would distribute brand, nav,
 * account, and cart as four separate regions. Treat the hooked controls as a
 * compact utility cluster while preserving the generated header composition.
 */
.site-header-block .site-header-inner:has(> .wp-block-woocommerce-customer-account, > .wp-block-woocommerce-mini-cart) {
  gap: var(--wp--preset--spacing--20, 0.75rem);
  justify-content: flex-start !important;
}

.site-header-block .site-header-inner:has(> .wp-block-woocommerce-customer-account, > .wp-block-woocommerce-mini-cart) > .wp-block-navigation {
  margin-inline-start: auto;
}

.site-header-block .site-header-inner:has(> .wp-block-woocommerce-customer-account, > .wp-block-woocommerce-mini-cart) > :is(.wp-block-woocommerce-customer-account, .wp-block-woocommerce-mini-cart) {
  flex: 0 0 auto;
  margin: 0;
}

.site-header-block .site-header-inner:not(:has(> .wp-block-navigation)):has(> .wp-block-woocommerce-customer-account) > .wp-block-woocommerce-customer-account,
.site-header-block .site-header-inner:not(:has(> .wp-block-navigation)):has(> .wp-block-woocommerce-mini-cart) > .wp-block-woocommerce-mini-cart {
  margin-inline-start: auto;
}

body.has-solid-header-start .wp-block-template-part:has(> .site-header-block.is-mode-static-transparent) {
  position: static;
  top: auto;
}

body.has-solid-header-start .wp-block-template-part:has(> .site-header-block.is-mode-static-transparent) > .site-header-block.is-mode-static-transparent {
  left: auto;
  position: relative;
  right: auto;
  top: auto;
}

body.has-solid-header-start .wp-block-template-part:has(> .site-header-block.is-mode-transparent-until-scroll.has-overlap-first-section) {
  isolation: isolate;
  position: sticky;
  top: 0;
  z-index: 1000;
}

body.admin-bar.has-solid-header-start .wp-block-template-part:has(> .site-header-block.is-mode-transparent-until-scroll.has-overlap-first-section) {
  top: var(--wp-admin--admin-bar--height, 32px);
}

body.has-solid-header-start .wp-block-template-part:has(> .site-header-block.is-mode-transparent-until-scroll.has-overlap-first-section) > .site-header-block.is-mode-transparent-until-scroll {
  left: auto;
  position: relative;
  right: auto;
  top: auto;
}

body.has-solid-header-start .site-header-block.is-mode-static-transparent,
body.has-solid-header-start .site-header-block.is-mode-transparent-until-scroll:not(.is-scrolled) {
  background: var(--site-header-scrolled-background, var(--site-header-background, var(--wp--preset--color--base, #fff))) !important;
  background-color: var(--site-header-scrolled-background, var(--site-header-background, var(--wp--preset--color--base, #fff))) !important;
  color: var(--site-header-scrolled-color, var(--site-header-color, inherit)) !important;
}

body.has-transparent-header-start .wp-block-template-part:has(> .site-header-block.is-mode-static-solid) {
  position: static;
  top: auto;
  z-index: 1000;
}

body.has-transparent-header-start .wp-block-template-part:has(> .site-header-block.is-mode-static-solid) > .site-header-block.is-mode-static-solid {
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1000;
}

body.has-transparent-header-start .wp-block-template-part:has(> .site-header-block.is-mode-sticky-solid) {
  position: static;
  top: auto;
  z-index: 1000;
}

body.has-transparent-header-start .wp-block-template-part:has(> .site-header-block.is-mode-sticky-solid) > .site-header-block.is-mode-sticky-solid {
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 1000;
}

body.admin-bar.has-transparent-header-start .wp-block-template-part:has(> .site-header-block.is-mode-sticky-solid) > .site-header-block.is-mode-sticky-solid {
  top: var(--wp-admin--admin-bar--height, 32px);
}

body.has-transparent-header-start .site-header-block.is-mode-static-solid,
body.has-transparent-header-start .site-header-block.is-mode-sticky-solid:not(.is-scrolled) {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--site-header-color, inherit) !important;
}

body.has-transparent-header-start .site-header-block.is-mode-static-solid > *,
body.has-transparent-header-start .site-header-block.is-mode-sticky-solid:not(.is-scrolled) > * {
  background: transparent !important;
  background-color: transparent !important;
}

.site-header-block .wp-block-navigation {
  font-family: inherit;
  text-decoration: none;
  color: inherit;
  gap: var(--nav-gap, 1.5rem);
}

.site-header-block .wp-block-navigation a {
  text-decoration: none;
}

.site-header-block .wp-block-navigation .wp-block-paragraph {
  margin: 0;
}

.site-header-block .wp-block-navigation .wp-block-paragraph a {
  text-decoration: none;
}

.site-header-block .wp-block-navigation .wp-block-navigation-item__content {
  font-family: inherit;
  text-decoration: none;
  color: inherit;
  display: inline;
  white-space: nowrap;
}

.site-header-block .wp-block-navigation .wp-block-navigation__container {
  padding: 0;
  gap: inherit;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  z-index: auto !important;
  margin: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  width: auto !important;
  max-width: none !important;
}

.site-header-block .wp-block-navigation .wp-block-spacer {
  flex-grow: 1;
  height: 0 !important;
  min-height: 0 !important;
}

.site-header-block .wp-block-navigation .wp-block-search {
  flex-shrink: 0;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
  display: flex;
  align-items: center;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open.is-menu-open) {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container-content {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  overflow: visible;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container-content > * {
  flex-shrink: 0;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
  flex-shrink: 1;
  min-width: 0;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container-open {
  background: transparent;
  border: none;
  color: inherit;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open {
  background: var(--mobile-nav-background, #1a1a1a);
  color: var(--mobile-nav-text, #ffffff);
  position: fixed !important;
  inset: 0 !important;
  margin: 0 !important;
  width: auto !important;
  min-width: 0;
  max-width: none !important;
  height: 100vh !important;
  height: 100dvh !important;
  padding: var(--mobile-nav-padding, 1.5rem);
  box-sizing: border-box;
  overflow: auto;
  z-index: 100000;
  --navigation-layout-justification-setting: center;
  --navigation-layout-justify: center;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
  position: relative;
  min-height: 100%;
  margin-top: 0 !important;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
  position: absolute;
  top: 0;
  right: 0;
  left: auto !important;
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  font-size: var(--mobile-nav-font-size, 1.5rem);
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  gap: var(--mobile-nav-gap, 1.5rem);
}

.site-header-block .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  flex-direction: column;
  align-items: center;
  gap: var(--mobile-nav-gap, 1.5rem);
}

/* Collapse to the mobile overlay menu at tablet widths instead of core's
   hardcoded 600px, so nav items never wrap to a second row at mid-size
   viewports. Overrides core's min-width: 600px show/hide rules. */
@media (max-width: 1024px) {
  .site-header-block .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex !important;
  }

  .site-header-block .wp-block-navigation .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-header-block {
    transition: none;
  }
}

@media print {
  .site-header-block {
    position: static !important;
  }
}
