/* Site chrome: always above page media; difference = contrast vs whatever is behind. */
.wx-header {
	position: fixed;
	z-index: 10040 !important;
	mix-blend-mode: difference;
	color: #fff !important;
	pointer-events: none;
	isolation: auto;
}

/*
 * Elementor kit paints links/buttons dark/primary — kills difference over dark
 * heroes and turns menu chrome into solid black pills. Force white blend source.
 */
.wx-header a,
.wx-header button,
.wx-header .wx-logo,
.wx-header .wx-menu-btn,
.wx-header .wx-iconbtn {
	pointer-events: auto;
	color: #fff !important;
	-webkit-text-fill-color: #fff;
	background: transparent !important;
	background-color: transparent !important;
	border-color: currentColor !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

.wx-header .wx-burger {
	border-color: #fff !important;
}

/* Fullscreen menu: always dark + white type (independent of site theme). */
.wx-menu {
	z-index: 10060 !important;
	mix-blend-mode: normal;
	isolation: isolate;
}

.wx-menu__panel {
	background: #0f0f0f !important;
	color: #fff !important;
}

.wx-menu__panel a,
.wx-menu__panel button,
.wx-menu__panel .wx-kicker,
.wx-menu__panel .wx-menu-btn,
.wx-menu__panel .wx-menu__link {
	color: #fff !important;
	-webkit-text-fill-color: #fff;
	background: transparent !important;
	background-color: transparent !important;
	border-color: rgba(255, 255, 255, 0.35) !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

.wx-menu__aside {
	border-top-color: rgba(255, 255, 255, 0.18) !important;
}

.wx-menu__aside a {
	color: rgba(255, 255, 255, 0.82) !important;
}

/* Dark top band so the inverted header stays readable over video heroes. */
.wx-svchero2::after,
.wx-svchero::after,
.wx-bloghero::after {
	background: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.82) 0%,
		rgba(0, 0, 0, 0.34) 28%,
		rgba(0, 0, 0, 0.16) 48%,
		rgba(0, 0, 0, 0.74) 100%
	);
}


/* Elementor kit paints h1/a dark — force white type on dark service heroes. */
body.wx-view .wx-svchero2 h1,
body.wx-view .wx-svchero2 h1 .wx-line,
body.wx-view .wx-svchero2__crumb,
body.wx-view .wx-svchero2__crumb a,
body.wx-view .wx-svchero2 .wx-linebtn,
body.wx-view .wx-svchero2 .wx-linebtn span,
body.wx-view .wx-svchero h1,
body.wx-view .wx-svchero h1 .wx-line,
body.wx-view .wx-svchero__crumb,
body.wx-view .wx-svchero__crumb a,
body.wx-view .wx-svchero__scroll,
body.wx-view .wx-bloghero h1,
body.wx-view .wx-bloghero h1 .wx-line {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

body.wx-view .wx-svchero2 .wx-kicker,
body.wx-view .wx-svchero .wx-kicker {
	color: rgba(255, 255, 255, 0.72) !important;
	-webkit-text-fill-color: rgba(255, 255, 255, 0.72) !important;
}

body.wx-view .wx-svchero2__lead {
	color: rgba(255, 255, 255, 0.82) !important;
	-webkit-text-fill-color: rgba(255, 255, 255, 0.82) !important;
}
