Как сделать такие колонки, при помощи FLEX?

Такое можно сделать через column-count, изучив все его нюансы.
https://qna.habr.com/q/565843
https://ru.stackoverflow.com/questions/608316/colu...

Как изменить цвет, размер текста input'а при вводе текста?

В css есть событие focus. Можно попробовать его использовать.
https://jsfiddle.net/x4u21ae3/

Как можно реализовать данный блок?

Vlad Серьезно?
Расположить с помощью Flex. Изучить Flexbox, посмотреть как устроен Bootstrap, например и сделать так же или лучше. Этих шагов будет достаточно, чтобы расположить элементы внутри этого блока.

Как это сделано, смена текстур на фото в конструкторе кухни?

Вижу, что jpg уже сделан. Его можно брать и использовать в сочетании с background-repeat: repeat; Визуально большинство существующих картинок подойдет для этого.

Как это сделано, смена текстур на фото в конструкторе кухни?

Можно и в SVG, если есть такие исходники и умение грамотно работать с SVG

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

form.submit();
https://learn.javascript.ru/forms-submit

document.getElementById('form').addEventListener('submit', function(e){
    var modal = document.querySelector('[class="modal open"]');
    modal.classList.remove('open');
})

Как-то так

Адаптивный Tabs на css, при клике раскрывает контент, а как сделать чтобы по клику закрывало контент?

Через css только через жуткие костыли. В идеале нужно такие вещи через js делать, без всяких лишних элементов, типа radio. Так будет более предсказуемый результат.

Уместно ли в таких ситуациях использовать figure & figcaption?

С figcaption тоже хорошо будет. Можно еще микроразметку добавить, если хочется семантики и побольше.

Уместно ли в таких ситуациях использовать figure & figcaption?

Через counter можно задавать порядковые номера не только для ol

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

Можно попробовать убрать. Не помню, для чего оно в подобном случае, но в похожих вопросах его часто упоминали.

Как сделать такой border?

Есть разные пути сделать border c градиентом.
https://css-tricks.com/gradient-borders-in-css/

Почему для телефона и gogle chrom'а стили работают правильно, а для opera нет? И как это исправить?

Стрелка добавляется стилями. Через background-image, например. Примерно так
https://jsfiddle.net/cyvf7nwh/

Почему для телефона и gogle chrom'а стили работают правильно, а для opera нет? И как это исправить?

appearance может помочь
https://css-tricks.com/almanac/properties/a/appearance/

Как правильно вставить сторонний CSS в Битрикс?

Можно средствами Аспро вставить свой код css

Как реализовать такую задачу?

Подозреваю, что нужно убрать пробел у
.logo-box :before {}
Должно быть так
.logo-box:before {}

Почему не работает @media (min-width: 640px) в почтовых шаблонах?

Адаптивность в email можно делать с помощью max-width. Будет работать там, где нет медиа запросов. В приложении Gmail на смартфонах, например.
https://webdesign.tutsplus.com/ru/tutorials/creati...

Как сделать прокрутку контента в div, если html, body имеют overflow-y: hidden?

Возможно. В любом случае такого быть не должно.

Как сделать прокрутку контента в div, если html, body имеют overflow-y: hidden?

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

Как сделать прокрутку контента в div, если html, body имеют overflow-y: hidden?

Если контент не превышает высоту блока, то и нет необходимости в прокрутке. Все правильно работает.

Как сделать прокрутку контента в div, если html, body имеют overflow-y: hidden?

Прекрасно прокручивается контент любого размера внутри блоков
https://jsfiddle.net/28jundcz/1/