В CSS только во обратную сторону, если вы изначально зададите переменные, а потом будете собирать из них цвет.
Получить можно с помощью препроцессора или js.
Андрей Гуртовой, не путайте масштаб с увеличением шрифта.
При увеличении масштаба, да, всё изменится пропорционально.
При увеличении шрифта изменится только шрифт (при условии, что он не был задан жестко в px)
JackShcherbakov, было бы здорово, если бы вы поделились от чего он смещен вправо и как должен быть размещен.
С другой стороны, без разницы, не стоит тратить время на выяснение что из внутренностей блоков там торчит и какие вертикальные отступы мешают.
На чистом CSS добавить класс нельзя, но скрыть можно.
1. В самом начале body пишете инпут чекбокс.
2. Ваша кнопка "закрыть" это лейбл от этого инпута
3. Дальше нужно построить селектор от input:checked до модального окна через ~ или +
И прописать 2 состояния для блока модального окна при чекнутом инпуте и при нечекнутом.
есть background-position
для размеров background-size, для адаптивности задаете в относительных единицах измерения
если этого недостаточно, то еще @media условия
Например, размер логотипа (или его обертке) и flex-shrink его обертке. flex: 1 блоку с текстом