/* Sticky Module
 *
 * Reusable sticky behavior. Apply class `nou-sticky` to any element.
 * JS adds `.is-stuck` when element is pinned, `.is-hidden` on scroll-down.
 *
 * Usage:
 *   - Header: body.has-sticky-header header { position: sticky }
 *   - Any element: add class `nou-sticky` in editor
 */

/* Fix: ensure WordPress wrapper doesn't block sticky with overflow */
.has-sticky-header .wp-site-blocks {
	overflow: visible;
}

.has-sticky-header .wp-site-blocks > header.wp-block-template-part,
.has-sticky-header .wp-site-blocks > .wp-block-template-part[role="banner"] {
	position: sticky;
	top: 0;
	z-index: 999;
}

/* Base: sticky positioning */
.has-sticky-header header.wp-block-template-part,
.has-sticky-header .wp-block-template-part[role="banner"],
.nou-sticky {
	position: sticky;
	top: 0;
	z-index: 999;
	transition: transform 0.3s ease, box-shadow 0.3s ease, backdrop-filter 0.3s ease;
}

/* Stuck state: shadow + blur */
.has-sticky-header header.wp-block-template-part.is-stuck,
.has-sticky-header .wp-block-template-part[role="banner"].is-stuck,
.nou-sticky.is-stuck {
	box-shadow: var(--nou-sticky-shadow, 0 2px 20px rgba(0, 0, 0, 0.06));
	backdrop-filter: var(--nou-sticky-blur, blur(12px));
	-webkit-backdrop-filter: var(--nou-sticky-blur, blur(12px));
}

/* Hidden state: slide up (for hide-on-scroll) */
.has-sticky-header header.wp-block-template-part.is-hidden,
.has-sticky-header .wp-block-template-part[role="banner"].is-hidden,
.nou-sticky.is-hidden {
	transform: translateY(-100%);
}

/* Shrink: reduce inner padding when stuck */
.has-sticky-header.nou-sticky--shrink header.wp-block-template-part.is-stuck > .wp-block-group,
.nou-sticky.nou-sticky--shrink.is-stuck > .wp-block-group {
	padding-top: 14px;
	padding-bottom: 14px;
	transition: padding 0.3s ease;
}