.product-card-showcase { margin-top: 24px; padding: 18px; border: 1px solid #e3e4e7; border-radius: 15px; background: #fff; box-shadow: 0 8px 24px rgb(26 29 38 / 5%); }
.product-card-showcase__header, .product-card-showcase__header > div { display: flex; align-items: center; }
.product-card-showcase__header { justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.product-card-showcase__header > div { gap: 10px; }
.product-card-showcase__header > div > img { width: 22px; filter: invert(14%) sepia(99%) saturate(6300%) hue-rotate(349deg); }
.product-card-showcase__header h2 { margin: 0; color: #303238; font-size: 20px; }
.product-card-showcase__header > a { color: var(--brand-red); font-size: 12px; font-weight: 700; text-decoration: none; }
.product-card-showcase__shell { position: relative; }
.product-card-showcase__track { display: grid; grid-auto-columns: minmax(225px, 1fr); grid-auto-flow: column; gap: 15px; overflow-x: auto; padding: 4px 2px 10px; scroll-behavior: smooth; scrollbar-width: none; scroll-snap-type: x mandatory; }
.product-card-showcase__track::-webkit-scrollbar { display: none; }
.product-card-showcase__arrow { position: absolute; z-index: 20; top: 50%; display: grid; width: 36px; height: 36px; place-items: center; padding: 0; border: 1px solid #e1e2e5; border-radius: 50%; background: #fff; box-shadow: 0 5px 14px rgb(0 0 0 / 13%); cursor: pointer; transform: translateY(-50%); }
.product-card-showcase__arrow img { width: 18px; filter: invert(14%) sepia(99%) saturate(6300%) hue-rotate(349deg); }
.product-card-showcase__arrow--prev { left: -14px; }
.product-card-showcase__arrow--prev img { transform: rotate(180deg); }
.product-card-showcase__arrow--next { right: -14px; }
.product-card-showcase__arrow:disabled { visibility: hidden; opacity: 0; }

@media (min-width: 1200px) {
  .product-card-showcase__track { grid-auto-columns: calc((100% - 75px) / 6); }
}

@media (max-width: 767.98px) {
  .product-card-showcase {
    width: calc(100% + 24px);
    max-width: none !important;
    margin-inline: -12px;
    padding: 16px 12px;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }
  .product-card-showcase__header h2 { font-size: 17px; }
  .product-card-showcase__track {
    width: 100%;
    grid-auto-columns: calc((100% - 10px) / 2);
    gap: 10px;
    padding: 4px 0 10px;
    scroll-padding-inline: 0;
  }
  .product-card-showcase__arrow { display: none; }
}
