Виталий Першин

Вроде очевидно.. 200px * 5 = 1000px, ваши блоки занимают все доступное пространство, но при этом вы добавляете gap = 10px и получается 200px * 5 + 10px * 4, что в итоге больше 1000px и происходит перенос, если бы перенос был запрещен, то блоки ужались бы в случае отсутствия жадности..

https://jsfiddle.net/l2banners/gnLjqhv6/2/

reverseDirection
speed

Нашел за пару минут, добавил настройки с их сайта, готово:


Недавно видел такой же заказ на фрилансе, не вас исполнителем выбрали случайно?)

Chrome:


Firefox:

Чтобы слайдер нормально работал не надо переделывать слайды, надо внутри слайдов вставлять свои блоки и там их крутить как захочется. Но если уж очень надо навешать костылей, то в размере надо учитывать отступы:

.clients__box {
  outline: 1px solid red;
  margin: 0 40px;
  margin-bottom: 20px;
  width: calc(100% / 3 - 80px) !important;
}

Чтобы контент становясь флекс элементом не вылетал за пределы блока, но тянулся на всю доступную ширину, надо помимо flex-grow: 1; добавить min-width: 0;

С вашей разметкой как-то так:

slidesPerGroup: 10,

example

Учитывая что у вас неоднородный фон, градиент вам не подходит. В вашем случае подойдет маска:

.ticket__flex .ticket__item .inner__ticket {
    overflow-x: scroll;
    max-width: 1400px;
    width: 100%;
    -webkit-mask: linear-gradient( to left, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 60%, rgba(0, 0, 0, 0) 100% );
}

Пример:

На чистом js:

let el = document.querySelector('#target');
	let coords = el.getBoundingClientRect();
	window.scrollTo({
		top: coords.top + window.scrollY,
		behavior: "smooth",
	});

На jQuery:

$("html, body").animate({
            scrollTop: $('#target').offset().top
        }
    );

Можно подписаться через ref и использовать blur this.element.blur()

Это совсем не БЭМ. У вас должно было получится что-то вроде этого:

<div class="main-container">
    <img class="main-container__picture" src="images/bg.png" alt="Background">
    <!-- main-container__block-1 block-1 - Это микс, блок который модифицируется элементом другого блока или другим блоком  -->
    <div class="main-container__block-1 block-1">
        <div class="block-1__content">
            <div class="block-1__text">
                <p>Your Title Goes Here Make It Long & Maybe 3 Lines</p>
            </div>
            <div class="block-1__buttons">
                <!-- block-1__btn btn - Это тоже микс  -->
                <div class="block-1__btn btn"><a class="btn__link" href="#">explore</a></div>
                <div class="block-1__btn btn"><a class="btn__link" href="#">Add to cart</a></div>
            </div>
        </div>
    </div>
</div>

возможно надо этот элемент сделать блоком, типо: list-headet или как?

Да, блоком, но не надо приплетать header. Блок должен называться таким образом, что-бы было понятно что он делает, а не где он расположен. А в последствии можно смиксовать блок, например:

<div class="header">
    <h1 class="header__title">Title</h1>
    <p class="header__desc">Description</p>
    <ul class="header__list list">
      <li class="list__item"><a href="#" class="list__link">link</a></li>
      <li class="list__item"><a href="#" class="list__link">link</a></li>
      <li class="list__item"><a href="#" class="list__link">link</a></li>
    </ul>
  </div>

https://developers.google.com/web/updates/2017/09/...

Помимо вопроса нужно еще и поле ввода выводить, если я вас правильно понял. Смотрите как это сделано в дефолтном шаблоне:

[question]
			<li class="form-group">
				<label for="question_answer">{question}</label>
				<input placeholder="Введите ответ" type="text" name="question_answer" id="question_answer" class="wide" required>
			</li>
		[/question]

Правильно будет модифицировать или миксовать каждый элемент. Вложенность использовать только в крайнем случае, когда нет других вариантов. Если использовать css переменные, которые задаются в родителе, то в таком случае можно обойтись без модификаторов для элементов, так же можно наследовать цвет и шрифт от родителя, чтобы не задавать лишних модификаторов.

Например так:

Вы бы свой код показали что ли