/* Home hero: product-screen strip (replaces Floppy Ball). No card chrome. */

body.home .vl-home-hero--with-screens {
  align-items: center;
}

body.home .vl-home-hero--with-screens .vl-home-hero__panel {
  min-width: 0;
  background: none;
  border: none;
  box-shadow: none;
}

.vl-home-screens {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  box-shadow: none;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
  -webkit-user-select: none;
}

.vl-home-screens.is-dragging {
  cursor: grabbing;
}

.vl-home-screens__viewport {
  overflow: hidden;
  width: 100%;
  background: none;
  border: none;
  -webkit-mask-image: linear-gradient(
    to right,
    transparent,
    #000 10%,
    #000 90%,
    transparent
  );
  mask-image: linear-gradient(
    to right,
    transparent,
    #000 10%,
    #000 90%,
    transparent
  );
}

.vl-home-screens__track {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: clamp(0.85rem, 2.2vw, 1.6rem);
  width: max-content;
  margin: 0;
  padding: 0.15rem 0;
  will-change: transform;
}

.vl-home-screens__item {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  box-shadow: none;
}

.vl-home-screens__item img {
  display: block;
  height: clamp(14.5rem, 38vh, 22rem);
  width: auto;
  max-height: 100%;
  border: none;
  background: none;
  box-shadow: none;
  pointer-events: none;
  -webkit-user-drag: none;
  user-select: none;
}

@media (max-width: 1023px) {
  body.home .vl-home-hero--with-screens {
    align-items: start;
  }

  .vl-home-screens__item img {
    height: clamp(12.75rem, 48vw, 18.5rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .vl-home-screens__track {
    will-change: auto;
  }
}
