.product-media {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  background: #eee3d5;
}

.product-media-square {
  display: grid;
  place-items: center;
  width: 100%;
  background: #eee3d5;
}

.product-media-square img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.product-media-instagram {
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.product-media-instagram .instagram-media {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

.product-media.is-instagram-ready .product-media-square {
  position: absolute;
  inset: 0;
  visibility: hidden;
}

.product-media.is-instagram-ready .product-media-instagram {
  position: relative;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.inventory-product-media .product-media-square {
  aspect-ratio: 3 / 4;
}

.product-page-media .product-media-square {
  min-height: 360px;
  max-height: 720px;
  padding: .75rem;
}

.product-page-media .product-media-square img {
  height: min(72vh, 720px);
}

@media (max-width: 880px) {
  .product-page-media .product-media-square img {
    height: 55vh;
    min-height: 300px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .product-media-square,
  .product-media-instagram { transition: opacity .2s ease; }
}
