/* NEXT MED Compat: home slider. Mirrors the former Slider Revolution module 7 (carousel, 1200x675). */
.nm-slider {
	position: relative;
	width: 100%;
	background: #fff;
	overflow: hidden;
}

/* Before Splide mounts: same footprint as the mounted slider at each
   breakpoint (see inc/slider.php), first slide centred, no layout jump.
   The centring is a transform, not justify-content: Splide measures the
   slides against the list while mounting (before it sets is-initialized),
   and justify-content shifted the slides inside the list, so the first
   position came out about two slides off until the first autoplay move.
   A transform moves the list and its slides together and leaves that
   measurement exact; Splide's own inline transform replaces it. */
.nm-slider:not(.is-initialized) {
	--nm-w: min(1200px, 100vw);
	height: min(675px, 56.25vw);
}

@media (max-width: 1240px) {
	.nm-slider:not(.is-initialized) {
		--nm-w: min(1024px, 100vw);
		height: min(576px, 56.25vw);
	}
}

@media (max-width: 1024px) {
	.nm-slider:not(.is-initialized) {
		--nm-w: min(778px, 100vw);
		height: min(520px, 66.8vw);
	}
}

@media (max-width: 778px) {
	.nm-slider:not(.is-initialized) {
		--nm-w: 100vw;
		height: max(230px, 63.9vw);
	}
}

.nm-slider:not(.is-initialized) .splide__list {
	display: flex;
	height: 100%;
	transform: translateX(calc((100% - var(--nm-w)) / 2));
}

.nm-slider:not(.is-initialized) .splide__slide {
	flex: 0 0 var(--nm-w);
	height: 100%;
}

/* Bootstrap Italia adds padding to every .splide__track: not here. */
.nm-slider .splide__track {
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden;
}

.nm-slider .splide__list {
	margin: 0 !important;
	padding: 0 !important;
}

.nm-slider__slide {
	position: relative;
	overflow: hidden;
	margin: 0 !important;
	padding: 0 !important;
	opacity: .45;
	transition: opacity .35s ease-out;
}

.nm-slider__slide.is-active {
	opacity: 1;
}

.nm-slider__img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
}

.nm-slider__title {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 75%;
	padding: 10px 10px 20px 20px;
	background-color: rgba(255, 255, 255, .7);
	color: #000 !important;
	font-family: "Titillium Web", sans-serif;
	font-size: 38px;
	font-weight: 700;
	line-height: 42px;
	text-align: left;
	text-decoration: none !important;
	z-index: 2;
}

.nm-slider--rtl .nm-slider__title {
	left: auto;
	right: 0;
	padding: 10px 20px 20px 10px;
	text-align: right;
}

.nm-slider__title:hover,
.nm-slider__title:focus {
	text-decoration: underline !important;
}

.nm-slider__title:focus-visible {
	outline: 3px solid #0b3c8c;
	outline-offset: -3px;
}

/* Captions stay on every slide (the side ones are dimmed with the slide):
   no pop-in when a slide becomes active. */

/* Autoplay progress bar: 5px, white 50%, along the bottom (Slider Revolution progressBar defaults). */
.nm-slider__progress {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: transparent;
	z-index: 4;
	pointer-events: none;
}

.nm-slider__progress .splide__progress__bar {
	height: 5px;
	width: 0;
	background: rgba(255, 255, 255, .5);
	transition: none;
}

/* Arrows: round, translucent, 70px, 50px from the edges (Slider Revolution "zeus"). */
.nm-slider .splide__arrow {
	width: 70px;
	height: 70px;
	border-radius: 50%;
	background: rgba(0, 0, 0, .1);
	opacity: 1;
	z-index: 3;
}

.nm-slider .splide__arrow svg {
	width: 20px;
	height: 20px;
	fill: #fff;
}

.nm-slider .splide__arrow:hover,
.nm-slider .splide__arrow:focus-visible {
	background: rgba(0, 0, 0, .5);
}

.nm-slider .splide__arrow--prev {
	left: 50px;
}

.nm-slider .splide__arrow--next {
	right: 50px;
}

@media (max-width: 1240px) {
	.nm-slider__title {
		font-size: 32px;
		line-height: 35px;
		padding: 9px 9px 17px 17px;
	}
}

@media (max-width: 1024px) {
	.nm-slider__title {
		font-size: 24px;
		line-height: 26px;
		padding: 7px 7px 13px 13px;
	}
}

@media (max-width: 778px) {
	.nm-slider__slide {
		opacity: 1;
	}

	.nm-slider__title {
		width: 70%;
		font-size: 20px;
		line-height: 24px;
		font-weight: 600;
		padding: 5px 5px 5px 6px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nm-slider__slide {
		transition: none;
	}
}
