.cards-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 32px;

  @media screen and (max-width: 1200px) {
    gap: 16px;
    grid-template-columns: 1fr 1fr 1fr;
  }

  @media screen and (max-width: 720px) {
    grid-template-columns: 1fr 1fr;
  }

  @media screen and (max-width: 480px) {
    grid-template-columns: 1fr;

    &[data-layout='single'] {
      grid-template-columns: 1fr;
    }

    &[data-layout='multiple'] {
      grid-template-columns: 1fr 1fr;
    }
  }

  .custom-card {
    width: 100%;
    border-radius: 4px;
  
    .custom-card-carousel-container {
      .carousel.slide {
        .carousel-inner {
          .carousel-item {
            .custom-card-image {
              border-radius: 4px 4px 0 0;
              aspect-ratio: 3 / 4;
              object-fit: cover;
            }
          }
        }
      }
    }

    .custom-card-body {
      padding: 8px 0;

      .custom-card-title-wrapper {
        height: 48px;
        width: 100%;
        display: flex;
        align-items: center;

        .card-title {
          font-family: 'Inter Regular', 'sans-serif';
          font-size: 18px;
          font-weight: 400;
        }
      }
      
      .custom-card-price {
        font-family: 'Inter Regular', 'sans-serif';
        font-size: 16px;
        font-weight: 400;
      }
    }
  }
}