Как сделать блок такой же формы?

ksnk, да и не обязательно :)
Это я на коленке, не заморачиваясь ни на выравнивание градиентов ни на эллипсы для получения нужной фигуры. Чисто показать возможности, раз уж такой разговор.
Если заменить уголки на svg будет аккуратнее.

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

https://css-irl.info/positioning-text-along-a-path...
И целая коллекция примеров к статье https://codepen.io/collection/XOOoWv

Как отключить swiper-bundle.min.css?

Как отключить swiper-bundle.min.css?

Тут хорошо бы узнать как вы его подключили и почему не можете отключить.

не могу установить свои стили

Нужно проверить, что сначала подключены стили слайдера, а потом ваши. Не важно как именно всё это собирается.

Потом указывать свои селекторы с такой же или с большей специфичностью, как и у свайпера.

Как перенести лендинг на WordPress у которого НЕТ базы данных?

Взять новый WP с базой, дополнить нужными плагинами, если они там реально использовались. Аккуратно прикрутить поверх этого лендинг.
Правда пока не ясно зачем там вообще WP.

Мулти селект Dropdown. Как можно создать многослойный мулти селект?

Вам же захочется это как-то красиво стилизовать, а значит, всё равно придется скрывать селекты.
Поэтому можно сразу делать обычные выпадашки с чекбоксами.
Только не забывайте скрывать чекбоксы доступно, а не через display none.

Как сделать блок такой же формы?

просто сделай "пипку" чуть утопленным центрированым псевдо-элементом фиксированной ширины и не придётся пересчитывать path.

Да даже и не фиксированной ширины. Фиксацию пропорций убрать из SVG и пусть подстраивается под размер псевдика, если вдруг нужен адаптивный размер.

Для такой формы и clip-path избыточен. Не говоря уж про JS.

Возможен ли отступ только второй строки CSS clamp?

comm1ted, я вроде написала как это сделать прямо кодом. Что не получилось?

Делаю кастомный калькулятор на Tilda, как по клику на картинку выбрать нужную галочку?

Не знаю, что там в Тильде, но в обычном HTML для этого есть label.

Как лучше сверстать элемент?

Newto, как вы собираетесь делать зависимые столбцы флексами? Вообще ни разу не удобно, если не задавать размеры. А задавать тут размеры фу-фу.

Как сделать блок такой же формы?

Приставьте псевдо с SVG, в чем сложность-то?

Как лучше сверстать элемент?

Начать хорошо бы с того, что табличная верстка не исключает гридов.

Семантично - таблицей.
А дальше как угодно.

Как сделать плавное появление скрытых под display: none; карточек по клику на кнопку, при подключеной AOS?

Полина Емельянова, у меня работает. После нажатия на кнопку карточки появляются постепенно по одной.
Или надо не так?

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

Возможно потребуется разобраться с вот этим

[data-aos^=fade][data-aos^=fade].aos-animate {
    opacity: 1;
    transform: translateZ(0);
}

потому что оно может перетирать трансформ из .hide

Как сделать плавное появление скрытых под display: none; карточек по клику на кнопку, при подключеной AOS?

Что-то такое?

.section__item {
    transform: scaleY(1);
    opacity: 1;
}
.hide{
   //display: none;
  opacity: 0;
  transform: scaleY(0);
}

Как с помощью CSS при наведении курсора менять цвет рамки сразу у нескольких карточек?

Такой же вопрос
Как добиться такого эффекта при наведении?

Как правильно должна масштабироватся верстка сайта на десктопе?

Онотолий,

Но сидеть перед такими огромными мониторами наверное для зрения не очень хорошо

Ну конечно, а перед маленькими полезно.

Как правильно должна масштабироватся верстка сайта на десктопе?

Разве сайт не должен плюс/минус одинаково выглядеть на десктопах с разным разрешением экрана?

Нет.
Кому должен? Кто это придумал?
И что значит одинаково? Иметь фикс ширину и поля или масштабироваться?

Вам стоит изменить теги вопроса и оставить только дизайн. Потому что верстка это уже реализация задуманного и вопрос не имеет к этому отношения.

Да, могут быть сайты, где это уместно. Какие-нибудь промо странички.
Но текстовые поля шире обычной книги читать очень неудобно, шея поломается.

Разве сложно верстальщикам добавлять с css стили что то вроде этого как делаю я (см. ниже), а так же размеры всех элементов делать не в px а в em или я просто чего то не понимаю?

