.product-image,
.product-detail-image {
  overflow: hidden;
}

.product-image img,
.product-detail-image .product-packshot {
  --yn-product-image-rest-scale: 1;
  --yn-product-image-hover-scale: 1.065;
  transform: scale(var(--yn-product-image-rest-scale));
  transform-origin: center;
  transition:
    transform .5s cubic-bezier(.2, .7, .2, 1),
    filter .5s cubic-bezier(.2, .7, .2, 1),
    opacity .18s ease;
  will-change: transform;
}

.product-detail-image .product-packshot {
  --yn-product-image-hover-scale: 1.075;
}

.protein-shake-page .product-detail-image .product-packshot {
  --yn-product-image-rest-scale: 1.18;
  --yn-product-image-hover-scale: 1.25;
}

@media (hover: hover) and (pointer: fine) {
  .product-image:hover img,
  .product-image:focus-visible img,
  .product-detail-image:hover .product-packshot {
    transform: scale(var(--yn-product-image-hover-scale));
    filter: drop-shadow(0 24px 28px rgba(21, 21, 21, .14));
  }
}

@media (prefers-reduced-motion: reduce) {
  .product-image img,
  .product-detail-image .product-packshot,
  .product-image:hover img,
  .product-image:focus-visible img,
  .product-detail-image:hover .product-packshot {
    transform: scale(var(--yn-product-image-rest-scale));
    transition: opacity .18s ease;
  }
}