.product-recommendations {
  display: block;

  &.color-inverse {
    color: var(--hh-color-day);

    .product-recommendations__card {
      .price-item {
        color: var(--hh-color-day);
      }
    }
  }
}

.product-recommendations__card {
  min-width: max(270px, 70vw);
  scroll-snap-align: start;
}

@media screen and (min-width: 750px) {
  .product-recommendations__card {
    min-width: max(380px, 26vw);
  }
}

.product-recommendations .media {
  aspect-ratio: 380 / 480;
  padding-bottom: 0 !important;
}

.product-recommendations__slider {
  display: flex;
  flex-direction: column;
}