.product-catalog .product-hero-image figcaption a { text-decoration: underline; }

.product-image-open { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.product-image-open:focus-visible { outline: 3px solid #168feb; outline-offset: -4px; }
.product-image-hint { position: absolute; right: 16px; bottom: 16px; padding: 9px 14px; border-radius: 20px; background: #0e2e5d; color: white; font-size: 13px; font-weight: 700; }
.product-image-dialog { width: min(1200px, 94vw); max-width: 94vw; max-height: 94dvh; margin: auto; padding: 0; border: 1px solid #cfe0f1; border-radius: 18px; background: #f4f8fd; color: #0e2e5d; box-shadow: 0 24px 80px #06182c66; }
.product-image-dialog::backdrop { background: #06182ccc; backdrop-filter: blur(5px); }
.product-image-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; background: white; border-bottom: 1px solid #cfe0f1; }
.product-image-dialog h2 { margin: 0; font-size: 18px; line-height: 1.3; }
.product-image-dialog header > div { display: flex; gap: 8px; flex-shrink: 0; }
.product-image-dialog button { padding: 10px 14px; border: 1px solid #cfe0f1; border-radius: 9px; background: white; color: #0e2e5d; cursor: pointer; font-weight: 700; }
.product-image-dialog button:focus-visible, .product-image-stage:focus-visible { outline: 3px solid #168feb; outline-offset: -3px; }
.product-image-stage { height: 75dvh; overflow: auto; overscroll-behavior: contain; }
.product-image-stage img { display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; }
.product-image-stage.is-zoomed img { width: 200%; height: 200%; }
@media (max-width: 600px) {
  .product-image-dialog header { flex-wrap: wrap; padding: 12px; }
  .product-image-dialog h2 { font-size: 16px; }
  .product-image-stage { height: 65dvh; }
}

/* Preserve the entire uploaded artwork, including portrait screenshots. */
.product-catalog .product-hero-image--uploaded {
  background: #f4f8fd;
  width: 100%;
}
.product-catalog .product-hero-image--uploaded img {
  width: 100%;
  height: clamp(300px, 42vw, 580px);
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  padding: 16px;
  box-sizing: border-box;
}