Максим Иванов

https://swiperjs.com/

Так вы сами так сделали:

.slider .slide {
  padding: 0;
}

Не выкупил прикола с формой за пределами body и не в теге
https://codepen.io/roderen/pen/zYaXPYB?editors=1100

https://imgur.com/a/hZeGscZ

transition: border 0.7s ease-out;
Вырежи эту строку и вставь в button

Думаю поможет :)

UPD:
1. Для начала перейдите в папку по этому пути: C:\Users\ИМЯ_ВАШЕГО_ПК\AppData\Roaming\Code\User\snippets
Здесь будут хранится все файлы сниппетов.
2. Заходим и создаем файл snippets.json (можно любое другое название).
3. Далее в vs code переходим по этим вкладкам: File => Preferences => Settings и в строке поиска вбиваем Emmet: Extensions Path
4. Нужно нажать Add Item и прописать путь к папке в которой лежат (или лежит если файл один) файлы со снипеттами. Обязательно в конце должно быть название папки, без названия самого файла!
5. Добавляешь например следующий код в созданный ранее файл:

{
  "html": {
    "snippets": {
      "img:l": "img[width height loading='lazy']"
    }
  }
}

justify-content: space-around;

Решение!

Нельзя прописывать mainSlider.mousewheel.disable(), если у вас не прописано mousewheel: true.

Ankhena выше дал вариант:
https://developer.mozilla.org/ru/docs/Web/API/Inte...

Плюс ещё можно с помощью wow.js или же AOS

Намного лучше сделать полоску псевдоэлементом. Да и намного проще.
Какой смысл морочиться ещё с одним дивом?

https://codepen.io/roderen/pen/xxpygKr

Почему z-index не работает? Вот тебе вариант с z-index:

.testimonialsContentBottom::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 20px;
    background-color: red;
    height: 90%;
    width: 90%;
    z-index: -1;
}

 .testimonialsContentBottom::before {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 20px;
    background-color: blue;
    height: 100%;
    width: 80%;
    z-index: -2;
}

Скорее всего при подключении стиля вы указали другое его имя (не Arial MT), которое будете прописывать в font-family

Не пробовали убрать min-width и оставить только max-width? https://jsfiddle.net/0gsv4x9L/

<a>
<span class="text"></span>
<span class="icon"></span>
</a>