/* HUEMAN product image clarity tuning */
.product-visual img,
.main-image,
.thumb img,
.gallery-image {
  image-rendering: auto;
  -webkit-font-smoothing: antialiased;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  mix-blend-mode: normal !important;
  filter: none !important;
}

/* Product page back button: slightly larger and easier to tap. */
#backLink {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 8px;
  margin-left: -8px;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1;
  text-decoration: none;
}

/* Storefront product images. Keep opacity/transform overridable so the lightweight rotation animation can run. */
.product-visual img {
  width: min(88%, 720px) !important;
  max-width: 720px !important;
  max-height: 700px !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 1;
  transform: none;
}

.product-row.in .product-visual img,
.product-row:hover .product-visual img {
  opacity: 1;
  transform: none;
  filter: none !important;
}

/* Legacy single-image product view */
.main-image {
  width: min(90%, 720px) !important;
  height: auto !important;
  max-height: 76svh !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 1 !important;
  transform: none !important;
}

.visual-stage:hover .main-image {
  transform: none !important;
  filter: none !important;
}

.thumb img {
  object-fit: contain !important;
}

/* Scroll / swipe gallery: never enlarge the lifestyle image to fill the frame. */
.product-shot .gallery-image {
  object-fit: contain !important;
  object-position: center !important;
}

/* Keep model/lifestyle photos on the same light gallery surface as the rest of the product page. */
.model-shot {
  background: #f8f7f3 !important;
}

.model-shot .gallery-image {
  display: block !important;
  width: auto !important;
  max-width: min(100%, 900px) !important;
  height: auto !important;
  max-height: calc(100svh - 74px) !important;
  object-fit: contain !important;
  object-position: center !important;
  margin: auto !important;
}

@media (max-width: 980px) {
  .model-shot .gallery-image {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}

@media (max-width: 680px) {
  #backLink {
    min-height: 46px;
    padding: 11px 8px;
    font-size: 14px !important;
  }

  /* Avoid expensive entrance effects on iPhone while scrolling the collection. */
  .products .reveal,
  .products .reveal.in {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .product-visual {
    min-height: 470px !important;
    height: 470px !important;
  }

  .product-visual img {
    width: min(96%, 420px) !important;
    max-width: 420px !important;
    max-height: 450px !important;
  }

  .main-image {
    width: min(96%, 420px) !important;
    max-width: 420px !important;
    max-height: 60svh !important;
  }

  .model-shot .gallery-image {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 62svh !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}