/* WEB-1017 header + hero refinement, v3.1 — 2026-10-26.
   v3.1 (Quality CHANGES REQUESTED D1, 2026-10-26 ~11:12): at scrollY 0 the
   sticky header was visible but dead to mouse/touch — Brizy's
   .brz-section__header--animated-closed class sets pointer-events:none
   on the fixed wrapper in its hidden state, and v3 forced visibility
   without restoring pointer-events. One line added below:
   pointer-events:auto !important on the fixed-wrapper rule.
   Founder direction (2026-10-26 ~10:35, settled design preference):
   ONE true sticky header per site — not two separately styled headers.
   The Brizy animated section carries TWO header contents: an in-flow
   top row (logo xbLQ96efuV7M / nav nq8Mn84lN1mg / phone xwxKggL1ig6D)
   that scrolls away, and a fixed wrapper (.brz-section__header--animated)
   holding the sticky-item div (yVwi1Nxcf8Fc; logo rzz61JVkds2G /
   nav jNPsXVDRrgBG / phone wNuDKRCK6nJr) that Brizy slides in on scroll.
   v3 makes Brizy's own sticky header the SINGLE header: the fixed wrapper
   is forced always visible (Brizy's JS hides it at the top via inline
   opacity/visibility/transform; !important beats those), the in-flow row
   is hidden, and body padding-top equals the sticky header's height so
   the hero is never covered and there is no layout shift.
   Only the sticky header is styled. The animated header is not styled
   at all — it is hidden, not restyled.
   Brand tokens (Brizy globals): cream #FAF6EF, hairline #E8DDCB,
   dark bronze #3B281C, gold #D6A75C, gold hover #C89A4E.
   NOTE on the hero: the visible homepage hero is a single composite image
   (assets/img/94ca35db0b30-...png) with its headline and dark gradient baked
   in — there is no CSS overlay on it, so the image itself was lightened
   (shadows lift, left side only; original kept in header-hero-refine/).
   The 1pwpq4o gradient below covers the separate hero section wherever it
   renders (it carries a real 0.7 overlay).
   Sticky header height (measured 2026-10-26, scrolled): 171px desktop,
   149px mobile. Body padding-top matches it. */

/* ---------- the single sticky header: always visible ---------- */
.brz .brz-section__header-type--animated .brz-section__header--animated {
  /* Brizy's own fixed scroll header. Forced always visible so it is the
     one header at the top and on scroll; !important beats Brizy's JS,
     which hides it at the top via inline opacity/visibility/transform.
     z-index 2000: Brizy's content sections carry z-index 1055 on their
     menu-item divs, which otherwise paint OVER a z-index 100 header.
     pointer-events:auto: Brizy's .brz-section__header--animated-closed
     class sets pointer-events:none on this wrapper in its hidden state
     (at the top / small scrolls); v3 forced visibility but the header
     stayed dead to mouse/touch at scrollY 0 (Quality D1). auto restores
     hit-testing on the wrapper and, by inheritance, its subtree. */
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2000 !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  pointer-events: auto !important;
}

/* ---------- the in-flow top row + its bg wrapper: hidden (the duplicate header) ---------- */
.brz .brz-section__header-type--animated [data-brz-custom-id="nPKgEHf4FhGE"],
.brz .brz-section__header-type--animated [data-brz-custom-id="aFQdKAjkHvoX"] {
  display: none !important;
}

/* ---------- the header section itself: collapse to zero height ----------
   With the in-flow row and its bg wrapper hidden, the section is a 45px
   dark band (its own bg) between the fixed header and the hero. Collapse
   it so the hero starts directly below the fixed header. The fixed
   wrapper is position:fixed (viewport-relative), so it is unaffected. */
.brz .brz-section__header-type--animated {
  height: 0 !important;
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  border: 0 !important;
}

/* ---------- body padding-top = sticky header height (no overlap, no shift) ---------- */
body {
  padding-top: 171px !important;
}

/* ---------- sticky header background: cream, hairline + soft shadow ---------- */
.brz .brz-section__header-sticky-item[data-brz-custom-id="yVwi1Nxcf8Fc"] > .brz-bg > .brz-bg-color {
  background-color: #FAF6EF;
}
.brz .brz-section__header-sticky-item[data-brz-custom-id="yVwi1Nxcf8Fc"] {
  border-bottom: 1px solid #E8DDCB;
  box-shadow: 0 2px 12px rgba(59, 40, 28, 0.08);
}

