/**
 * Dante Galli – Slider.
 *
 * La griglia si sceglie con le container query sulla larghezza dello slider, non della finestra:
 * da 1024 px griglia d, da 778 n, da 480 t, sotto m (valori misurati su Revolution Slider).
 */
.dg-slider {
	container-type: inline-size;
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.dg-slider__stage {
	--height: var(--m-height);
	position: relative;
	height: var(--height);
	overflow: hidden;
}

.dg-slider__layer {
	--x: var(--m-x);
	--y: var(--m-y);
	--w: var(--m-w);
	--h: var(--m-h);
	--hb: var(--m-hb);
	--ht: var(--m-ht);
	--vb: var(--m-vb);
	--vt: var(--m-vt);
	--ta: var(--m-ta);
	--fs: var(--m-fs, inherit);
	--lh: var(--m-lh, inherit);
	--ls: var(--m-ls, normal);
}

@container (min-width: 480px) {
	.dg-slider__stage {
		--height: var(--t-height);
	}

	.dg-slider__layer {
		--x: var(--t-x);
		--y: var(--t-y);
		--w: var(--t-w);
		--h: var(--t-h);
		--hb: var(--t-hb);
		--ht: var(--t-ht);
		--vb: var(--t-vb);
		--vt: var(--t-vt);
		--ta: var(--t-ta);
		--fs: var(--t-fs, inherit);
		--lh: var(--t-lh, inherit);
		--ls: var(--t-ls, normal);
	}
}

@container (min-width: 778px) {
	.dg-slider__stage {
		--height: var(--n-height);
	}

	.dg-slider__layer {
		--x: var(--n-x);
		--y: var(--n-y);
		--w: var(--n-w);
		--h: var(--n-h);
		--hb: var(--n-hb);
		--ht: var(--n-ht);
		--vb: var(--n-vb);
		--vt: var(--n-vt);
		--ta: var(--n-ta);
		--fs: var(--n-fs, inherit);
		--lh: var(--n-lh, inherit);
		--ls: var(--n-ls, normal);
	}
}

@container (min-width: 1024px) {
	.dg-slider__stage {
		--height: var(--d-height);
	}

	.dg-slider__layer {
		--x: var(--d-x);
		--y: var(--d-y);
		--w: var(--d-w);
		--h: var(--d-h);
		--hb: var(--d-hb);
		--ht: var(--d-ht);
		--vb: var(--d-vb);
		--vt: var(--d-vt);
		--ta: var(--d-ta);
		--fs: var(--d-fs, inherit);
		--lh: var(--d-lh, inherit);
		--ls: var(--d-ls, normal);
	}
}

.dg-slider__slides,
.dg-slider__slide,
.dg-slider__bg-wrap,
.dg-slider__bg,
.dg-slider__overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

/* Swiper non sposta nulla (virtualTranslate): le slide restano impilate e la dissolvenza è in dg-slider.js. */
.dg-slider__slide {
	overflow: hidden;
	width: 100% !important;
	visibility: hidden;
	z-index: 1;
}

.dg-slider__slide.is-active {
	visibility: visible;
}

.dg-slider__slide.is-entering {
	z-index: 3;
}

.dg-slider__slide.is-leaving {
	z-index: 2;
}

.dg-slider__bg-wrap {
	transform: translate3d(0, var(--dg-parallax, 0px), 0);
	backface-visibility: hidden;
}

.dg-slider__bg {
	overflow: hidden;
}

.dg-slider__bg-img {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.dg-slider__overlay .dg-slider__anim {
	width: 100%;
	height: 100%;
}

.dg-slider__layer {
	position: absolute;
	top: calc(var(--vb) + var(--y));
	left: calc(var(--hb) + var(--x));
	width: var(--w);
	height: var(--h);
	text-align: var(--ta);
	transform: translate(var(--ht), var(--vt));
}

.dg-slider__layer--button {
	line-height: 22px;
}

.dg-slider .dg-slider__text {
	margin: 0;
	padding: 0;
	font-size: var(--fs);
	font-style: normal;
	line-height: var(--lh);
	letter-spacing: var(--ls);
	text-transform: none;
	white-space: normal;
}

/* Revolution Slider divide il titolo in singole lettere, che perdono crenatura e legature. */
.dg-slider .dg-slider__layer--title .dg-slider__text {
	font-kerning: none;
	font-variant-ligatures: none;
}

.dg-slider__line {
	display: block;
}

.dg-slider__word {
	display: inline-block;
}

.dg-slider__image {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
}

.dg-slider__layer--image .dg-slider__anim {
	height: 100%;
}

/* Stato iniziale con JS attivo: compare tutto con le animazioni di dg-slider.js. */
.dg-js .dg-slider__bg,
.dg-js .dg-slider__anim {
	opacity: 0;
}

.dg-js .dg-slider.is-static .dg-slider__bg,
.dg-js .dg-slider.is-static .dg-slider__anim {
	opacity: 1;
}

/* Frecce e pallini (skin "uranus"). */
.dg-slider__arrow {
	position: absolute;
	top: 50%;
	z-index: 30;
	display: block;
	width: 50px;
	height: 50px;
	margin: -25px 0 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: #000;
	color: #fff;
	line-height: 50px;
	text-align: center;
	cursor: pointer;
}

.dg-slider__arrow--prev {
	left: 30px;
}

.dg-slider__arrow--next {
	right: 30px;
}

.dg-slider__arrow svg {
	display: block;
	margin: 5px auto;
	transition: opacity 0.3s;
}

.dg-slider__arrow:hover svg {
	opacity: 0.75;
}

.dg-slider__arrow:focus-visible,
.dg-slider__bullet:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

@container (max-width: 777.98px) {
	.dg-slider__arrow {
		display: none;
	}
}

.dg-slider__bullets {
	position: absolute;
	bottom: 20px;
	left: 0;
	z-index: 30;
	display: flex;
	justify-content: center;
	gap: 5px;
	width: 100%;
}

.dg-slider__bullet {
	position: relative;
	display: block;
	width: 15px;
	height: 15px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0);
	cursor: pointer;
	transition: box-shadow 0.3s;
}

.dg-slider__bullet::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.3);
	transition: background-color 0.3s, transform 0.3s;
}

.dg-slider__bullet:hover,
.dg-slider__bullet.is-current {
	box-shadow: 0 0 0 2px #fff;
}

.dg-slider__bullet:hover::before,
.dg-slider__bullet.is-current::before {
	background-color: #fff;
	transform: scale(0.4);
}
