/* Обертка всей секции, чтобы фон не вылезал за ее пределы */
.solution-page-wrapper {
  position: relative;
  overflow: hidden;
  min-height: 100vh; /* Чтобы фон не обрывался, если контента мало */
}

/* Контейнер фона - лежит СЗАДИ всего контента */
.background-vectors {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; /* Контейнер растянут на всю высоту wrapper'а */
  z-index: -1;
  pointer-events: none; /* Пропускаем клики сквозь фон */

  /* Выстраиваем векторы друг под другом */
  display: flex;
  flex-direction: column;
  align-items: center; /* Центрируем векторы, если они меньше ширины экрана */
  justify-content: space-around;
}

/* Общие стили для векторов */
.bg-shape {
  width: 100%; /* Если векторы в фигме нарисованы на всю ширину макета */
  max-width: 2560px;
  display: block;
}

/* Отступы между векторами согласно ТЗ */
.shape-1 {
  margin-top: 600px;
  margin-bottom: 120px;
}

.shape-2 {
  margin-bottom: 0;
}

.shape-3 {
  margin-bottom: 70px; /* Предполагаю, что имелось в виду между 3 и 4 */
}

.shape-4 {
  margin-bottom: 0;
}

/* 
 * Важно: чтобы контент гарантированно был ПОВЕРХ фона, 
 * я добавил класс .content-layer к вашим div'ам с контентом
 */
.content-layer {
  position: relative;
  z-index: 1;
}

:root {
  --left-absolute: max(
    var(--container-padding-horizontal),
    calc((100% - 1248px) / 2 + var(--container-padding-horizontal))
  ); /* left-absolute = тоже самое что использование контейнера, но только с одной стороны. с другой прижимаемся к краю экрана */
}

/* .left-side-extended {
  max-width: calc(1200px + 70px);
  position: relative;
  margin-left: auto;
  margin-right: auto;
}

.left-side-extended .content-width {
  margin-left: var(--left-absolute);
} */

.both-sides-extended {
  max-width: calc(1248px + 92px);
  position: relative;
  margin-left: auto;
  margin-right: auto;
}

ul li::before {
  background: #5c7cfa;
}

ul li {
  margin: 8px 0;
  margin-left: 16px;
}

.solution-buttons-bottom {
  justify-content: center;
}

@media (max-width: 768px) {
  ul li {
    margin-left: 8px;
  }
}

@media (max-width: 610px) {
  .solution-buttons-bottom {
    justify-content: start;
  }
}
