[data-sticky*='yes'],
[data-sticky*='fixed'] {
	position: fixed;
	z-index: 5;
	top: calc(
		var(--admin-bar, 0px) + var(--theme-frame-size, 0px) +
			var(--header-sticky-offset, 0px)
	);
	left: var(--theme-frame-size, 0px);
	right: calc(var(--theme-frame-size, 0px) + var(--scrollbar-width, 0px));
}

[data-sticky*='slide'] {
	&[data-sticky*='yes-start'] {
		transform: translateY(-100%);
	}

	&[data-sticky*='yes-end'] {
		transition: transform var(--header-sticky-animation-speed, 0.2s)
			cubic-bezier(0.455, 0.03, 0.515, 0.955);
	}

	&[data-sticky*='yes-hide-start'] {
		transform: none;
	}

	&[data-sticky*='yes-hide-end'] {
		transform: translateY(-100%);
		transition: transform var(--header-sticky-animation-speed, 0.2s)
			cubic-bezier(0.455, 0.03, 0.515, 0.955);
	}
}

[data-sticky*='fade'] {
	&[data-sticky*='yes-start'] {
		opacity: 0;
	}

	&[data-sticky*='yes-end'] {
		transition: opacity var(--header-sticky-animation-speed, 0.2s)
			cubic-bezier(0.455, 0.03, 0.515, 0.955);
	}

	&[data-sticky*='yes-hide-start'] {
		opacity: 1;
	}

	&[data-sticky*='yes-hide-end'] {
		opacity: 0;
		transition: opacity var(--header-sticky-animation-speed, 0.2s)
			cubic-bezier(0.455, 0.03, 0.515, 0.955);
	}
}

// sticky transitions
[data-sticky],
[data-sticky] [data-row],
[data-sticky] [data-row*='boxed'] > div {
	transition: box-shadow var(--header-sticky-animation-speed, 0.2s)
			cubic-bezier(0.455, 0.03, 0.515, 0.955),
		backdrop-filter var(--header-sticky-animation-speed, 0.2s)
			cubic-bezier(0.455, 0.03, 0.515, 0.955),
		background-color var(--header-sticky-animation-speed, 0.2s)
			cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

[data-sticky] {
	.ct-header-text,
	.site-description {
		transition: color 0.12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	}
}
