.showcase__subtitle { text-align:center; margin:-.5rem auto 1.5rem; max-width:48rem; }
.showcase__more { display:block; width:fit-content; margin:1.5rem auto; color:inherit; text-underline-offset:4px; }
.showcase { min-width:0; margin-block:2rem; }
.collection.showcase--carousel { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:16px; row-gap:16px; align-items:center; }
.collection.showcase--carousel > h2 { grid-column:1; grid-row:1; text-align:left; margin:0; min-width:0; }
.collection.showcase--carousel > .showcase__controls { grid-column:2; grid-row:1; margin:0; align-self:center; }
.collection.showcase--carousel > .showcase__subtitle { grid-column:1/-1; text-align:left; margin:0; max-width:none; }
.collection.showcase--carousel > .product-grid, .collection.showcase--carousel > .showcase__more { grid-column:1/-1; min-width:0; }
.showcase__controls { display:flex; justify-content:flex-end; gap:.5rem; margin-bottom:1rem; }
.showcase__controls button { display:inline-flex; align-items:center; justify-content:center; padding:0; line-height:1; width:40px; height:40px; border:1px solid #e7e7e9; border-radius:50%; background:#fff; color:#45464b; cursor:pointer; font-size:0; box-shadow:0 2px 5px #00000006; }
.showcase__controls button::before { content:""; display:block; width:20px; height:20px; background:currentColor; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 7 7-7 7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; }
.showcase__controls button[data-showcase-step="-1"]::before { transform:rotate(180deg); }
.showcase__controls button:hover:not(:disabled) { background:#f7f7f8; border-color:#cfcfd3; }
.showcase__controls button:disabled { opacity:.35; cursor:default; }
.showcase__controls button:focus-visible, .showcase--carousel .product-grid:focus-visible { outline:2px solid #b85e7d; outline-offset:3px; }
.showcase.showcase--carousel .product-grid { display:flex; flex-wrap:nowrap; gap:16px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x proximity; padding:4px 2px 12px; height:auto; max-height:none; align-items:stretch; scrollbar-width:none; --fade-start:0px; --fade-end:0px; -webkit-mask-image:linear-gradient(to right,transparent,#000 var(--fade-start),#000 calc(100% - var(--fade-end)),transparent); mask-image:linear-gradient(to right,transparent,#000 var(--fade-start),#000 calc(100% - var(--fade-end)),transparent); }
.showcase--carousel .product-grid::-webkit-scrollbar { display:none; }
.showcase.showcase--carousel .product-grid { scroll-padding-inline:2px; }
.showcase--carousel.has-previous .product-grid { --fade-start:24px; }
.showcase--carousel.has-next .product-grid { --fade-end:24px; }
.showcase.showcase--carousel .product-grid > .product { display:flex; flex-direction:column; flex:0 0 210px; width:210px; height:auto; min-width:0; scroll-snap-align:start; --card-inset:10px; }
.showcase.showcase--carousel .product .product-media { flex:none; width:calc(100% + 20px); aspect-ratio:1; height:auto; }
.showcase.showcase--carousel .product .product-media .product-photo { width:100%; height:100%; aspect-ratio:1; }
.showcase.showcase--carousel .product .card-description { flex:none; margin:0; padding-block:10px 0; }
.showcase.showcase--carousel .product h3 { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; font-size:14px; line-height:20px; height:60px; min-height:60px; margin:0; }
.showcase.showcase--carousel .product .card-buy { display:flex; flex-direction:row; align-items:center; justify-content:space-between; flex:1; gap:8px; padding-block:12px 10px; }
.showcase.showcase--carousel .product .card-pricing { display:flex; align-items:center; flex:none; height:36px; min-height:36px; padding:0; margin:0; }
.showcase.showcase--carousel .product .price { margin:0; white-space:nowrap; font-size:18px; line-height:24px; }
.showcase.showcase--carousel .product .card-price-unit { display:none; }
.showcase--carousel .product .card-pricing { font-size:18px; }
.showcase--carousel .product .card-details, .showcase--carousel .product .card-offer, .showcase--carousel .product .card-meta { display:none; }
/* Keep purchase controls inside the card: hover popovers cause a vertical scrollbar. */
.showcase.showcase--carousel .product[data-commerce] .card-purchase { position:relative; inset:auto; grid-row:auto; display:flex; flex:0 0 36px; align-self:center; visibility:visible; opacity:1; pointer-events:auto; transform:none; box-shadow:none; margin:0; padding:0; border:0; width:36px; background:none; }
.showcase.showcase--carousel .card-purchase .card-quantity, .showcase.showcase--carousel .card-purchase .purchase-total { display:none; }
.showcase.showcase--carousel .card-purchase .card-add { display:inline-flex; align-items:center; justify-content:center; padding:0; width:36px; height:36px; min-height:36px; font-size:0; }
.showcase.showcase--carousel .card-add::before { content:""; display:block; width:20px; height:20px; background:currentColor; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9h18l-2 11H5L3 9Zm4 0 3-6m7 6-3-6M9 13v3m6-3v3'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; }
.showcase.showcase--carousel .card-add.is-added::before { mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); animation:showcase-added .3s ease-out; }
@keyframes showcase-added { from { opacity:0; transform:scale(.5); } to { opacity:1; transform:scale(1); } }
@media (prefers-reduced-motion:reduce) { .showcase.showcase--carousel .card-add.is-added::before { animation:none; } }
@media (max-width:767px) { .showcase.showcase--carousel .product-grid { gap:12px; } .showcase.showcase--carousel .product-grid > .product { flex-basis:168px; width:168px; } }

.showcase--compact .product-grid { grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); }
.showcase--compact .card-description h3 { font-size:14px; }
.showcase--compact .card-details, .showcase--compact .card-offer, .showcase--compact .card-meta { display:none; }
@media (max-width:479px) { .showcase--compact .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

.live-product { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:32px; }
.live-product__gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-content:start; }
.live-product__gallery img { width:100%; height:auto; border-radius:16px; }
.live-product__gallery img:first-child { grid-column:1/-1; }
@media(max-width:767px) { .live-product { grid-template-columns:1fr; } }
