.js-main-image {
  opacity: 0;
  width: 100%;
  height: auto;
  transition: opacity 1.6s ease-in-out, transform 0.3s ease;
  transform-origin: center center;
  display: block;
}

.js-main-image.loaded {
  opacity: 1;
}

.product-cover {
  position: relative;
  width: 500px;
  height: auto;
  overflow: hidden;
}

/* Jemnější hover zoom (desktop only) */
@media (min-width: 769px) {
  .product-cover:hover .js-main-image {
    transform: scale(1.2); /* uprav podle pocitu 1.15–1.3 */
    cursor: zoom-in;
  }
}