/* Native horizontal scrolling remains available when JavaScript is disabled. */
.a1 .showcase-track {
    --showcase-columns: 3;
    --showcase-gap: 20px;
    display: flex;
    gap: var(--showcase-gap);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: #aec9dc transparent;
    padding: 6px 0 16px;
}
.a1 .showcase-track.is-fading { scroll-snap-type: none; pointer-events: none; }
.a1 .showcase-track.is-enhanced { scrollbar-width: none; }
.a1 .showcase-track.is-enhanced::-webkit-scrollbar { display: none; }
.a1 .case-grid.showcase-track { --showcase-columns: 2; --showcase-gap: 28px; }
.a1 .showcase-track > a {
    flex: 0 0 calc((100% - (var(--showcase-columns) - 1) * var(--showcase-gap)) / var(--showcase-columns));
    min-width: 0;
    scroll-snap-align: start;
}
.a1 .showcase-track .product-photo,
.a1 .showcase-track .product-card:nth-child(-n+2) .product-photo {
    height: auto;
    aspect-ratio: 1.45;
}
.a1 .showcase-track .product-photo img { aspect-ratio: auto; }
.a1 .showcase-track .case-image { height: auto; aspect-ratio: 2.1; }
.a1 .showcase-track .case-copy { align-items: flex-start; }
.a1 .showcase-track .case-copy h3 { font-size: 20px; line-height: 1.6; }
.showcase-controls { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 12px; }
.showcase-controls[hidden] { display: none; }
.showcase-position { margin-right: auto; color: #6a7c89; font-size: 12px; font-weight: 400; }
.showcase-controls button { min-width: 40px; min-height: 40px; padding: 7px 12px; border: 1px solid #aec9dc; background: transparent; color: #075eac; cursor: pointer; font-size: 13px; }
.showcase-controls button:hover { background: #e2edf6; }
.showcase-controls button:disabled { opacity: .35; cursor: default; }
@media (max-width: 1024px) {
    .a1 .product-grid.showcase-track { --showcase-columns: 2; }
}
@media (max-width: 767px) {
    .a1 .product-grid.showcase-track, .a1 .case-grid.showcase-track { --showcase-columns: 1; --showcase-gap: 16px; }
    .a1 .showcase-track .case-copy h3 { font-size: 18px; }
}
