/* ==========================================================================
   Header hide-on-scroll — companion to assets/js/header-scroll.js, which
   toggles body.header-hidden. Loaded on the homepage and the results
   archive in every environment (see kl_header_scroll_assets()).

   Two header implementations are covered:
     - staging / production: the Elementor sticky header
       (header.elementor-location-header .elementor-sticky--active)
     - local: the child theme's own sticky .kl-navbar
   Whichever is absent leaves its rules inert.
   ========================================================================== */

/* ── Elementor sticky header (staging / production) ── */
header.elementor-location-header .elementor-sticky--active {
	transition: transform .35s cubic-bezier(.22,.61,.36,1);
	will-change: transform;
}

body.header-hidden header.elementor-location-header .elementor-sticky--active {
	transform: translateY(-100%);
}

/* keep it visible while the mobile menu is open */
body.header-hidden .elementor-menu-toggle.elementor-active ~ *,
body.elementor-menu-open header.elementor-location-header .elementor-sticky--active {
	transform: none;
}

/* ── Local child-theme navbar ── */
.kl-navbar {
	transition: transform .35s cubic-bezier(.22,.61,.36,1);
	will-change: transform;
}

body.header-hidden .kl-navbar {
	transform: translateY(-100%);
}

body.kl-menu-open .kl-navbar {
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	header.elementor-location-header .elementor-sticky--active,
	.kl-navbar {
		transition: none;
	}
}