.wpw-home-hero-motion {
	position: relative;
	height: calc(100svh + var(--wpw-home-hero-scroll-distance));
	width: 100%;
}

.wpw-home-hero-legacy {
	display: none !important;
}

/* Elementor popups, including the site menu, must sit above the animated logo. */
body .elementor-popup-modal,
body .dialog-widget {
	z-index: 100000 !important;
}

/* Keep the homepage header above the hero/banner from the first viewport. */
body.home .elementor-location-header {
	position: relative;
	z-index: 1000;
}

body.home .elementor-location-header .elementor-element-1FJOauL {
	position: relative;
	z-index: 1000;
}

.wpw-home-hero-motion__stage {
	position: sticky;
	top: 0;
	height: 100svh;
	overflow: hidden;
	background: #fff;
}

.wpw-home-hero-motion__background,
.wpw-home-hero-motion__full,
.wpw-home-hero-motion__seed,
.wpw-home-hero-motion__overlay {
	position: absolute;
	inset: 0;
}

.wpw-home-hero-motion__background {
	z-index: 1;
}

.wpw-home-hero-motion__full,
.wpw-home-hero-motion__seed {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	will-change: opacity, transform;
}

.wpw-home-hero-motion__full {
	opacity: 0;
}

.wpw-home-hero-motion__seed {
	/* Keep the brand R at its fixed 100:56 proportion at every viewport size. */
	inset: auto;
	top: 50%;
	left: 50%;
	width: max(100vw, calc(100svh * 100 / 56));
	aspect-ratio: 100 / 56;
	height: auto;
	transform: translate(-50%, -50%) scale(0.42);
	transform-origin: center;
	-webkit-mask-image: url("home-hero-r-mask.svg");
	-webkit-mask-position: center;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-image: url("home-hero-r-mask.svg");
	mask-position: center;
	mask-repeat: no-repeat;
	mask-size: 100% 100%;
}

.wpw-home-hero-motion__overlay {
	z-index: 2;
	pointer-events: none;
	color: #111;
}

.wpw-home-hero-motion__title {
	position: fixed;
	top: 20%;
	left: 50%;
	z-index: 10001;
	pointer-events: none;
	margin: 0;
	width: min(74vw, 1420px);
	height: auto;
	transform: translateX(-50%);
	will-change: top, left, width, opacity;
}

.wpw-home-hero-motion__subtitle {
	position: absolute;
	/* 20% title offset + responsive logo height + 80px spacing. */
	top: calc(20% + clamp(196px, 13.64vw, 262px) + 80px);
	right: 13%;
	margin: 0;
	font-size: 24px;
	font-weight: 600;
}

.wpw-home-hero-motion__center-line {
	position: absolute;
	bottom: 0;
	left: 50%;
	height: 36%;
	border-left: 1px solid #111;
}

.wpw-home-hero-motion__scale {
	position: absolute;
	bottom: 6.5%;
	left: 14%;
	width: 148px;
	height: 36px;
	overflow: visible;
	fill: #111;
	stroke: #111;
	stroke-width: 1;
}

.wpw-home-hero-motion__scale text {
	fill: #111;
	stroke: none;
	font-family: DINPro, sans-serif;
	font-size: 12px;
}

.wpw-home-hero-motion__scroll {
	position: absolute;
	right: 7%;
	bottom: 7%;
	width: 92px;
	aspect-ratio: 1;
	--wpw-scroll-rotation: 0deg;
}

.wpw-home-hero-motion__scroll-ring,
.wpw-home-hero-motion__scroll-arrow {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter: brightness(0);
}

