/* mod_iovhero — galleria full-width, altezza dettata dall'aspect-ratio (immagini mai deformate).
   Slide = figlio diretto di .iov-hero: <img> oppure <picture> (variante mobile). */
.iov-hero{position:relative;width:100%;overflow:hidden;line-height:0}
.iov-hero > img,
.iov-hero > picture{display:block;width:100%}
.iov-hero > picture > img{display:block;width:100%;height:auto}
.iov-hero > img{height:auto}

/* dalla seconda slide in poi: sovrapposte alla prima, che resta a dettare l'altezza del contenitore */
.iov-hero > :not(:first-child){position:absolute;inset:0;opacity:0}
.iov-hero > img:not(:first-child),
.iov-hero > picture:not(:first-child) > img{height:100%;object-fit:cover}

/* il fade si attiva solo quando il JS trova piu' di una slide */
.iov-hero.iov-multi > img,
.iov-hero.iov-multi > picture{transition-property:opacity;transition-timing-function:ease-in-out}
.iov-hero.iov-multi > :first-child{opacity:0}
.iov-hero.iov-multi > .iov-on{opacity:1}

.iov-hero.iov-swipe{touch-action:pan-y}

@media (prefers-reduced-motion:reduce){
	.iov-hero.iov-multi > img,
	.iov-hero.iov-multi > picture{transition-duration:0s !important}
}
