/* Reserve image geometry independently of supplier dimensions/loading. */
.product-image,
.related .product-image {
  aspect-ratio: 4 / 3;
  min-height: 0;
  padding: 0;
  background: #fff;
}
.product-image img {
  position: absolute;
  inset: 34px 18px 18px;
  width: calc(100% - 36px);
  height: calc(100% - 52px);
  object-fit: contain;
  object-position: center;
  mix-blend-mode: normal;
}
.product-image:hover img { transform: none; }
.product-image > span { z-index: 1; }
.related .product-image img {
  inset: 18px;
  height: calc(100% - 36px);
}
.product-visual {
  aspect-ratio: 4 / 3;
  min-height: 0;
  padding: 0;
  background: #fff;
  overflow: hidden;
}
.product-visual > img {
  position: absolute;
  inset: 28px 28px 48px;
  width: calc(100% - 56px);
  height: calc(100% - 76px);
  max-height: none;
  object-fit: contain;
  object-position: center;
  mix-blend-mode: normal;
}
.cart-row > img, .bundle-item img, .basket-item img {
  aspect-ratio: 1;
  height: auto;
  object-fit: contain;
  object-position: center;
  padding: 8px;
  background: #fff;
}
.bundle-item img { flex: 0 0 65px; }
.hero-art > img {
  height: 350px;
  max-height: none;
  object-fit: contain;
}
.business-hero img { height: 300px; object-fit: contain; }
/* Keep price/action rows aligned when model names have different lengths. */
.product, .related > article { display: flex; flex-direction: column; min-width: 0; }
.product-image { flex: 0 0 auto; }
.product-copy { display: flex; flex-direction: column; flex: 1; }
.product .buyrow { margin-top: auto; }
.related .actions { margin-top: auto; padding-top: 12px; }
@media (max-width: 760px) {
  .product-image img {
    inset: 28px 10px 10px;
    width: calc(100% - 20px);
    height: calc(100% - 38px);
  }
  .related .product-image img { inset: 10px; height: calc(100% - 20px); }
  .product-visual > img {
    inset: 20px 20px 44px;
    width: calc(100% - 40px);
    height: calc(100% - 64px);
  }
  .hero-art > img { height: 250px; }
  .business-hero img { height: 200px; }
}