.collection-page {
  width: 100%;
}

.collection-page__wrapper {
  background: var(--background-primary);
  color: var(--color-primary);
}

.collection-page__wrapper--padding-top {
  padding-top: var(--padding-top-mobile, 0);
}

.collection-page__wrapper--padding-bottom {
  padding-bottom: var(--padding-bottom-mobile, 0);
}

.collection-page__products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
  gap: 18px;
  justify-content: center;
}

.collection-page__grid {
  font-size: var(--font-size-regular);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-lg);
}

.collection-page__wrapper > .collection-page__products,
.collection-page__wrapper > .collection-page__grid {
  padding: 0 16px;
}

.collection-page .product-card {
  min-width: auto;
}

@media (min-width: 768px) {
  .collection-page__products {
    justify-content: start;
    gap: 24px;
  }
}

@media (min-width: 992px) {
  .collection-page__wrapper--padding-top {
    padding-top: var(--padding-top, 0);
  }

  .collection-page__wrapper--padding-bottom {
    padding-bottom: var(--padding-bottom, 0);
  }

  .collection-page__grid {
    display: grid;
    grid-template-columns: minmax(200px, 23.25%) 1fr;
    gap: 0 5.07%;
    grid-template-areas:
      "sidebar grid"
      "pagination pagination";
  }

  .collection-page__grid .collection-page__sidebar {
    grid-area: sidebar;
  }

  .collection-page__grid .collection-page__pagination {
    grid-area: pagination;
  }

  .collection-page__wrapper > .collection-page__products,
  .collection-page__wrapper > .collection-page__grid {
    padding: 0 24px;
  }

  .collection-page__wrapper .product-card__vision:after {
    aspect-ratio: 1 / 0.975;
  }

  .collection-page__container .product-card__vision:after {
    aspect-ratio: 1 / 1.036;
  }

  .collection-page__wrapper-three .product-card__vision:after {
    aspect-ratio: 1 / 1.407;
  }

  .collection-page__wrapper-three .collection-page__container .product-card__vision:after {
    aspect-ratio: 1 / 1.2825;
  }

  .collection-page__wrapper-four .product-card__vision:after {
    aspect-ratio: 1 / 1.275;
  }

  .collection-page__wrapper-four .collection-page__container .product-card__vision:after {
    aspect-ratio: 1 / 1.32155;
  }
}

@media (min-width: 1080px) {
  .collection-page__products {
    gap: 20px 32px;
    grid-template-columns: repeat(var(--grid-element), minmax(var(--item-min-width), 1fr));
  }
}