/* Product galleries remain ordinary picture grids until product-gallery.js runs. */
.product-spec { margin: 1rem 0; }
.product .spec td:last-child { font-family: inherit; }
.product-spec > summary { cursor: pointer; font-weight: 700; color: var(--ink, #172033); }
.product-spec > summary:focus-visible,
.product-gallery__thumb:focus-visible { outline: 3px solid #f4a742; outline-offset: 3px; }

.product-img.gallery.is-enhanced { display: grid; grid-template-columns: 1fr; gap: .65rem; align-content: start; }
.product-img.gallery.is-enhanced .gallery-main {
  display: grid; place-items: center; min-height: 360px; border-radius: .65rem;
  overflow: hidden; background: #f4f6f8;
}
.product-img.gallery.is-enhanced .gallery-main picture,
.product-img.gallery.is-enhanced .gallery-main img { width: 100%; height: 360px; }
.product-img.gallery.is-enhanced .gallery-main img { display: block; max-width: none; max-height: none; object-fit: contain; }
.product-img.gallery.is-enhanced .gallery-thumbs { display: flex; gap: .45rem; overflow-x: auto; padding: .15rem; }
.product-img.gallery.is-enhanced .gallery-item { flex: 0 0 60px; }
.product-gallery__thumb { display: block; flex: 0 0 60px; width: 60px; height: 60px; padding: 0; border: 2px solid transparent; border-radius: .35rem; overflow: hidden; background: transparent; cursor: pointer; }
.product-gallery__thumb[aria-pressed="true"] { border-color: #155e75; }
.product-gallery__thumb picture, .product-gallery__thumb img { display: block; width: 100%; height: 100%; }
.product-gallery__thumb img { object-fit: cover; }
.product-gallery__caption { margin: 0; font-size: .88rem; color: #526070; }

.family-strip { display: flex; gap: .45rem; overflow-x: auto; padding: .15rem 0; }
.family-strip .strip-item { flex: 0 0 96px; }
.family-strip .strip-item img { display: block; width: 96px; height: 72px; object-fit: cover; border-radius: .35rem; }

@media (max-width: 700px) {
  .product-img.gallery.is-enhanced .gallery-main { min-height: 300px; }
  .product-img.gallery.is-enhanced .gallery-main picture,
  .product-img.gallery.is-enhanced .gallery-main img { height: 300px; }
}