/* Product presentation. Purchase and gallery behavior remain in their modules. */
.ct-storefront .ct-detail {padding-block:var(--ct-space-6);}
.ct-storefront .ct-detail-grid {display:grid;gap:clamp(24px,4vw,56px);align-items:start;}
.ct-storefront .ct-detail-grid > * {min-width:0;}
.ct-storefront .ct-detail-gallery {margin:0;display:grid;gap:var(--ct-space-3);align-content:start;}
.ct-storefront .ct-gallery-main {display:block;min-width:0;padding:clamp(8px,2vw,20px);border:1px solid var(--ct-color-border);border-radius:var(--ct-radius-lg);background:var(--ct-color-bg);text-decoration:none;cursor:zoom-in;}
.ct-storefront .ct-gallery-hint {display:block;padding-block:8px;color:var(--ct-color-primary);font-size:var(--ct-font-size-sm);text-align:center;}
.ct-storefront .ct-lightbox {box-sizing:border-box;width:min(100% - 24px,1100px);max-width:none;max-height:calc(100% - 24px);padding:clamp(12px,2vw,24px);border:1px solid var(--ct-color-border);border-radius:var(--ct-radius-md);background:var(--ct-color-bg);color:var(--ct-color-text);overflow:auto;overscroll-behavior:contain;}
.ct-storefront .ct-lightbox:not([open]) {display:none;}
.ct-storefront .ct-lightbox::backdrop {background:rgb(0 0 0 / .75);}
body.ct-page:has(.ct-lightbox[open]) {overflow:hidden;}
.ct-storefront .ct-lightbox-head {display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px;}
.ct-storefront .ct-lightbox-head h2 {margin:0;min-width:0;overflow-wrap:anywhere;font-size:var(--ct-font-size-lg);}
.ct-storefront .ct-lightbox-head button {flex-shrink:0;}
.ct-storefront .ct-lightbox-image {display:block;width:auto;height:auto;max-width:100%;max-height:60vh;max-height:60dvh;margin-inline:auto;border-radius:var(--ct-radius-md);}
.ct-storefront .ct-lightbox-message {min-height:40vh;display:grid;place-items:center;text-align:center;}
.ct-storefront .ct-lightbox-controls {display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;}
.ct-storefront .ct-lightbox-controls [role="status"] {font-variant-numeric:tabular-nums;white-space:nowrap;min-width:4rem;text-align:center;}
.ct-storefront .ct-lightbox-arrow {position:relative;flex:0 0 44px;width:44px;height:44px;padding:0;}
.ct-storefront .ct-lightbox-arrow::after {content:attr(aria-label);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);width:max-content;max-width:12rem;padding:6px 10px;border-radius:var(--ct-radius-sm);background:var(--ct-color-text);color:var(--ct-color-bg);font-size:var(--ct-font-size-sm);font-weight:400;line-height:1.4;pointer-events:none;opacity:0;}
.ct-storefront .ct-lightbox-arrow:focus-visible::after {opacity:1;}
@media (hover:hover) {.ct-storefront .ct-lightbox-arrow:hover::after {opacity:1;}}
.ct-storefront .ct-gallery-thumbs {display:flex;flex-wrap:wrap;gap:var(--ct-space-2);}
.ct-storefront .ct-gallery-thumb {display:block;flex:0 0 68px;padding:1px;border:var(--ct-border-width) solid var(--ct-color-border);border-radius:var(--ct-control-radius);background:var(--ct-color-bg);}
.ct-storefront .ct-gallery-thumb img {display:block;width:64px;height:64px;object-fit:contain;border-radius:var(--ct-radius-sm);}
.ct-storefront .ct-gallery-thumb:hover,
.ct-storefront .ct-gallery-thumb[aria-current="true"] {border-color:var(--ct-color-primary);box-shadow:0 0 0 1px var(--ct-color-primary);}
.ct-storefront .ct-gallery-main:focus-visible,
.ct-storefront .ct-gallery-thumb:focus-visible {outline:2px solid var(--ct-color-primary);outline-offset:2px;}
.ct-storefront .ct-detail-image {display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;background:var(--ct-color-bg);border-radius:var(--ct-radius-md);}
.ct-storefront .ct-detail-title {margin:0;font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.2;text-wrap:wrap;overflow-wrap:anywhere;letter-spacing:-.025em;}
.ct-storefront .ct-detail-title--standard {font-size:clamp(1.75rem,2.8vw,2.5rem);}
.ct-storefront .ct-detail-title--large {font-size:clamp(2rem,3.4vw,3rem);}
.ct-storefront .ct-detail-summary {display:grid;gap:var(--ct-space-4);align-content:start;min-width:0;}
.ct-storefront .ct-detail-summary > .ct-product__prices {display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--ct-space-3);}
.ct-storefront .ct-detail-summary > .ct-product__prices .ct-price {font-size:clamp(1.75rem,3vw,2.5rem);line-height:1.3;}
.ct-storefront .ct-detail-summary > .ct-text {margin:0;color:var(--ct-color-muted);line-height:1.65;}