.wpw-home-hero-motion__scroll-ring {
	transform: rotate(var(--wpw-scroll-rotation));
	transform-origin: center;
	will-change: transform;
	-webkit-mask-image: radial-gradient(circle at center, transparent 0 36%, #000 39% 100%);
	mask-image: radial-gradient(circle at center, transparent 0 36%, #000 39% 100%);
}

.wpw-home-hero-motion__scroll-arrow {
	-webkit-mask-image: radial-gradient(circle at center, #000 0 40%, transparent 43% 100%);
	mask-image: radial-gradient(circle at center, #000 0 40%, transparent 43% 100%);
}

/* Homepage header stays transparent, then slides away after the RANGE lock-up when scrolling down. */
body.home .elementor-location-header,
body.home .elementor-location-header .elementor-element-1FJOauL,
body.home .elementor-location-header .elementor-element-1FJOauL:not(.elementor-motion-effects-element-type-background),
body.home .elementor-location-header .elementor-element-1FJOauL > .elementor-motion-effects-container > .elementor-motion-effects-layer {
	background-color: transparent !important;
}

body.home .elementor-location-header .elementor-element-1FJOauL {
	transition: transform 320ms cubic-bezier(0.22, 0.61, 0.36, 1), background-color 180ms ease;
	will-change: transform;
}


body.home .elementor-location-header.wpw-home-hero-header-hidden .elementor-element-1FJOauL {
	transform: translateY(calc(-100% - 8px)) !important;
}

@media (max-width: 767px) {
	/* Keep the global header transparent and on top of the mobile hero. */
	body.home .elementor-location-header {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		width: 100%;
	}

	.wpw-home-hero-motion {
		--wpw-mobile-hero-info-height: 160px;
		z-index: 10;
		height: calc(100svh + var(--wpw-mobile-logo-scroll-distance)) !important;
		max-height: none;
		min-height: 0;
		background-color: #fff !important;
		overflow: visible !important;
		contain: none;
		isolation: isolate;
	}

	.wpw-home-hero-motion__stage {
		position: sticky !important;
		top: 0;
		z-index: 1;
		height: 100vh !important;
		max-height: 100vh !important;
		background-color: #fff !important;
		overflow: hidden !important;
		contain: paint;
		isolation: isolate;
	}

	.wpw-home-hero-motion__background,
	.wpw-home-hero-motion__overlay {
		height: 100% !important;
		max-height: 100% !important;
		overflow: hidden;
	}

	.wpw-home-hero-motion__background {
		background-color: #fff !important;
	}

	.wpw-home-hero-motion__full {
		inset: 0 0 auto;
		height: calc(100% - var(--wpw-mobile-hero-info-height));
		opacity: 1;
		background-position: center center;
	}

	.wpw-home-hero-motion__seed {
		display: none;
	}

	.wpw-home-hero-motion__title {
		display: block;
		position: fixed;
		top: 20%;
		left: 50%;
		z-index: 10001;
		width: 86vw;
		transform: translateX(-50%);
		pointer-events: none;
	}

	.wpw-home-hero-motion__subtitle {
		top: calc(27% + 30px);
		right: 7%;
		width: 63%;
		transform: none;
		font-size: 15px;
		font-weight: 800;
		line-height: 1.4;
		text-align: right;
	}

	.wpw-home-hero-motion__center-line {
		display: block;
		top: auto;
		bottom: 0;
		height: 50%;
		border-left-width: 0.5px;
	}

	.wpw-home-hero-motion__scale {
		display: block;
		bottom: 24px;
		left: 7%;
		width: 100px;
		height: auto;
	}

	.wpw-home-hero-motion__scale text {
		font-size: 10px;
	}

	.wpw-home-hero-motion__scroll {
		display: block;
		right: 7%;
		bottom: 16px;
		width: 128px;
	}
}

/* Homepage life cards: reveal the brand blue from bottom to top on hover. */
body.home .elementor-element-hZTpNLi,
body.home .elementor-element-y6rVe53 {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

body.home .elementor-element-hZTpNLi:hover,
body.home .elementor-element-y6rVe53:hover {
	background-color: transparent !important;
}

body.home .elementor-element-hZTpNLi::before,
body.home .elementor-element-y6rVe53::before {
	opacity: 0 !important;
}

body.home .elementor-element-hZTpNLi::after,
body.home .elementor-element-y6rVe53::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: var(--e-global-color-primary, #045CB4);
	transform: translateY(100%);
	transform-origin: bottom;
	transition: transform 560ms cubic-bezier(0.22, 0.61, 0.36, 1);
	pointer-events: none;
}

body.home .elementor-element-hZTpNLi:hover::after,
body.home .elementor-element-y6rVe53:hover::after {
	transform: translateY(0);
}

body.home .elementor-element-hZTpNLi > *,
body.home .elementor-element-y6rVe53 > * {
	position: relative !important;
	z-index: 2 !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* Preserve the original item spacing. JS extends each repeated group instead of stretching the gaps. */
body.home .wpw-contact-marquee__group {
	justify-content: flex-start !important;
	gap: 88px !important;
	min-width: 0 !important;
	padding: 0 88px 0 0 !important;
	box-sizing: content-box;
}

@media (max-width: 767px) {
	body.home .wpw-contact-marquee__group {
		gap: 42px !important;
		padding: 0 42px 0 0 !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wpw-home-hero-motion__full {
		opacity: 1;
	}

	.wpw-home-hero-motion__seed {
		display: none;
	}

	body.home .elementor-element-hZTpNLi::after,
	body.home .elementor-element-y6rVe53::after {
		transition-duration: 0.01ms;
	}
}
