/* Product detail page */
.pdp { padding-top: calc(var(--header-h) + var(--s-5)); }
.pdp__grid { display: grid; gap: var(--s-6); }
@media (min-width: 900px) { .pdp__grid { grid-template-columns: 7fr 5fr; gap: var(--s-8); align-items: start; } .pdp__gallery { position: sticky; top: calc(var(--header-h-compact) + var(--s-4)); } }
.pdp__main { aspect-ratio: 4 / 5; border-radius: var(--r-1); position: relative; }
@media (min-width: 900px) { .pdp__main { aspect-ratio: 5 / 6; } }
.pdp__main img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity var(--t-base) var(--ease-out); }
.pdp__main img.is-active { opacity: 1; }
.pdp__nav { position: absolute; top: 50%; width: 44px; height: 44px; display: grid; place-items: center; background: var(--glass-strong); backdrop-filter: blur(10px); border-radius: 50%; transform: translateY(-50%); opacity: 0; transition: opacity var(--t-fast), background var(--t-fast); }
.pdp__nav svg { width: 18px; height: 18px; stroke: var(--ink); fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.pdp__nav--prev { left: 12px; } .pdp__nav--next { right: 12px; }
.pdp__main:hover .pdp__nav, .pdp__nav:focus-visible { opacity: 1; }
.pdp__nav:hover { background: var(--ink); }
.pdp__nav:hover svg { stroke: var(--paper); }
@media (hover: none) { .pdp__nav { display: none; } }
.pdp__thumbs { display: flex; gap: var(--s-2); margin-top: var(--s-2); overflow-x: auto; scrollbar-width: none; }
.pdp__thumbs::-webkit-scrollbar { display: none; }
.pdp__thumbs button { flex: 0 0 64px; aspect-ratio: 4/5; overflow: hidden; border-radius: var(--r-1); opacity: .5; border: 1px solid transparent; transition: opacity var(--t-fast), border-color var(--t-fast); }
.pdp__thumbs button[aria-selected="true"] { opacity: 1; border-color: var(--ink); }
.pdp__thumbs img { width: 100%; height: 100%; object-fit: cover; }

.pdp__info { display: grid; gap: var(--s-5); align-content: start; }
.pdp__head { display: grid; gap: var(--s-2); }
.pdp__tag { color: var(--clay); }
.pdp__price { font-size: var(--text-lg); font-variant-numeric: tabular-nums; }
.pdp__row { display: grid; gap: var(--s-3); }
.pdp__label { display: flex; justify-content: space-between; font-size: var(--text-sm); color: var(--ink-2); }
.pdp__buy { display: grid; grid-template-columns: auto 1fr; gap: var(--s-3); align-items: center; }
.pdp__buy .btn { min-height: 48px; }
.pdp__save { grid-column: 1 / -1; display: inline-flex; align-items: center; gap: var(--s-2); justify-self: start; font-size: var(--text-sm); color: var(--ink-2); padding: 6px 0; transition: color var(--t-fast); }
.pdp__save svg { width: 16px; height: 16px; stroke: currentColor; fill: transparent; stroke-width: 1.5; transition: fill var(--t-fast); }
.pdp__save:hover { color: var(--ink); }
.pdp__save[aria-pressed="true"] { color: var(--ink); }
.pdp__save[aria-pressed="true"] svg { fill: var(--ink); }
.pdp__facts { display: grid; gap: var(--s-2); padding: var(--s-4) 0; border-block: 1px solid var(--line); }
.pdp__facts li { display: flex; gap: var(--s-3); align-items: center; font-size: var(--text-sm); color: var(--ink-2); }
.pdp__facts svg { width: 18px; height: 18px; stroke: var(--ink); fill: none; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.pdp__acc { border-top: 0; }
.pdp__acc .acc__trigger { padding-block: var(--s-4); }
.pdp__list { display: grid; gap: 6px; padding-bottom: var(--s-4); color: var(--ink-2); font-size: var(--text-sm); }
.pdp__list li::before { content: "— "; }
.pdp__dims { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: var(--s-3); padding-bottom: var(--s-4); }
.pdp__dims dt { color: var(--ink-3); margin-bottom: 2px; text-transform: capitalize; }
.pdp__dims dd { font-size: var(--text-sm); font-weight: 500; }
.pdp__acc .acc__panel p { padding-bottom: var(--s-4); font-size: var(--text-sm); }

/* Sticky buy bar (phones) */
.pdp__bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-sticky); display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); padding: var(--s-3) var(--gutter) max(var(--s-3), env(safe-area-inset-bottom)); background: var(--glass-strong); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-top: 1px solid var(--line); transform: translateY(110%); transition: transform var(--t-base) var(--ease-out); }
.pdp__bar.is-on { transform: none; }
.pdp__bar > div { display: grid; line-height: 1.2; }
.pdp__bar strong { font-weight: 500; font-size: var(--text-sm); }
@media (min-width: 900px) { .pdp__bar { display: none; } }

.products--related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 720px) { .products--related { grid-template-columns: repeat(4, minmax(0, 1fr)); } }