/* BuildKit Sticky Element Extension */

/*
 * position:fixed is applied and removed at runtime by sticky.js.
 * This file handles only visual transitions and scroll effects.
 *
 * We deliberately do NOT set position:sticky here — CSS sticky is bounded
 * by the parent's height, so a row inside a multi-row header would stop
 * sticking once the header scrolled off screen. The JS position:fixed
 * approach works correctly across any parent boundary.
 */

.bk-sticky-element {
	transition: box-shadow 0.3s ease;
	/* Prevent Elementor animation transforms from creating a new containing
	   block that would trap position:fixed children. */
	will-change: auto !important;
}

/* Shadow appears once the element is actively stuck */
.bk-sticky-element.bk-sticky-active {
	box-shadow: 0 2px 16px rgba( 0, 0, 0, 0.10 );
}

/* ---- Shrink on scroll ---- */

/* Flex-container variant (Elementor 3.6+ containers) */
.bk-sticky-element.bk-sticky-shrink > .e-con-inner {
	transition: padding-top 0.3s ease, padding-bottom 0.3s ease;
}
.bk-sticky-element.bk-sticky-shrink.bk-scrolled > .e-con-inner {
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

/* Legacy section variant */
.bk-sticky-element.bk-sticky-shrink > .elementor-container {
	transition: padding-top 0.3s ease, padding-bottom 0.3s ease;
}
.bk-sticky-element.bk-sticky-shrink.bk-scrolled > .elementor-container {
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

/* Elementor sections carry their own padding */
.bk-sticky-element.bk-sticky-shrink.elementor-section {
	transition: padding-top 0.3s ease, padding-bottom 0.3s ease, box-shadow 0.3s ease;
}
.bk-sticky-element.bk-sticky-shrink.bk-scrolled.elementor-section {
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

/* ---- Transparent until scrolled ---- */

.bk-sticky-element.bk-sticky-transparent:not( .bk-scrolled ) {
	background-color: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
}