/**
 * SPPB 6 markup shims for the Cevon FR styles in custom.css
 */
.fr-slideshow-1.sp-slider,
.fr-slideshow-1 .sp-slider,
.fr-slideshow-1 .sppb-addon-sp-slider {
	height: calc(100vh - (var(--header-height, 80px) + 5.6rem)) !important;
	min-height: 520px;
	position: relative;
}

.fr-slideshow-1 .sp-item,
.fr-slideshow-1 .sp-item.active {
	height: 100%;
	min-height: inherit;
}

.fr-slideshow-1 .sp-background {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
}

.fr-slideshow-1 .sp-item .sp-background:after {
	content: "";
	position: absolute;
	inset: 0;
}

/* Some titles render as inline-block, which would pull the kicker line
   next to the heading instead of above it. */
.fr-section-slogan {
	display: block;
}

/*
 * SPPB 6 paints .sp-slider-btn-text with the default magenta (#f102f2).
 * Cevon styles the outer .fr-button-1 / .fr-button-2 pills; the inner
 * span must stay transparent so the beige/brown look from custom.css wins.
 */
.fr-slideshow-1 .sppb-sp-slider-button .sp-slider-btn-text {
	background: transparent !important;
	padding: 0 !important;
	border-radius: inherit;
	font-size: inherit;
	color: inherit;
}

/* custom.css makes the arrow strip position: relative, so the 50px inset SPPB
   ships turns into a shift to the right and the next arrow leaves the slide.
   Cancel the shift and keep the percentage margin off the arrows. */
.fr-slideshow-1 .sp-nav-control {
	left: 0 !important;
	width: calc(100% - 5rem) !important;
}

.fr-slideshow-1 .sp-nav-control .nav-control {
	margin: 0;
}

@media (max-width: 1399px) {
	.fr-slideshow-1.sp-slider,
	.fr-slideshow-1 .sp-slider,
	.fr-slideshow-1 .sppb-addon-sp-slider {
		height: 100vh !important;
	}
}

@media (max-width: 991px) {
	.fr-slideshow-1.sp-slider,
	.fr-slideshow-1 .sp-slider,
	.fr-slideshow-1 .sppb-addon-sp-slider {
		height: calc(100vh - var(--header-height, 80px)) !important;
	}
}
