/* Homepage Hero only. Other templates keep their existing Header presentation. */
body:has(.bf-home [data-home-journey]) .site-header {
  --bf-header-height: clamp(60px, 4.2vw, 64px);
  position: fixed;
  inset: var(--bf-header-admin-offset, 0px) 0 auto;
  width: 100%;
  box-sizing: border-box;
  z-index: 100;
  padding-inline: clamp(16px, 2.2vw, 40px);
  border: 0;
  background: transparent;
  box-shadow: none;
  transition: background-color 160ms ease-out;
}

body.admin-bar:has(.bf-home [data-home-journey]) .site-header {
  --bf-header-admin-offset: 32px;
}

body:has(.bf-home [data-home-journey]) .site-header__inner {
  width: 100%;
  max-width: none;
  min-height: var(--bf-header-height);
  margin-inline: 0;
  gap: clamp(12px, 1.6vw, 24px);
}

/* Keep the existing brand wording and logo; increase their presence, not the
   height occupied by the overlaid Header. */
body:has(.bf-home [data-home-journey]) .site-header .site-brand {
  font-size: 15px;
  letter-spacing: .065em;
}

body:has(.bf-home [data-home-journey]) .site-header .site-identity {
  gap: 10px;
}

body:has(.bf-home [data-home-journey]) .site-header .wp-block-site-logo :is(img, .custom-logo-link) {
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  font-size: 15px;
  transition: transform 160ms ease-out, opacity 160ms ease-out;
}

@media (min-width: 1181px) {
  body:has(.bf-home [data-home-journey]) .site-header .primary-navigation {
    font-size: 13px;
    letter-spacing: .065em;
  }

  body:has(.bf-home [data-home-journey]) .site-header .wp-block-navigation__container {
    column-gap: clamp(16px, 1.4vw, 20px);
    flex-wrap: nowrap;
  }

  body:has(.bf-home [data-home-journey]) .site-header .has-child > .wp-block-navigation__submenu-container {
    /* Stay below the parent; move only as far as a viewport edge requires. */
    transform: translateX(var(--bf-submenu-edge-shift, 0px));
  }

  body:has(.bf-home [data-home-journey]) .site-header .wp-block-navigation__container > .wp-block-navigation-item > a > .wp-block-navigation-item__label {
    display: inline-block;
    opacity: .82;
    transform-origin: center;
    transition: transform 160ms ease-out, opacity 160ms ease-out;
  }

  body:has(.bf-home [data-home-journey]) .site-header .wp-block-navigation__container > .wp-block-navigation-item > a:is(:hover, :focus-visible) > .wp-block-navigation-item__label {
    opacity: 1;
    transform: translateY(-2px) scale(1.025);
  }
}

@media (min-width: 1400px) {
  body:has(.bf-home [data-home-journey]) .site-header .site-brand {
    font-size: clamp(17px, 1.15vw, 19px);
  }

  body:has(.bf-home [data-home-journey]) .site-header .wp-block-site-logo :is(img, .custom-logo-link) {
    width: 42px;
    height: 42px;
    font-size: 17px;
  }

  body:has(.bf-home [data-home-journey]) .site-header .primary-navigation {
    font-size: clamp(14px, 1vw, 16px);
  }

  body:has(.bf-home [data-home-journey]) .site-header .wp-block-navigation__container {
    column-gap: clamp(28px, 2vw, 36px);
  }
}

/* Navigation never disappears: only the background changes. Native drawers and
   submenus retain their own solid surfaces, focus handling and stacking. */
body:has(.bf-home [data-home-journey]) .site-header:is(
  :focus-within,
  :has(.wp-block-navigation__responsive-container.is-menu-open),
  :has(.wp-block-navigation-submenu__toggle[aria-expanded="true"]),
  [data-bf-hero-header="solid"]
) {
  background: var(--wp--preset--color--canvas, #f5f5f2);
}

@media (hover: hover) and (pointer: fine) {
  body:has(.bf-home [data-home-journey]) .site-header:hover {
    background: var(--wp--preset--color--canvas, #f5f5f2);
  }

  body:has(.bf-home [data-home-journey]) .site-header .site-brand a {
    display: inline-block;
    transition: transform 160ms ease-out, opacity 160ms ease-out;
  }

  body:has(.bf-home [data-home-journey]) .site-header .site-brand a:is(:hover, :focus-visible),
  body:has(.bf-home [data-home-journey]) .site-header .custom-logo-link:is(:hover, :focus-visible) {
    opacity: 1;
    transform: translateY(-1px);
  }
}

@media (max-width: 1180px) {
  body:has(.bf-home [data-home-journey]) .site-header {
    --bf-header-height: 56px;
    background: rgb(245 245 242 / 88%);
  }

  body:has(.bf-home [data-home-journey]) .site-header .primary-navigation {
    margin-inline-start: auto;
  }

  body:has(.bf-home [data-home-journey]) .site-header .wp-block-navigation__responsive-container.is-menu-open {
    /* Override the native overlay's white surface, not its dialog behavior. */
    background-color: var(--wp--preset--color--canvas, #f5f5f2) !important;
  }
}

@media (max-width: 782px) {
  body.admin-bar:has(.bf-home [data-home-journey]) .site-header {
    --bf-header-admin-offset: 46px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body:has(.bf-home [data-home-journey]) .site-header {
    transition: none;
  }

  body:has(.bf-home [data-home-journey]) .site-header :is(.wp-block-navigation-item__label, .site-brand a, .custom-logo-link) {
    transition: none !important;
    transform: none !important;
  }
}
