/* =========================
   Benedetta smart header
   Two-header pattern
   ========================= */

/* 0) Kill theme stickiness on the OUTER template-part (non-home pages) */
header.site-header.wp-block-template-part {
  position: static !important;
  top: auto !important;
  inset: auto !important;
  transform: none !important;
  z-index: auto !important;
}

/* 1) The REAL CMS header (#smart-header) – NOT sticky */
#smart-header {
  position: static !important;   /* no sticky/fixed */
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  z-index: auto !important;
  /* background is whatever you set in the editor (transparent on home, color elsewhere) */
}

/* 2) The black SCROLL header (runtime clone) */

/* Duplicate (black) header — slide IN on appear, fade OUT at top */
#smart-header-scroll{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 9998;
  background: var(--scroll-header-bg, var(--wp--preset--color--primary-accent));

  /* hidden baseline: off-canvas, fully opaque (we only fade at top) */
  transform: translateY(-100%);
  opacity: 1;

  transition: transform .28s ease, opacity .25s ease;
  pointer-events: none;
  will-change: transform, opacity;
}

/* visible while scrolled: slides down into place */
#smart-header-scroll.is-visible{
  transform: translateY(0);
  pointer-events: auto;
}

/* at the very top: fade out in place (no slide) */
#smart-header-scroll.is-visible.is-fading{
  opacity: 0;
  pointer-events: none;
}

/* 🔒 During fade, disable transform transitions so the post-fade reset doesn’t slide */
#smart-header-scroll.no-transform-transition{
  transition: opacity .25s ease !important;
}

/* admin bar offsets */
.admin-bar #smart-header-scroll{ top: 32px; }
@media (max-width: 782px){ .admin-bar #smart-header-scroll{ top: 46px; } }

@media (prefers-reduced-motion: reduce){
  #smart-header-scroll{ transition: transform .01s linear, opacity .01s linear; }
  #smart-header-scroll.no-transform-transition{ transition: opacity .01s linear !important; }
}

/* 3) Make sure the WP overlay menu is above BOTH headers */
.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-dialog[open] {
  position: fixed !important;
  inset: 0;
  z-index: 11000;
  height: 100dvh;
  max-height: none !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-dialog[open] .wp-block-navigation__responsive-container-content {
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/* Print safety */
@media print { #smart-header-scroll { display: none !important; } }