/* Base frontend styles for Trehoa Elements widgets. */

/* Typography system scoped to Trehoa Elements widgets only. */
@font-face {
	font-family: "Beautique Display";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src:
		url("../fonts/BeautiqueDisplay-Regular.woff2") format("woff2"),
		url("../fonts/BeautiqueDisplay-Regular.woff") format("woff");
}

@font-face {
	font-family: "Beautique Display";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src:
		url("../fonts/BeautiqueDisplay-Bold.woff2") format("woff2"),
		url("../fonts/BeautiqueDisplay-Bold.woff") format("woff");
}

@font-face {
	font-family: "Inter";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/Inter-4.1/web/InterVariable.woff2") format("woff2");
}

:is([class^="trehoa-"], [class*=" trehoa-"]) {
	--trehoa-font-heading: "Beautique Display", serif;
	--trehoa-font-body: "Inter", sans-serif;
}

:is([class^="trehoa-"], [class*=" trehoa-"]),
:is([class^="trehoa-"], [class*=" trehoa-"]) :is(
	p,
	span,
	small,
	label,
	li,
	dt,
	dd,
	blockquote,
	cite,
	a,
	button,
	input,
	textarea,
	select,
	option,
	legend,
	figcaption,
	.elementor-button,
	.elementor-icon-list-text,
	.elementor-widget-text-editor,
	.ff-el-form-control,
	.ff-btn-submit,
	.trehoa-header__nav-link,
	.trehoa-header__nav-toggle,
	.trehoa-header__menu-toggle,
	.trehoa-header__cta,
	.trehoa-header__description,
	.trehoa-header__mobile-link,
	.trehoa-mobile-offcanvas-menu__link,
	.trehoa-mobile-offcanvas-menu__toggle,
	.trehoa-mobile-offcanvas-menu__close,
	.trehoa-mobile-offcanvas-menu__description
) {
	font-family: var(--trehoa-font-body);
}

:is([class^="trehoa-"], [class*=" trehoa-"]) :is(
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	.elementor-heading-title,
	.trehoa-services-overview__title,
	.trehoa-services-overview__card-title,
	.trehoa-service-pricing-card__heading,
	.trehoa-service-faq__heading,
	.trehoa-service-highlights__heading,
	.trehoa-service-single-result__heading,
	.trehoa-service-detail-hero__title,
	.trehoa-real-results__heading,
	.trehoa-aura-standard__heading,
	.trehoa-global-form__title,
	.trehoa-sticky-service-form__title,
	.trehoa-hero-section__title
) {
	font-family: var(--trehoa-font-heading);
}

.elementor-location-header .elementor-sticky__spacer[data-trehoa-spacer-state="inactive"] {
	display: none !important;
	height: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	visibility: hidden !important;
}