.products__wrapper {
  --buttons-indent: 70px;

  position: relative;
  background: var(--background-primary);
}

.products__wrapper--padding-top {
  padding-top: var(--padding-top-mobile);
}

.products__wrapper--padding-bottom {
  padding-bottom: var(--padding-bottom-mobile);
}

.products__container {
  position: relative;
  z-index: 1;
}

.products__list {
  --slide-width-mobile: 250px;

  display: inline-flex;
}

.products__list:not(.carousel) {
  overflow: hidden;
  border-radius: var(--border-radius-block);
  border: 1px solid var(--color-border);
}

.products__list > .product-card {
  max-width: var(--slide-width-mobile);
  min-width: var(--slide-width-mobile);
}

.products__list > .product-card:last-child .product-card__meta,
.products__list > .product-card:last-child .product-card__vision,
.products__list.controls .carousel__item:last-child .product-card__vision,
.products__list.controls .carousel__item:last-child .product-card__meta {
  border-right-color: transparent;
}

.products__list:has(:only-child) {
  border: none;
}

.products__list--empty {
  width: 100%;
  padding: 20px;
}

.products__content {
  --block-max-width: 506px;
  --block-min-width: calc(300px + var(--grid-gap));
  --block-width: calc(27vw + 1px);
  --block-padding-elements: 38px;
  --block-padding-inner: 24px;
  --block-text-align: center;
  --button-height: 48px;
  --content-align: flex-start;
  --content-direction: column;
  --content-padding: 14px;
  --gap: var(--grid-gap-mobile);

  display: flex;
  gap: var(--gap);
  flex-direction: var(--content-direction);
  align-items: var(--content-align);
  padding-top: var(--content-padding);
}

.products__content:has(.products__category-description) {
  --block-padding-elements: 8px;
}

.products__category-buttons {
  text-align: var(--block-text-align);
  padding-top: var(--block-padding-elements);
  margin-bottom: calc(-1 * var(--button-margin-bottom));
}

.products__category-background-wrapper:has(.image-placeholder),
.products__category-background-wrapper {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
}

.products__category-background {
  max-width: none;
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.products__category-block {
  border-radius: var(--border-radius-block);
  border: 1px solid var(--color-border);
  color: var(--color-overlay);
  position: relative;
  overflow: hidden;
  width: 100%;
  padding: var(--block-padding-inner);
}

.products__category-content {
  position: relative;
  z-index: 1;
}

.products__category-heading {
  line-height: var(--font-height-md);
  text-align: var(--block-text-align);
  color: inherit;
}

.products__category-description  {
  line-height: var(--font-height-md);
  text-align: var(--block-text-align);
  color: inherit;
}

.products__category-description:not(:empty):not(:last-child) {
  padding-bottom: 30px;
}

.products__category-background-wrapper--overlay:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(to bottom, var(--background-overlay) 0%, var(--background-overlay-00) 100%);
  opacity: var(--opacity-overlay);
}

@media (min-width: 992px) {
  .products__wrapper--padding-top {
    padding-top: var(--padding-top);
  }

  .products__wrapper--padding-bottom {
    padding-bottom: var(--padding-bottom);
  }

  .products__content {
    --block-padding-elements: 0;
    --block-padding-inner: 32px;
    --block-text-align: left;
    --content-align: stretch;
    --content-direction: row;
    --content-padding: 19px;
    --gap: var(--grid-gap);

    justify-content: space-between;
  }

  .products__content:has(.products__category-block) {
    --slide-width: 283px;
  }

  .products__content:has(.products__category-description) {
    --block-padding-elements: 0;
  }

  .products__category-block {
    flex: 0 1 clamp(var(--block-min-width), var(--block-width), calc(var(--block-max-width) - var(--grid-gap)));
    max-width: calc(var(--block-max-width) - var(--grid-gap));
    padding: var(--block-padding-inner);
  }

  .products__category-heading {
    padding: var(--block-padding-elements);
  }

  .products__list > .product-card {
    min-width: var(--slide-width);
    max-width: var(--slide-width);
  }

  .products__content:has(.carousel__item:nth-child(3)) .products__list {
    flex: 1 1 auto;
    max-width: calc(100% - clamp(var(--block-min-width), var(--block-width), var(--block-max-width)));
  }

  .products__content:has(.products__category-block) .carousel__navigation {
    left: calc((100% + clamp(var(--block-min-width), var(--block-width), var(--block-max-width)) - var(--gap)) / 2 + var(--gap) / 2);
  }

  .products__content .products__list.controls + .products__category-block {
    padding-bottom: calc(var(--block-padding-inner) * 2 + var(--button-height));
    margin: 0 0 var(--buttons-indent);
  }
}

@media (min-width: 1870px) {
  .products__category-block {
    flex: 0 0 calc(var(--block-max-width) - var(--grid-gap));
  }
}