/* Scope these refinements to the product, leaving checkout rules unchanged. */
.ct-storefront .ct-detail .ct-purchase {padding:clamp(16px,2.5vw,28px);gap:var(--ct-space-4);background:var(--ct-color-surface);border-radius:var(--ct-radius-lg);}
.ct-storefront .ct-detail .ct-purchase > * {min-width:0;grid-column:1 / -1;}
.ct-storefront .ct-detail .ct-purchase > .ct-text {display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--ct-space-2);padding-bottom:var(--ct-space-3);border-bottom:var(--ct-border-width) solid var(--ct-color-border);color:var(--ct-color-muted);}
.ct-storefront .ct-detail .ct-purchase > .ct-text strong {color:var(--ct-color-text);}
.ct-storefront .ct-detail .ct-purchase input[data-ct-quantity] {max-width:9rem;font-variant-numeric:tabular-nums;}
.ct-storefront .ct-detail .ct-purchase [data-ct-add] {min-height:48px;}
.ct-storefront .ct-detail-actions {gap:var(--ct-space-4);}
.ct-storefront .ct-detail-sections {display:flex;flex-wrap:wrap;gap:4px 20px;}
.ct-storefront .ct-detail-summary > .ct-detail-sections {padding-top:12px;border-top:1px solid var(--ct-color-border);}
.ct-storefront .ct-detail-sections > a {display:inline-flex;align-items:center;min-height:44px;max-width:100%;overflow-wrap:anywhere;}
.ct-storefront .ct-detail-actions > .ct-link {display:inline-flex;align-items:center;min-height:44px;}
.ct-storefront .ct-detail-actions [aria-pressed="true"] {border-color:var(--ct-color-primary);color:var(--ct-color-primary);}

.ct-storefront .ct-detail-specs {margin:0;display:grid;padding:var(--ct-space-2) var(--ct-space-5);border:var(--ct-border-width) solid var(--ct-color-border);border-radius:var(--ct-radius-md);}
.ct-storefront .ct-detail-specs > div {display:grid;gap:var(--ct-space-2);min-width:0;padding-block:var(--ct-space-4);border-bottom:var(--ct-border-width) solid var(--ct-color-border);}
.ct-storefront .ct-detail-specs > div:last-child {border-bottom:0;}
.ct-storefront .ct-detail-specs dt,
.ct-storefront .ct-detail-specs dd {min-width:0;overflow-wrap:anywhere;}
.ct-storefront .ct-detail-specs dt {font-weight:400;color:var(--ct-color-muted);}
.ct-storefront .ct-detail-specs dd {margin:0;font-weight:var(--ct-font-weight-semibold);}
.ct-storefront .ct-detail-section {margin-top:clamp(32px,4vw,56px);scroll-margin-top:var(--ct-space-4);}
.ct-storefront .ct-detail-section > .ct-heading-2 {margin-bottom:var(--ct-space-5);}
.ct-storefront .ct-compare-scroll {overflow-x:auto;border:1px solid var(--ct-color-border);border-radius:var(--ct-radius-sm);}
.ct-storefront .ct-compare-scroll:focus-visible {outline:2px solid var(--ct-color-primary);outline-offset:3px;}
.ct-storefront .ct-detail [hidden] {display:none;}
@media(max-width:639px){
  .ct-storefront .ct-lightbox-head {flex-direction:column;align-items:stretch;}
  .ct-storefront .ct-lightbox-head button {order:-1;align-self:flex-end;}
}
@media(min-width:640px){
  .ct-storefront .ct-detail-specs > div {grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ct-space-4);}
  .ct-storefront .ct-detail .ct-purchase {grid-template-columns:120px minmax(0,1fr);}
  .ct-storefront .ct-detail .ct-purchase > .ct-field:has([data-ct-quantity]) {grid-column:1;}
  .ct-storefront .ct-detail .ct-purchase [data-ct-add] {grid-column:2;align-self:start;margin-top:28px;}
}
@media(min-width:960px){
  .ct-storefront .ct-detail-grid {grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);}
  .ct-storefront .ct-detail-gallery:has(.ct-gallery-thumbs) {grid-template-columns:72px minmax(0,1fr);gap:16px;}
  .ct-storefront .ct-detail-gallery:has(.ct-gallery-thumbs) .ct-gallery-main {grid-column:2;grid-row:1;}
  .ct-storefront .ct-detail-gallery:has(.ct-gallery-thumbs) .ct-gallery-thumbs {grid-column:1;grid-row:1;flex-direction:column;align-content:start;}
}
