/* Flowaivo Header & Footer Builder — frontend styles */

.fhf-header--rendered,
.fhf-footer--rendered {
	width: 100%;
}

.fhf-header--sticky {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 999;
}

/* Keep the sticky header clear of the WordPress admin bar. */
.admin-bar .fhf-header--sticky {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar .fhf-header--sticky {
		top: 46px;
	}
}

/* Blank canvas used while previewing a template on its own. */
body.fhf-canvas {
	margin: 0;
	padding: 0;
}

body.fhf-canvas .fhf-header--sticky {
	position: relative;
	top: auto;
}

/* Respect reduced-motion preferences for anything animated inside a
   header or footer template. */
@media (prefers-reduced-motion: reduce) {
	.fhf-header--rendered *,
	.fhf-footer--rendered * {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Frosted-glass header, applied by the "Verre dépoli" starter template via
   the fhf-glass class. Needs a translucent background to have anything to
   blur, which the template already sets. */
.fhf-glass {
	-webkit-backdrop-filter: blur(16px) saturate(140%);
	backdrop-filter: blur(16px) saturate(140%);
}