/*==================================================
PRODUCT DETAILS — RESPONSIVE
==================================================*/

@media (max-width:1199.98px){
  .product-showcase-grid{grid-template-columns:minmax(0,1fr) minmax(390px,.95fr);gap:clamp(2.5rem,5vw,5rem)}
}

@media (max-width:991.98px){
  .product-page .site-hero-media img{object-position:68% center}
  .product-showcase-grid{grid-template-columns:1fr;max-width:760px}
  .product-gallery{max-width:760px}
  .product-gallery-image-wrap{aspect-ratio:5/5.2}
  .product-details{padding-top:0}
  .product-story-layout{grid-template-columns:1fr;max-width:760px}
  .product-story-image{order:-1}
}

@media (max-width:575.98px){
  .product-page .site-hero-media img{object-position:72% center}
  .product-breadcrumb{padding:var(--space-md) 0}
  .product-breadcrumb li{font-size:.68rem}
  .product-showcase{padding:var(--space-2xl) 0 var(--space-4xl)}
  .product-showcase-grid{gap:var(--space-2xl)}
  .product-gallery-image-wrap{aspect-ratio:1/1.08}
  .product-gallery-badge{top:var(--space-md);left:var(--space-md)}
  .product-gallery-expand{right:var(--space-md);bottom:var(--space-md);width:42px;height:42px}
  .product-gallery-thumbnails{gap:.55rem}
  .product-details-header h2{font-size:clamp(2.8rem,13vw,4rem)}
  .product-short-description{font-size:1.18rem}
  .product-order-form{padding:var(--space-xl) var(--space-lg)}
  .product-option-grid{grid-template-columns:1fr}
  .product-order-row{align-items:stretch;flex-direction:column;gap:var(--space-lg)}
  .product-order-total{text-align:left}
  .product-service-detail,.product-allergen-notice{grid-template-columns:38px minmax(0,1fr)}
  .product-service-icon,.product-allergen-icon{width:38px;height:38px}
  .product-story{padding:var(--space-4xl) 0}
  .product-story-layout{gap:var(--space-2xl)}
  .product-story-content h2{font-size:clamp(2.7rem,12vw,3.9rem)}
  .product-story-image img{aspect-ratio:1/.9}
  .product-image-modal{padding:var(--space-md)}
}

@media (max-width:374.98px){
  .product-gallery-thumbnails{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-details-header h2{font-size:2.65rem}
  .product-order-form{padding:var(--space-lg) var(--space-md)}
  .product-quantity-control{grid-template-columns:38px 54px 38px}
  .product-story-content h2{font-size:2.5rem}
}
