Никита Михайлов

Интерфейс Location. С его помощью можешь узнавать конкретную страницу.

Ну так достаточно просто всё это гуглится

https://designmodo.com/web-design-trends-2020/
https://elementor.com/blog/web-design-trends-2020/

Ну и всё в таком духе. Изучай тренды, изучай сами сайты. Там уже всё и увидишь. Про колонки ты зря. Они там и появились, там и используются :D

Заглядывай сюда: https://www.awwwards.com/websites/

Три блока. С помощью flex выстраиваешь в один ряд. Добавляешь нужные зелёные границы сверху и по бокам (кроме последнего элемента. Можно всем выставить border-right).

Нижний блок это будет отдельная сущность на зелёном фоне

Сделай два блока с нужными размерами (в относительных единицах). Это будет твоя левая и правая часть. Уже в них располагай контент. Тогда при изменении разрешения они не будут пересекать твою границу

Есть какие-то примеры того, что интересно? Можешь тут поглядеть https://themes.getbootstrap.com/ . Походи по сайтам и погляди на то, как используется. В 99 процентов случаев это уже кастомные компоненты (но не в духе перебивания CSS, а нормальные компоненты, построенные на самом Bootstrap)

Читай устройство сетей. Ты должен в мельчайших подробностях знать как всё работает. После этого уже имеет смысл смотреть конкретные эксплойты. Разбирать их и понимать, что там происходит и главное почему. Уже потом сможешь спокойно понимать, какую литературу искать.

Если будешь учиться по ютубу, то научишься эксплуатировать то, что уже давно закрыто и вряд ли сам когда-нибудь проверишь

https://www.typographicposters.com/posters

Верстай, сколько душе угодно

В принципе необходимо понимать объекты, массивы, их обходы, функции, DOM. Разбираться в деструктуризации. Но надо не думать о переходе на Реакт, а просто перейти. Это своя концепция, а не какой-то новый язык

Перевод документации немного исковеркал смысл.

Здесь имеется в виду возможности по выводу кода внутри тега code. В одну строку (инлайн) или в несколько строк.

https://getbootstrap.com/docs/4.5/content/code/

Вначале вполне сойдёт перевод. Наберётесь основных терминов оттуда, и тогда сможете легче читать оригинальную документацию.

P.S. качество перевода не знаю

Можно использовать анимацию и установить задержку через animation-delay

А по документации пробовали?

Можешь сделать по такому принципу (я только заменил onsubmit на click для удобства)

const form = document.forms.cargoData;
  
  
  form.addEventListener('click', function(e) {
    e.preventDefault();
    const chooseService = form.chooseService.value;
    console.log(chooseService)
  });

И поменяй у формы action на name

Используйте позиционирование. position: relative и bottom: -100px (условно)

Проверьте все подключения на странице. Скорее всего где-то осталась ссылка по http. Это может быть всё что угодно: картинка, стили, скрипты.

После того, как ты пропишешь селектор и поставишь фигурную скобку, редактор её автоматически закрывает