Как поместить иконку повех артикля?

Иконка - псевдоэлементом.
Позиционирование - абсолютом.

Как сделать переход в tabs?

Вы же сами задали серый бордер со всех 4х сторон у активного tab border: 1px solid #D2D2D2;
Если он справа не нужен, так и не задавайте его или задавайте прозрачным.

Почему могут не работать кнопки для swiper thumbs?

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

Вряд ли получится.

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

Pavel2345, я не уверена, что сравнивание с образцом и выковыривание недостающего будет проще. Про лучше вообще промолчу.

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

Нужно понимать, что скопировать вы можете только фронт часть, да и ту часто только криво.

но полетела верстка под телефон. Можно этот как-нибудь пофиксить?

Дописать/докопировать/заказать стили от мобилок.

Как называется такой эффект с шапкой сайта?

jarderRek, да, просто изменяются классы хедера

Как называется такой эффект с шапкой сайта?

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

Как называется такой эффект с шапкой сайта?

Самая простая реализация это position: sticky
На сайте примере с помощью js.

Или вы про анимированный фон?
https://www.vantajs.com/?effect=net

Как перенести картинки на следующую строку?

Pavel2345,
замените на

<?php
  $loop = CFS()->get('work_examples');
  foreach ($loop as $row){
    ?>
<a href="<?= $row['work_example_img'] ?>" data-gal="prettyPhoto[2]"><img src="<?= $row['work_example_img'] ?>" alt="Процесс монтажа отопления частного дома - дымоходы" width="200" height="150"></a>


      <?php
  }
  ?>

И найдите, где вокруг всего этого table и замените на div или section.

Дальше обертке задаете класс.
А класс стилизуете.
Флексами или гридами, как удобнее.

Таблицами раскладки не делают больше 10 лет.

Как перенести картинки на следующую строку?

Таблица это реально table? Зачем?
Просто выводите подряд img или img в обертках figure.
А потом раскладывайте как хотите флексами или гридами.

Как сделать обводку для текста?

типа того

color: black;
      -webkit-text-stroke: 1px rgba(255, 255, 255, 0.8);
      -webkit-text-fill-color: rgba(0, 0, 0, 0.3);

Почему при работе с несколькими группами radio, работает корректно только последняя группа?

1. Не очень понятно, зачем вы сделали form01 абсолютом. Собственно, из-за этого и проблемы: этот блок перекрывает другой.
Достаточно флексов или гридов.

2. display:none для input - это не доступное скрытие. Гуглите "паттерн visually-hidden" и смотрите видео Вадима Макеева Кастомные чекбоксы правильно

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

Попробовал - нашел вторую проблему сверху от картинки еще есть заголовки, а они то не перемещаются и получается, что если я смещаю картинку на 100px вниз, то там получается разрыв на 100px

Сначала нужно определиться от чего зависит положение градиента.

Например, если "всегда 100px от низа картинки", то просто гридами.
Если от чего-то другого, то решение скорректировать.

Как сделать, чтобы при выборе менялся флаг страны?

Проще всего флаг сделать по классу и фоном псевдоэлемента. А не двумя дивами.
И разметка проще и кастомному селекту тоже. Просто кроме текста возьмете и класс.

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

Даже интересно, как это связано с градиентом

Как сдвинуть псевдоэлемент ниже?

Если подписи в одну строку, то проще всего добавить для псевдо

display: inline-block;
vertical-align: middle;

Если нет, то абсолютами либо флексами или гридами.
В случае флексов или гридов, нужно либо быть уверенным, что в тексте нет тегов (span, strong, br и т.д.) либо использовать доп обертку для текста.

Сами иконки выгоднее вставлять в background, а content оставлять пустым. Так проще управлять размером.

Как выровнять ячейки по центру и зафиксировать?

newokek, покажите в песочнице на codepen.io как так оно вам не помогло.
Если что, это для обертки этих инпутов.

Что делать с таким фоном?

IIIu6ko, можно и так, сохраните десяток вариантов для разных media и ретины и пойдет.

Что делать с таким фоном?

IIIu6ko, я же написала про блюр и тормоза.
Если тормозов нет, то и норм.

Почему не работают падинги?

Mark321,
Это у вас блок малоадаптивный. Ширина фиксирована, высота ограничена. Сделаете сам блок адаптивным, будет хорошо.

Размер текста определяется блоком.
Количество строк да, указываете вы.
Но можно макс высоту указывать в em с учетом line-height, чтобы ровненько всё было.