/* Set default values of CSS vars which are explicitly set in JavaScript (avoids visible CLS) */

/* Desktop */
:root {
	--top-menu-height: 80px; --promo-banner-height: 0px; --total-top-height: 80px;
}
:root:has(body .promo-banner) {
	--top-menu-height: 80px; --promo-banner-height: 54px; --total-top-height: 134px;
}

@media screen and (max-width: 1024px) {
	/* Tablet */
	:root {
		--top-menu-height: 120px; --promo-banner-height: 0px; --total-top-height: 120px;
	}
	:root:has(body .promo-banner) {
		--top-menu-height: 120px; --promo-banner-height: 54px; --total-top-height: 174px;
	}
}

@media screen and (max-width: 768px) {
	/* Mobile */
	:root {
		--top-menu-height: 80px; --promo-banner-height: 0px; --total-top-height: 80px;
	}
	:root:has(body .promo-banner) {
		--top-menu-height: 80px; --promo-banner-height: 64px; --total-top-height: 144px;
	}
}

/* Disable wp-admin bar's added margin-top since we're taking care of it ourselves. */
html:has(body.admin-bar, #wpadminbar) {
	margin-top: 0 !important;
}

body {
	padding-top: var(--total-top-height) !important;
	overflow-x: hidden;
}

@media screen and (max-width: 781px) {
	.reverse-column{
		flex-direction: column-reverse !important;
	}
}
