.slides {
  box-sizing: border-box;
  padding: var(--xl-gap-y) var(--xl-gap-x);
  width: 100%;
}

.slides--slider:not(.slides--inited):not(.slides--items-3):not(.slides--items-6) .slides__items {
  justify-content: center;
}

.slides--with-background.slides--items-3 {
  background-image: url("data:image/svg+xml,%3Csvg width='1440' height='391' viewBox='0 0 1440 391' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-173.344 68.1592C-62.704 18.94 58.5584 -4.81887 180.48 10.6167C279.301 23.14 374.521 60.0046 454.642 116.397C539.346 176.009 610.884 250.903 701.658 303.296C908.222 422.55 1172.24 407.406 1370.82 279.353C1445.39 231.268 1507.71 168.652 1557.65 97.8502' stroke='%23AFD700' stroke-width='11.8933' stroke-miterlimit='10'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-color: var(--pale-slate);
}

.slides--slider.slides--items-3 .slides__item {
  @media (min-width: 760px) {
    min-height: 565px;
  }
}

.slides__wrap {
  overflow: hidden;
  max-width: calc(var(--xl-width) - 2*(var(--xl-gap-x)));
  margin: 0 auto;
}

.slides--with-background .slides__head {
  text-align: center;
}

.slides__head {
  margin: 0 0 50px 0;
}

.slides__items {
  display: flex;
}

.slides--grid.slides--items-3 .slides__items {
  display: grid;
  justify-content: center;
  gap: 25px;
  @media (min-width: 551px) and (max-width: 950px) {
    grid-template-columns: repeat(2, 1fr);
  }

  @media (min-width: 951px) {
    grid-template-columns: repeat(3, minmax(250px, 305px));
  }
}

.slides--title-centered .slides__title {
  text-align: center;
}

.slides__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin: 30px 0 0 0;
}

.slides__nav button {
  border: 2px solid var(--teal);
  border-radius: 100%;
  width: 55px;
  aspect-ratio: 1/1;
  background-color: transparent;
  color: var(--teal);
  margin: 0;
  padding: 0;
}

.slides__nav button[disabled] {
  border-color: var(--slate);
  color: var(--slate);
  cursor: auto;
}

.slides__nav button svg {
  display: block;
  margin: 0 auto;
}

.slides__link {
  text-align: center;
  margin: 15px 0 0 0;
  @media (min-width: 760px) {
    margin: 40px 0 0 0;
  }
}