.c-page-hero,
.c-page-hero.brxe-section {
	position: relative !important;
	isolation: isolate;
	overflow: hidden !important;

	width: 100% !important;
	max-width: none !important;
	min-height: clamp(28rem, 28vw, 42rem);

	margin: 0 !important;
	padding: 0 !important;

	display: block !important;

	background-position: center center !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
}


.c-page-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background: rgba(0, 0, 0, 0.28);
	pointer-events: none;
}


.c-page-hero__inner,
.c-page-hero__inner.brxe-div {
	position: absolute !important;
	inset: 0 !important;
	z-index: 3;

	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	min-height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	display: block !important;
}


.c-page-hero__breadcrumbs,
.c-page-hero__breadcrumbs.brxe-breadcrumbs {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	z-index: 5;

	width: fit-content !important;
	max-width: min(92vw, 90rem) !important;

	margin: 0 !important;
	padding: var(--space-xs) var(--space-xl) var(--space-xs) var(--space-l) !important;

	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 0.55rem !important;

	background: rgba(21, 57, 111, 0.88) !important;
	color: var(--light) !important;

	font-size: var(--text-s) !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;

	clip-path: polygon(
		0 0,
		100% 0,
		calc(100% - 2.4rem) 100%,
		0 100%
	);

	backdrop-filter: blur(4px);
}

.c-page-hero__breadcrumbs,
.c-page-hero__breadcrumbs span,
.c-page-hero__breadcrumbs li,
.c-page-hero__breadcrumbs .separator {
	color: rgba(255, 255, 255, 0.86) !important;
}

.c-page-hero__breadcrumbs a {
	color: var(--light) !important;
	text-decoration: none !important;
	transition: color 0.2s ease;
}

.c-page-hero__breadcrumbs a:hover,
.c-page-hero__breadcrumbs a:focus-visible {
	color: var(--secondary) !important;
	text-decoration: none !important;
}

.c-page-hero__breadcrumbs svg {
	width: 1em !important;
	height: 1em !important;
	color: currentColor !important;
}


.c-page-hero__title,
.c-page-hero__title.brxe-heading {
	position: absolute !important;
	left: 0 !important;
	bottom: 0 !important;
	top: auto !important;
	right: auto !important;
	z-index: 4;

	width: min(72rem, 70vw) !important;
	max-width: none !important;

	margin: 0 !important;
	padding: var(--space-m) var(--space-3xl) var(--space-m) var(--space-l) !important;

	background: rgba(21, 57, 111, 0.84);
	background: color-mix(in srgb, var(--primary) 84%, transparent);

	color: var(--light) !important;
	font-family: 'Roboto Slab', serif !important;
	font-size: var(--text-2xl) !important;
	font-weight: 700 !important;
	line-height: 1.1 !important;

	clip-path: polygon(
		0 0,
		100% 0,
		calc(100% - 7rem) 100%,
		0 100%
	);
}


.c-page-hero__slide,
.c-page-hero__slide.brxe-div {
	position: absolute !important;
	right: 0 !important;
	bottom: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background-repeat: no-repeat !important;
	background-position: right bottom !important;
	background-size: contain !important;

	pointer-events: none;

	opacity: 0;
	transform: translateX(4rem);
	animation-name: dms-hero-slide-in;
	animation-duration: 0.75s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}


.c-page-hero__slide--black {
	z-index: 1;

	width: min(72rem, 52vw) !important;
	height: min(17rem, 14vw) !important;

	background-image: url('/wp-content/uploads/2025/03/SlideGraphicBlack-1024x332.webp') !important;

	animation-delay: 0.1s;
}


.c-page-hero__slide--white {
	z-index: 2;

	width: min(62rem, 46vw) !important;
	height: min(17rem, 14vw) !important;

	background-image: url('/wp-content/uploads/2025/03/SlideGraphicWhite-1024x236.webp') !important;

	animation-delay: 0.35s;
}


@keyframes dms-hero-slide-in {
	from {
		opacity: 0;
		transform: translateX(4rem);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}


@media (prefers-reduced-motion: reduce) {
	.c-page-hero__slide,
	.c-page-hero__slide.brxe-div {
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}



@media (max-width: 767px) {
	.c-page-hero,
	.c-page-hero.brxe-section {
		min-height: 34rem;
		background-position: center center !important;
	}

	.c-page-hero__title,
	.c-page-hero__title.brxe-heading {
		top: var(--space-l) !important;
		bottom: auto !important;
		left: 0 !important;
		right: auto !important;

		width: min(100%, 92vw) !important;

		padding: var(--space-s) var(--space-xl) var(--space-s) var(--space-m) !important;

		font-size: var(--text-xl) !important;

		clip-path: polygon(
			0 0,
			100% 0,
			calc(100% - 4rem) 100%,
			0 100%
		);
	}

	.c-page-hero__breadcrumbs,
	.c-page-hero__breadcrumbs.brxe-breadcrumbs {
		top: calc(var(--space-l) + 6.4rem) !important;
		left: 0 !important;

		max-width: 94vw !important;

		padding: var(--space-xs) var(--space-l) var(--space-xs) var(--space-m) !important;
		font-size: var(--text-s) !important;

		clip-path: polygon(
			0 0,
			100% 0,
			calc(100% - 2rem) 100%,
			0 100%
		);
	}

	.c-page-hero__slide--black {
		width: 88vw !important;
		height: 12rem !important;
	}

	.c-page-hero__slide--white {
		width: 78vw !important;
		height: 12rem !important;
	}
}