/* Scroll-linked horizontal rows (see hscroll.js). Desktop only. */
@media (min-width: 768px) {
  html.iu-hs-on, html.iu-hs-on body { overflow-x: clip; }
  .mousescroll-carousel.iu-hs { position: relative; padding-top: 0 !important; padding-bottom: 0 !important; }
  .iu-hs .iu-hs-pin {
    position: sticky; top: var(--iu-hs-top, 0px); height: var(--iu-hs-h, 100vh);
    display: flex; flex-direction: column; overflow: hidden; padding: 28px 0 22px;
  }
  .iu-hs .iu-hs-pin > .container { flex: none; }
  .iu-hs .iu-hs-pin > .container h2 { margin-bottom: 8px !important; }
  .iu-hs .iu-hs-pin > .container h3 { margin-bottom: 18px !important; }
  .iu-hs .mousescroll-slider { flex: 1 1 auto; min-height: 0; }
  .iu-hs .swiper { height: 100%; overflow: visible; }
  .iu-hs .swiper-wrapper {
    display: flex; height: 100%; gap: 24px; will-change: transform;
    padding-left: max(24px, calc((100vw - 1140px) / 2)); padding-right: max(24px, calc((100vw - 1140px) / 2));
    box-sizing: content-box; width: max-content;
  }
  .iu-hs .swiper-slide {
    position: relative; flex: 0 0 auto; width: min(1140px, 78vw) !important; height: 100% !important; margin: 0 !important;
    overflow: hidden;
  }
  .iu-hs .swiper-slide > img { width: 100%; height: 100% !important; object-fit: cover; }
  .iu-hs .swiper-slide .carousel-content { max-height: calc(100% - 48px); overflow: auto; }
  .iu-hs-progress { position: absolute; left: max(24px, calc((100vw - 1140px) / 2)); right: max(24px, calc((100vw - 1140px) / 2)); bottom: 8px; height: 3px; background: rgba(255,255,255,.18); }
  .iu-hs-progress span { display: block; height: 100%; background: #62d3e8; transform-origin: left; transform: scaleX(0); }
}
