/**
 * Site banners — overlay and carousel.
 */

/* Elementor sets `.elementor img { height: auto }` — restore hero crop height. */
.elementor .sh-banner .hero-photo__img,
.elementor .sh-banner__carousel .hero-photo__img,
.sh-banner__carousel .hero-photo__img {
	width: 100%;
	height: min(72vh, 640px) !important;
	max-height: min(72vh, 640px);
	object-fit: cover;
	display: block;
}

.sh-banner--split .sh-banner__carousel {
	position: relative;
	overflow: hidden;
	max-height: min(72vh, 640px);
}

.sh-banner--split .sh-banner__carousel .carousel-inner,
.sh-banner--split .sh-banner__carousel .carousel-item {
	min-height: min(72vh, 640px);
	max-height: min(72vh, 640px);
}

.sh-banner--split .hero-intro {
	position: relative;
	z-index: 2;
	margin-top: clamp(-48px, -4vw, -24px);
}
.sh-banner--overlay .sh-banner__media,
.sh-banner--overlay .carousel-item {
	position: relative;
	overflow: hidden;
}

.sh-banner--overlay .sh-banner__media > img,
.sh-banner--overlay .carousel-item > .sh-banner__media > img,
.sh-banner--overlay .carousel-item > img {
	line-height: 0;
}

.elementor .sh-banner--overlay .sh-banner__media img,
.elementor .sh-banner--overlay .carousel-item img,
.sh-banner--overlay .sh-banner__media img,
.sh-banner--overlay .carousel-item img {
	width: 100%;
	height: min(72vh, 640px) !important;
	max-height: min(72vh, 640px);
	object-fit: cover;
	display: block;
}

.sh-banner__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(
		180deg,
		rgba(26, 43, 78, 0.15) 0%,
		rgba(26, 43, 78, 0.45) 55%,
		rgba(26, 43, 78, 0.55) 100%
	);
	pointer-events: none;
}

.sh-banner__overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	padding: 48px 24px 96px;
	text-align: center;
}

.sh-banner--overlay-left .sh-banner__overlay {
	justify-content: flex-start;
	text-align: left;
}

.sh-banner--overlay-right .sh-banner__overlay {
	justify-content: flex-end;
	text-align: right;
}

.sh-banner--overlay-center .sh-banner__overlay {
	justify-content: center;
}

.sh-banner__overlay-inner {
	align-self: center;
	max-width: 720px;
	color: var(--sh-white);
	line-height: 1.4;
}

.sh-banner--split .sh-banner__carousel .carousel-inner,
.sh-banner--split .sh-banner__carousel .carousel-item {
	min-height: min(72vh, 640px);
	max-height: min(72vh, 640px);
}

/* Overlay carousel (homepage default) — explicit height for Elementor editor + live site. */
.sh-banner--overlay.sh-banner--carousel .sh-banner__carousel,
.sh-banner--overlay.sh-banner--carousel .carousel-inner,
.sh-banner--overlay.sh-banner--carousel .carousel-item,
.sh-banner--overlay.sh-banner--carousel .sh-banner__media {
	min-height: min(72vh, 640px);
}

.elementor .sh-banner--overlay.sh-banner--carousel .sh-banner__carousel,
.elementor .sh-banner--overlay.sh-banner--carousel .carousel-inner,
.elementor .sh-banner--overlay.sh-banner--carousel .carousel-item {
	min-height: min(72vh, 640px);
}

.sh-banner--split .sh-banner__carousel .carousel-indicators {
	z-index: 4;
	margin-bottom: 24px;
}

.sh-banner--overlay .hero-lead,
.sh-banner--overlay .hero-lead.section-label,
.elementor .sh-banner--overlay .hero-lead,
.elementor .sh-banner--overlay .hero-lead.section-label {
	color: var(--sh-white) !important;
}

.sh-banner--overlay .section-label,
.elementor .sh-banner--overlay .section-label {
	color: var(--sh-lime) !important;
	border-color: var(--sh-white) !important;
}

.sh-banner--overlay .hero-display,
.sh-banner--overlay .sh-banner__headline,
.elementor .sh-banner--overlay .hero-display,
.elementor .sh-banner--overlay .sh-banner__headline {
	color: var(--sh-lime) !important;
	text-shadow: 0 2px 24px rgba(0, 0, 0, 0.35);
}

.sh-banner--overlay .hero-sub,
.elementor .sh-banner--overlay .hero-sub {
	color: rgba(255, 255, 255, 0.95) !important;
}

.sh-banner--split .hero-lead,
.sh-banner--split .section-label {
	color: var(--sh-white);
}

.sh-banner--split .hero-display {
	color: var(--sh-navy);
}

.sh-banner--split .hero-sub {
	color: var(--sh-lime);
}

.sh-banner--overlay .btn-outline-sh-lime {
	border-color: var(--sh-lime);
	color: var(--sh-lime);
}

.sh-banner--overlay .btn-outline-sh-lime:hover {
	background: var(--sh-lime);
	color: var(--sh-navy);
	border-color: var(--sh-lime);
}

.sh-banner--overlay .btn-outline-sh-olive {
	border-color: var(--sh-lime);
	color: var(--sh-lime);
}

.sh-banner--overlay .btn-outline-sh-olive:hover {
	background: var(--sh-lime);
	color: var(--sh-navy);
	border-color: var(--sh-lime);
}

