Хочу сместить заголовок в низ, а смещается блок, хотя margin указан на заголовок h1, почему?

Погуглите "схлопывание и выпадение вертикальных margin"

Почему появляется белая полоса при адаптиве?

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

Но глядя на скрины, я почему-то думаю, что полоса прокрутки всё таки остается.

Можно удалять блоки по одному и искать кто виноват.
Можно обвести все элементы и псевдоэлементы рамочками (outline + отрицательный outline-offset) и просто посмотреть глазками, кто выпирает и починить.

У вас, по всей видимости, выпирает та часть с кругами и подарком (неизвестно чем оно у вам там сверстано)

Как сделать FAQ при нажатии вопроса, который отобразит ответ в блоке?

Да, гуглите по "javascript tabs"

Как оформить вывод постов в виде сеток [GRID CSS]?

Артём Буханец,
например,

grid-column: span 2
grid-row: span 2

даст вам элемент 2х2 (арбуз)

Вы зря повышаете специфичность селекторов article.post-grid. Думаю, что .post-grid вполне достаточно.
Тем более, если разметка может поменяться, к примеру, с article на li.

Как оформить вывод постов в виде сеток [GRID CSS]?

Артём Буханец, прекрасный грид.
Теперь через nth-child задавайте размеры карточкам типа span 2

Как реализовать такой скролл на сайте? https://logo.localkitchen.ru/ Может имеются какие-то плагины для этого?

Kamil, у вас точно проблемы с переводом на JS? На русском можете написать алгоритм вычислений? Типа получить текущую прокрутку, вычислить вот так, выдать положение блока и т.д.

Если не можете, даже смотря в пример, то вам, всё таки на фриланс.
Если можете, то так подробненько и пишите прямо по-русски.
А дальше просто гуглите каждую из фраз, например, "javascript получить текущую прокрутку элемента".
Если не получается что-то конкретное - задавайте вопросы. Сначала гуглу, потом тут.

Как правильно верстать баннер интернет магазина?

Если контент не важен, а важно только чтобы посетитель посмотрел и кликнул, то можно и картинкой. (Только не забудьте про разные размеры для разных устройств, ретину..)
А если текст важен для людей, нужно чтобы он был доступен скринридерам, поисковикам и т.д., а также должен редактироваться из CMS, то верстать как обычно.

Где ошибка в коде html?

Ошибки в HTML ищутся с помощью валидатора https://validator.w3.org/nu/

В вашем коде (если его нормально вставить на страницу) с точки зрения валидации ошибок нет.
Но есть всякие странности типа пустых тегов, нарушенной семантики и т.д.

Кажется именно этому учат в Практикуме.

Как реализовать такой скролл на сайте? https://logo.localkitchen.ru/ Может имеются какие-то плагины для этого?

Kamil,

а можете пожалуйста написать подробно как это сделать?

Нажимаете F12 или ctrl+shift+I
https://habr.com/ru/company/simbirsoft/blog/337116/ статья 17 года, для начала норм.
https://developer.chrome.com/

Как сделать выпадающее меню для товаров?

Погуглите про $this и родственные связи.

Как реализовать такой скролл на сайте? https://logo.localkitchen.ru/ Может имеются какие-то плагины для этого?

Kamil, на сайте-примере всё можно посмотреть в исходном коде.
Проверяется скролл и в зависимости от него меняется z-index, top и т.д.

В основе flex или inline-block?

Foxizix, нет, это разные значения. Ещё инлайн-флекс можно было бы попытаться сравнивать с инлайн-блоком... хотя и это разные вещи.

Как менять стили при наведении на тег area?

Артем Рассадин, дольше спрашивать, чем обвести контуры.

Как менять стили при наведении на тег area?

В современном мире практически перестали использовать map и area.

А такие карты как у вас, рисуют в svg, а там нет проблем с наведением на отдельные области.

Какой курс и в какой организации выбрать (веб-разработка)?

Стартовые знания/навыки: middle

Систематизировать имеющиеся знания

Извините, но эти две фразы не сходятся.
Т.е. если в компании один разработчик, то он будет и сеньором, конечно. Но в среднем по больнице выходит ерунда.

Получить новые знания, обрести и перенять опыт ментора

Вот ментора и ищите. Показывайте свой код, просите код ревью, задавайте вопросы и т.д.

Почему не работает a:hover?

TRAZAN,
Тут

background-size: 200 100%;
-webkit-background-size: 230 100%

1. Вы забыли единицы измерения
2. Разные размеры в основном свойстве и свойстве с префиксом
3. Неверный порядок свойства с префиксом и основного
4. Для свойства background-size вообще не нужны префиксы

И в анимации пишется так cubic-bezier

Возможно ли без медиа запроса переносить блоки друг под друга в мобилке без фикс ширины?

Поддерживаю оба комментария выше.

Хочу обратить внимание на проблемы последней строки.
Но тут вам поможет nth-child и вот эта статья
https://css-live.ru/articles/resheno-s-pomoshhyu-c...

Как сделать адаптивное поле ввода input?

Есть ещё атрибут contenteditable="true"

Почему при наполнении текста ломается верстка?

.programs .container .wrapper .programms__item .programms__info .wrapper .programs__link a img

Это ... любое неприличное слово.
А если вы ещё и БЭМ используете, то совсем ужс.

Вложенность селекторов больше двух-трех это дурной тон и выстрел себе же в ногу.

Пытался ограничить текст с помощью width, ничего не получилось.

В коде этого не видно.

Чтобы обрезать текст, кроме width потребуется ещё overflow и text-overflow.

Сделайте пример в песочнице codepen.io
Желательно уже с нормальными селекторами.
Каринки можно заменить на любые или использовать заглушки.

Как вставить тег br, чтобы числа выводились с новой строки?

Хоть так
document.write(i + '<br>');