Это не сложно. Это неверно. Потому что вовсе не все размеры зависят от текущего размера шрифта. Это раз.
Даже размер шрифта для разных элементов не обязан увеличиваться пропорционально. Это два.
Макет должен быть готов к увеличенному шрифту в браузере пользователя при такой записи. Это три.

Попробуйте сесть перед монитором в метр шириной и сделать на нем этот сайт так, как вы хотите, без полей. Будет удобно? Вообще нет.

Как исправить вёрстку, чтобы блок с изображением не уезжал из-за блока с описанием?

meta941,

а что в media плохого?

Абсолютно ничего плохого в нём нет.

Просто есть варианты получить адаптив одной строкой.
Например,
font-size: clamp(16px, 2.5vw, 30px);
Шрифт будет зависеть от вьюпорта, но не меньше 16px и не больше 30px.
Можно использовать более сложные формулы, чтобы 16 не наступило слишком рано.

Как исправить вёрстку, чтобы блок с изображением не уезжал из-за блока с описанием?

meta941,

Если не бутстрап, то какие есть ему аналоги, если хочется пользоваться весьма удобной сеткой? Кроме CSS-Grid.

Весьма удобно верстать на чистом CSS.
Фреймворки гуглятся и выбираются на свой вкус.
А главное, ошибочная идея думать, что фреймворк позволит не изучать основы верстки.

Вот в этом и проблема - я вообще не понимаю, где люди находят информацию о том, как правильно верстать в нынешнее время.

Там же, где и в предыдущее. Гугл, MDN, ютуб, спека наложенные на базовую школьную геометрию.
С "правильно" тут сложнее, потому что абстрактного правильно практически нет. Есть задача и её нужно решить. Обычно, соблюдая ещё правила доступности и тому подобные полезности для пользователей.

Пока что нашёл только способ делать object-fit: contain, но это же ведь не панацея?

Для контентных изображений? Вполне себе панацея. Contain или scale-down, если нужно.

Указываешь размер в пикселях - всё съезжает и адаптива 0

Да, логично. Какой уж тут адаптив...

Указываешь в процентах - оно не работает

Значит, не тому задаете проценты. (В верстке для разных свойств проценты считаются от разных величин. Яркий пример: вертикальные отступы в процентах считаются от ширины родителя, а не от высоты, как хотела бы банальная логика)
Обычно адаптивные изображения оборачивают в div, работают с его размерами, а картинке object-fit.
В качестве обертки в теории можно использовать ячейку грида, но нужно быть уверенным, что она никуда не денется. В смысле, родитель внезапно не перестанет быть гридом.
Также не забываем про picture.
По дороге задает для picture и source display: contents, чтобы не мешались в гридах.

Указываешь в единицах размера текста - так текст ведь не уменьшается при изменении размеров.

Не напишете, чтобы менялся - не поменяется. Напишете - поменяется.

О каких правилах идёт речь? Я не представляю этого от слова совсем.

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

===

В современном CSS есть много удобных штук для адаптива, кроме стандартного @media.
Флексы, гриды.
Единицы измерения зависящие от вьюпорта (разнообразные).
Функции min, max и clamp.

Как исправить вёрстку, чтобы блок с изображением не уезжал из-за блока с описанием?

всё это, предположительно, должно быть в одной строчке.

К черту бэкенд, фронтэнд, давайте вернемся в школу.
Вы пишете, что всё должно быть в одной строке. Смотрим в код: там 4 блока
200px
col-lg-6
col-lg-3
col-lg-3
Каким, по-вашему, образом оно должно поместиться в одну строку?

Едем дальше: блок для выбранного изображения имеет класс col-lg-6, т.е. 50% (забудем на время про бутстрап и его фокусы с gap, когда уже давно не нужны эти извраты). Но внутри лежит картинка с фикс шириной и отсутствием правил для адаптива.
По вашему скрину в вопросе, она должна занимать не половину всего блока, а половину блока со слайдером. Ну тогда надо попасть разметкой одним в другое.

И т.д.
Разбирайтесь кто кому родитель и что там всё таки с шириной.

Как лучше отобразить создаваемый нажатием div в grid контейнере?

JuniorPro,

grid div card просто создается как 8-й div и раздвигает 1-й div недели под свою ширину

Так растяните его на всю ширину, а не на одну ячейку.
Где ваш код в песочнице иллюстрирующий проблему?

Со скрином снова какая-то лажа. Нарисовано, что выбрано 12, рядом в коде chosen у 13. Что значит синий блок?