.sh-banner--carousel .carousel-indicators [data-bs-target] {
	background-color: rgba(162, 192, 55, 0.45);
}

.sh-banner--carousel .carousel-indicators .active {
	background-color: var(--sh-lime);
}

.sh-banner--carousel .carousel-control-prev,
.sh-banner--carousel .carousel-control-next {
	z-index: 4;
	width: 8%;
}

.sh-banner--carousel .carousel-indicators {
	z-index: 4;
	margin-bottom: 88px;
}

.sh-banner--split .sh-banner__carousel .carousel-control-prev,
.sh-banner--split .sh-banner__carousel .carousel-control-next {
	filter: invert(1);
}

.sh-banner--split .hero-photo.sh-banner__carousel {
	position: relative;
}

/* Parallax wrappers — scroll on wrap, Ken Burns scale on img */
.sh-hero-parallax-wrap {
	overflow: hidden;
}

.sh-banner__media .sh-hero-parallax-wrap,
.carousel-item .sh-hero-parallax-wrap,
.about-banner .sh-hero-parallax-wrap,
.sh-service-banner .sh-hero-parallax-wrap {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.hero-photo:not(.sh-banner__carousel) .sh-hero-parallax-wrap {
	display: block;
	width: 100%;
	height: min(72vh, 640px);
}

.sh-hero-parallax-wrap img {
	width: 100%;
	height: 115%;
	max-height: none;
	object-fit: cover;
	display: block;
	will-change: transform;
}

.sh-banner--split .carousel-item,
.sh-banner--carousel .carousel-item {
	position: relative;
	overflow: hidden;
}

/* Service pages — compact home-style overlay hero */
.sh-service-hero .sh-banner__media,
.sh-service-hero .sh-banner__media--static {
	position: relative;
	overflow: hidden;
}

.elementor .sh-service-hero .sh-banner__media img,
.sh-service-hero .sh-banner__media img {
	width: 100%;
	height: min(42vh, 380px) !important;
	max-height: min(42vh, 380px);
	object-fit: cover;
	display: block;
}

.sh-service-hero .sh-banner__overlay {
	padding: 24px 20px 40px;
}

/* Service hub banner — fixed height; parallax wrap must not expand to full image */
.sh-service-banner {
	height: min(42vh, 380px);
	min-height: min(42vh, 380px);
}

.elementor .sh-service-banner__img,
.sh-service-banner__img {
	width: 100%;
	height: min(42vh, 380px) !important;
	max-height: min(42vh, 380px);
	object-fit: cover;
	display: block;
}

.sh-service-banner .sh-hero-parallax-wrap img {
	height: 115% !important;
	max-height: none !important;
}

/* About + marketing image heroes — same compact height as service pages */
.about-banner {
	height: min(42vh, 380px);
	min-height: min(42vh, 380px);
}

.elementor .about-banner__img,
.about-banner__img {
	width: 100%;
	height: min(42vh, 380px) !important;
	max-height: min(42vh, 380px);
	object-fit: cover;
	display: block;
}

.about-banner .sh-hero-parallax-wrap img {
	height: 115% !important;
	max-height: none !important;
}

.sh-service-hero .hero-display,
.sh-service-hero .sh-banner__headline {
	font-size: clamp(2rem, 6vw, 3.4rem);
}

/* Carousel overlay — staggered text entrance (1s between elements) */
@keyframes sh-banner-fade-up {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

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

.sh-banner--carousel .sh-banner__overlay-inner > .hero-lead,
.sh-banner--carousel .sh-banner__overlay-inner > .hero-display,
.sh-banner--carousel .sh-banner__overlay-inner > .hero-sub,
.sh-banner--carousel .sh-banner__overlay-inner > .sh-banner__btns {
	opacity: 0;
}

.sh-banner--carousel .sh-banner__overlay-inner.is-animating > .hero-lead {
	animation: sh-banner-fade-up 0.7s ease forwards;
	animation-delay: 0s;
}

.sh-banner--carousel .sh-banner__overlay-inner.is-animating > .hero-display {
	animation: sh-banner-fade-up 0.7s ease forwards;
	animation-delay: 1s;
}

.sh-banner--carousel .sh-banner__overlay-inner.is-animating > .hero-sub {
	animation: sh-banner-fade-up 0.7s ease forwards;
	animation-delay: 2s;
}

.sh-banner--carousel .sh-banner__overlay-inner.is-animating > .sh-banner__btns {
	animation: sh-banner-fade-up 0.7s ease forwards;
	animation-delay: 3s;
}

@media (prefers-reduced-motion: reduce) {
	.sh-banner--carousel .sh-banner__overlay-inner > .hero-lead,
	.sh-banner--carousel .sh-banner__overlay-inner > .hero-display,
	.sh-banner--carousel .sh-banner__overlay-inner > .hero-sub,
	.sh-banner--carousel .sh-banner__overlay-inner > .sh-banner__btns {
		opacity: 1;
		animation: none !important;
		transform: none;
	}
}

@media (max-width: 768px) {
	.sh-banner__overlay {
		padding: 32px 16px 80px;
	}

	.sh-banner--overlay .hero-display {
		font-size: clamp(2rem, 10vw, 2.8rem);
	}
}
