Можно ли сделать такие линии и фигуры с помощью css или только svg?

Максим Иванов, СВГ если Вам нужно чтобы оно хорошо масштабировалось. Если нет - пнг8 картинки с альфа каналом. Меньше весить будут.

Можно ли сделать такие линии и фигуры с помощью css или только svg?

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

Можно ли сделать такие линии и фигуры с помощью css или только svg?

Можно, но не нужно.

Как бы вы сверстали такую страничку?

1 Что выбрать для верстки подобных страниц: гриды, флексбоксы, дивы или что-то другое?

Для шапки флексбокс, для тела - гриды.

2 Тут надо использовать БЭМ, Bootstrap или что-то другое?

На усмотрение. БЭМ Вашем вопросе - мягкое, Bootstrap - тёплое. Совершенно разные вещи. И то и то на усмотрение. Но я бы бутстрап не использовал. Зачем если гриды.

3 Насколько сложно/долго сверстать такую страничку?

Шапка и открывающееся меню входит в этот вопрос?
Если да, то ответ нормального разработчика должен быть примерно таким: А какие состояния у поиска, а что он должен делать? А что там в мобильном меню? А как оно должно раскрываться?
Если нет, то чистой работы - 30 минут потолок(с запасом). Под чистой работой подразумевается написание кода. (Если речь идёт строго про вёрстку того, что есть на скриншоте)

4 Какие рекомендации вы бы добавили лично от себя?

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

Возможно ли сделать такой фон методами css или только вставкой картинки?

Можно но неоправданно сложно, чтобы использовать

Background изображение ограничена по блоку, как сделать ее полным?

Слишком абстрактно.
Опишите максимально подробно разницу между имеющимся результатом и желаемым.

Что делать если игровой персонаж выходит за края экрана? Как узнать, касается ли персонаж игрового блока?

https://developer.mozilla.org/ru/docs/Games/Tutori...
https://medium.com/@hemalatha.psna/collision-detec...
https://askdev.ru/q/javascript-obnaruzhenie-stolkn...
https://stackoverflow.com/questions/9768291/check-...

Как передать значение из input к-во товара в форму?

VPVPVP,
https://learn.javascript.ru/introduction-browser-events
https://learn.javascript.ru/events-change-input
https://learn.javascript.ru/localstorage
https://learn.javascript.ru/function-basics
https://developer.mozilla.org/ru/docs/Web/API/Wind...

Или вместо всего этого - https://freelance.habr.com/
Ну или можете написать мне в частном порядке.

Как выбрать все элементы которое находится над другим элементом с помощью CSS?

Михаил Миронов, А чего Вы тогда сняли отметку что это ответ?)

Как растянуть основной блок на всю страницу?

Так
Или так

2. Перед тем как задать вопрос пользователь Сервиса обязан:
2.2 Убедиться в том, что в сети Интернет, и на страницах Сервиса в частности, отсутствуют ответы на данный вопрос. Специально для этого талантливые IT-специалисты создали и развивают поисковые системы Яндекс и Google.

Как реализовать анимацию при прокрутке страницы?

letmesp, Был бы совсем другой разговор, если бы Вы сделали демку, показали её, и спросили почему не работает. А сейчас выглядит как "Мне лень разбираться, там ещё и на английском, сделайте за меня бесплатно, пожалуйста".

Как реализовать анимацию при прокрутке страницы?

letmesp, Плагин Вы уже нашли. Читаем всё что написано на страничке плагина на гитхабе, смотрим примеры, смотрим их исходный код - чем не мануал?
Или может Вы не мануал хотели, а чтобы за Вас сделали?

Как реализовать анимацию при прокрутке страницы?

letmesp, А если Вы воспользуетесь инструментами разработчика и заинспектируете эту планету, из которой вылетает человек, то сами убедитесь, что это набор дивов.

Как реализовать анимацию при прокрутке страницы?

letmesp,

Хочу сделать анимацию, как здесь, где человек вылетает с планеты

Несколько картинок, объединённые визуально в одну, но анимирующиеся по отдельности - то же самое что несколько отдельных блоков.

Как реализовать анимацию при прокрутке страницы?

Правила сервисва

2. Перед тем как задать вопрос пользователь Сервиса обязан:
2.2 Убедиться в том, что в сети Интернет, и на страницах Сервиса в частности, отсутствуют ответы на данный вопрос. Специально для этого талантливые IT-специалисты создали и развивают поисковые системы Яндекс и Google.;

Первый же результат по запросу "анимация при прокрутке страницы" https://qna.habr.com/search?q=%D0%B0%D0%BD%D0%B8%D...

Как же реализуется такой эффект анимации при прокрутке страницы?

Какая разница между await и Promise?

Ernest Faizullin, Да, это сахар и только. Но сахар этот не простой, а сложносоставной. Он не только из промисов состоит. Там ещё щепотка генераторов.

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

ZipZaper, Не совсем. template-columns\rows описывают размеры областей в сетке, а grid-template-areas описывают какие элементы будут располагаться в этих областях.
То есть эти свойства лучше комбинировать.

Datepicker, выбор диапазон дней, 2 поля, как в первом запретить выбор прошедшей даты?

Антон Вебсайтовский,
1) Когда в теме есть явный ответ, принятый решением - это лучше, чем искать его в куче длинных комментариев.
2) Мы не переходили на "Ты".
3) Тут не форум и не социальная сеть чтобы обсуждать личность пользователей сервиса. Да и, в целом, чьи либо личности.

Влалидация, при выводе, перекидывает к классу где выводится ошибка, как реализовать?

Антон Вебсайтовский, Напишите в ответы и отметьте свои самостоятельные решения как подходящие. Чтоб другие время не тратили.

Datepicker, выбор диапазон дней, 2 поля, как в первом запретить выбор прошедшей даты?

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