Как поменять значение Руб?

Задайте для .item-meta display: flex, а для .price span задайте order: 1

Как растянуть один grid-div на всю ширину?

1. Прочитайте про grid-template-columns и его возможные значения.
2. Прочитайте про единицы fr

Либо используйте флекс и margin-left auto, учитывая, что судя по скрину вам нужно, чтобы блок был справа, а вовсе не растянулся на всю ширину.

Здравствуйте. Как можно реализовать сценарий, когда наводя курсор на кнопку у картинки сверху появлялся background определенного цвета?

htmlbook.ru/samcss/kontekstnye-selektory и дальше по оглавлению.
За наведение отвечает псевдокласс :hover

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

clip-path

Как лучше центрировать фиксированный контент внутри блока?

What have you done, да без разницы.
Только нужно точно быть уверенным, что там вообще нужно столько оберток.
Но по вашему описанию этого не понять.

Как лучше центрировать фиксированный контент внутри блока?

Можете объяснить, почему не хотите использовать свойства флекса раз уж родитель флекс?

Как подключить Яндекс карту адаптивно?

Сделайте песочницу, чтобы было видно, что вы ставите ширину 100% и вообще всю проблему.

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

Можно как-нибудь попробовать на базе этого https://jsfiddle.net/Ankhena/5jecmvw0/
С моноширным шрифтом легко. С немоноширным как-то вычислять точку перехода градиента.

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

Илья Деревянных,
при скролле страницы чтоль?

Как изменить класс элемента при прокрутке страницы на 50 (условно) px?
Если да, то так и гуглите.

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

От начала чего?

За внешние отступы отвечает свойство margin.

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

cracker-test, нужно открыть справочник https://developer.mozilla.org/ru/docs/Web/CSS/back... и выбрать подходящее значение. Я не знаю, какое вам нужно, потому что вы не рассказали как именно она должна подстраиваться.

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

Размер фоновой картинки регулируется свойством background-size.

Когда я указываю высоту и ширину картинки 100%

Вы задаете размера блока, а не картинки.
Если проценты считать не от чего, то блок становится нулевого размера. Ширина у него, скорее всего, остается по ширине блока слайдера. а высота становится нулевой.

Соответственно, вам нужно определиться, что от чего зависит. Блок от картинки, картинка от блока или они вместе от размеров слайдера или от каких-то пропорций и т.д. В общем, самая простая геометрия.
А потом всё это записать в CSS.

Как правильно формулировать классы по бэм?

https://ru.bem.info/methodology/redefinition-levels/

Как правильно писать css c помощью sass по БЭМ?

и там мне очень понравилась вложенность, везде ее лепил то-есть структура css у меня получилась такая же как и в html

Так делать не стоит ни в CSS ни в препроцессорах.
Большая вложенность приводит к повышению специфичности, а значит, к потенциальным проблемам при переопределениях.
БЭМ как раз заметно сокращает потребность во вложенностях.
Если у вас есть элемент .block__elem, то уже и так понятно, что он лежит в блоке .block и больше нигде.
Это #details-bouncy #details-bouncy-markers div, конечно жестоко. Вы попросили браузер найти сначала все div на странице, потом проверить лежат ли они в #details-bouncy-markers. Это уже не лучший ход. Так потом ещё нужно пойти выше по дереву и проверить, лежит ли это всё в #details-bouncy.
Вместо этого можно было бы задать одинаковый класс этим div и использовать простой селектор типа .class {}. Ну или в БЭМ версии .block__elem {}
Ну кроме того, что эти картинки вообще не контентные, а украшения. А украшения делают фонами и/или псевдоэлементами с помощью стилей.

так же я использовал очень много id что тоже не верно?

id для стилизации используют очень редко, во многих кодгайдах это просто запрещено. id нельзя переиспользовать на той же странице и опять таки повышение специфичности.

p.s.
1. Вы смотрели свой сайт при ширине окна больше макетной? Есть прелюбопытные моменты.
2. Высоту в верстке задают очень редко. Мы никогда не знаем сколько будет контента. Используйте отступы и/или мин макс высоту, если она зачем-то нужна.
3. Не забывайте проверять код валидатором.
4. <h2>O U R&nbsp;&nbsp;&nbsp;S E R V I C E S</h2>
В разметке текст хорошо бы писать так, чтобы его нормально могли прочитать экранные дикторы. Представьте, как может быть прочитан вот этот.
Для увеличения расстояния между буквами есть свойство letter-spacing.
5. Ну и т.д. про семантику, контентные картинки и украшения, лишние теги... Хватит пока.

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

Как изменить размер SVG-картинки в CSS?

Divviner, тогда всё отлично :)

После отправки формы сайт начинает ломаться, как это исправить?

DaniilPo,

что она по идее чиста

покажите кусок кода, который отвечает за эту идею.

После отправки формы сайт начинает ломаться, как это исправить?

DaniilPo,

и к тому же то сообщение возникающие при попытки обновить страницу никуда не исчезнет в таком случае

Нет, конечно, не исчезнет, это браузерное оповещение. Очищайте поля после успешной отправки.

Как прописать классы в php коде?

Атрибуты в HTML пишутся в кавычках

И это class=height:70px; вообще не класс, а style.

После отправки формы сайт начинает ломаться, как это исправить?

Скорее всего незакрытые или лишние теги.
Проверьте страницу валидатором и исправьте ошибки.

Как передавать в переменной CSS значение свойства inherit?

Михаил Р., нет, вы уже в root пытаетесь сказать, что нужно взять предыдущее значение. А его нет и быть не может.