/* IAO Slider Vertical Images */
.iao-vert { position: relative; width: 100%; background: transparent; overflow: hidden; }
.iao-vert__grid { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); gap: var(--gap, 16px); }
.iao-vert__col { display: flex; flex-direction: column; gap: var(--gap, 16px); overflow: hidden; position: relative; }
.iao-vert__track { display:flex; flex-direction:column; gap: var(--gap, 16px); will-change: transform; backface-visibility: hidden; }
.iao-vert__col:nth-child(even){ padding-top: calc(var(--img-h, 360px) / 2); }
.iao-vert__item { border-radius: 14px; overflow: hidden; }
.iao-vert__img { display: block; width: 280px; height: 360px; object-fit: cover; }

/* Animazione verticale continua */
.iao-vert__col { --h: calc(100%); }
.iao-vert__track { animation: iao-vert-scroll var(--speed, 12s) linear infinite; animation-delay: var(--offset, -6s); }
.iao-vert[data-play="0"] .iao-vert__track { animation-play-state: paused; }

@keyframes iao-vert-scroll {
  0% { transform: translate3d(0,0,0); }
  100% { transform: translate3d(0, calc(-50% - var(--gap, 0px)), 0); }
}

/* Play/Pause */
.iao-vert__toggle { position: absolute; width: 44px; height: 44px; border-radius: 50%; border: 1px solid transparent; color: inherit; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:20; }
.iao-vert__icon { display:none; position: relative; z-index: 2; align-items:center; justify-content:center; }
.iao-vert__icon i { display:block; font-family: "Font Awesome 5 Free", "Font Awesome 5 Pro", Arial, sans-serif; font-weight: 900; font-style: normal; line-height: 1; color: currentColor; }
.iao-vert__icon svg { width: 18px; height: 18px; fill: currentColor; display:block; }
.iao-vert .iao-vert__icon--pause { display:flex; }
.iao-vert[data-play="0"] .iao-vert__icon--pause { display:none; }
.iao-vert[data-play="0"] .iao-vert__icon--play { display:flex; }

/* Button position helpers */
.iao-vert--btn-h-left .iao-vert__toggle { left: 10px; }
.iao-vert--btn-h-center .iao-vert__toggle { left: 50%; transform: translateX(-50%); }
.iao-vert--btn-h-right .iao-vert__toggle { right: 10px; }
.iao-vert--btn-v-top .iao-vert__toggle { top: 10px; }
.iao-vert--btn-v-middle .iao-vert__toggle { top: 50%; transform: translate(-50%, -50%); }
.iao-vert--btn-v-bottom .iao-vert__toggle { bottom: 10px; }

/* Fade top/bottom controllabile */
.iao-vert::before, .iao-vert::after{ content:""; position:absolute; left:0; right:0; height: var(--fade-h, 60px); pointer-events:none; z-index:5; }
.iao-vert::before{ top:0; background: linear-gradient(to bottom, var(--fade-color, rgba(0,0,0,.6)), transparent); }
.iao-vert::after{ bottom:0; background: linear-gradient(to top, var(--fade-color, rgba(0,0,0,.6)), transparent); }