/* ---------- logo: larger, on the wrapper div ----------
   The custom-id sits on the DIV.brz-image wrapper (not the <picture>);
   the wrapper is display:flex + overflow:hidden and was clipping the img.
   Size wrapper + picture + img explicitly to the transparent logo's own
   aspect (480x280 = 1.714) so the full lockup — emblem + both wordmark
   lines — fits. */
.brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] {
  width: 240px !important;
  height: 140px !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
}
.brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] .brz-picture {
  width: 240px !important;
  height: 140px !important;
}
.brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] .brz-img {
  width: 240px !important;
  height: 140px !important;
  max-width: none !important;
}

/* ---------- nav: dark bronze on cream ---------- */
.brz .brz-section__header-sticky-item .brz-menu__ul > .brz-menu__item > a.brz-a {
  color: #3B281C;
  padding: 8px 14px;
  letter-spacing: 0.02em;
}
.brz .brz-section__header-sticky-item .brz-menu__ul > .brz-menu__item > a.brz-a:hover,
.brz .brz-section__header-sticky-item .brz-menu__ul > .brz-menu__item.brz-menu__item--current > a.brz-a {
  /* Brizy's own current-page colour outranks the base nav rule; the
     !important keeps the current link dark bronze like the rest. */
  color: #3B281C !important;
  border-bottom: 2px solid #D6A75C;
}

/* ---------- phone CTA: gold bg, dark bronze text ---------- */
.brz .brz-section__header [data-brz-custom-id="wNuDKRCK6nJr"].brz-btn {
  background-color: #D6A75C;
  border-color: #D6A75C;
  color: #3B281C;
}
.brz .brz-section__header [data-brz-custom-id="wNuDKRCK6nJr"].brz-btn .brz-span {
  color: #3B281C;
}
.brz .brz-section__header [data-brz-custom-id="wNuDKRCK6nJr"].brz-btn:hover {
  background-color: #C89A4E;
  border-color: #C89A4E;
  color: #3B281C;
}
.brz .brz-section__header [data-brz-custom-id="wNuDKRCK6nJr"].brz-btn:hover .brz-span {
  color: #3B281C;
}

/* ---------- hamburger: dark bronze on cream ---------- */
.brz .brz-section__header-sticky-item .brz-mm-menu__icon {
  color: #3B281C;
}

/* ---------- homepage hero overlay (1pwpq4o section): lighter gradient ---------- */
.brz .brz-css-1pwpq4o > .brz-bg > .brz-bg-color {
  background: linear-gradient(90deg, rgba(38, 38, 38, 0.55) 0%, rgba(38, 38, 38, 0.38) 55%, rgba(38, 38, 38, 0.18) 100%);
}

/* ---------- tablet: logo 200px (200x117) ---------- */
@media (max-width: 1020px) {
  .brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] {
    width: 200px !important;
    height: 117px !important;
  }
  .brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] .brz-picture {
    width: 200px !important;
    height: 117px !important;
  }
  .brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] .brz-img {
    width: 200px !important;
    height: 117px !important;
  }
}

/* ---------- mobile: one row — logo left, phone + hamburger right ---------- */
@media (max-width: 767px) {
  body {
    padding-top: 149px !important;
  }
  .brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] {
    width: 150px !important;
    height: 88px !important;
  }
  .brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] .brz-picture {
    width: 150px !important;
    height: 88px !important;
  }
  .brz .brz-section__header-sticky-item [data-brz-custom-id="rzz61JVkds2G"] .brz-img {
    width: 150px !important;
    height: 88px !important;
  }
  .brz .brz-section__header [data-brz-custom-id="siR5BM43v1uM"] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
  }
  /* logo column takes the free space */
  .brz .brz-section__header [data-brz-custom-id="pRjoE0uoEARP"] {
    flex: 1 1 auto !important;
    width: auto !important;
  }
  /* nav list hidden on mobile — the hamburger (which lives in the nav
     column) stays visible, so the column itself must NOT be hidden. */
  .brz .brz-section__header [data-brz-custom-id="jNPsXVDRrgBG"] .brz-menu__ul {
    display: none !important;
  }
  .brz .brz-section__header [data-brz-custom-id="jNPsXVDRrgBG"] {
    flex: 0 0 auto !important;
    width: auto !important;
  }
  /* phone column stays visible, compact */
  .brz .brz-section__header [data-brz-custom-id="hB3YcD7ThO35"] {
    flex: 0 0 auto !important;
    width: auto !important;
  }
  .brz .brz-section__header [data-brz-custom-id="wNuDKRCK6nJr"].brz-btn {
    padding: 8px 14px;
    font-size: 14px;
  }
}
