/* MYLOVELYPET premium real-product gallery.
 * Kept separate from the published base theme for straightforward maintenance. */
.detail-layout {
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  gap: clamp(24px, 4.4vw, 76px);
  align-items: start;
}
.product-gallery { min-width: 0; }
.gallery-stage {
  overflow: hidden;
  position: relative;
  min-height: 460px;
  aspect-ratio: 1 / 1;
  background: linear-gradient(145deg,#f4f6fb,#fff 46%,#eef2f8);
  border: 2px solid #caa864;
  border-radius: 24px;
  box-shadow: 0 21px 58px rgba(6,27,67,.13), inset 0 0 0 6px rgba(255,255,255,.9);
  display: flex;
  align-items: center;
  justify-content: center;
}
.gallery-stage .detail-img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  aspect-ratio: 1/1;
  object-fit: contain;
  padding: clamp(9px,2vw,25px);
  border: 0;
  border-radius: 24px;
}
.gallery-thumbs {
  display: flex;
  align-items: stretch;
  gap: 11px;
  padding: 15px 2px 6px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
}
.gallery-thumb {
  flex: 0 0 88px;
  height: 88px;
  padding: 4px;
  border: 2px solid #e4e7ef;
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
  scroll-snap-align: start;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.gallery-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 9px;
}
.gallery-thumb:hover { transform: translateY(-3px); border-color:#bd9546; }
.gallery-thumb.selected { border-color:#c79e4e; box-shadow:0 0 0 2px rgba(219,177,88,.25); }
.gallery-thumb:focus-visible { outline: 3px solid #1767c3; outline-offset: 3px; }
.gallery-footnote { font-size:.78rem; color:#667085; margin:10px 0 0; }
.detail-main { padding-top: clamp(6px,1.5vw,22px); }
.detail-main h1 { line-height: 1.15; }
.detail-main > p { line-height: 1.9; white-space: pre-line; }
.detail-main .note-box { margin-top: 25px; }
.detail-video-list { margin-top: 16px; }
@media(max-width:940px) {
  .detail-layout { grid-template-columns: 1fr; gap: 27px; }
  .gallery-stage { min-height: 0; }
  .gallery-thumb { flex-basis: 78px; height: 78px; }
  .detail-main { padding-top: 4px; }
}
@media(max-width:480px) {
  .gallery-stage { border-radius:17px; }
  .gallery-stage .detail-img { border-radius:15px; padding:8px; }
  .gallery-thumbs { gap: 8px; }
  .gallery-thumb { flex-basis: 68px; height: 68px; border-radius: 11px; }
}
@media(prefers-reduced-motion:reduce) {
  .gallery-thumb { transition: none; }
}