Дизайн-система
Единый источник элементов petukhov.pro: цвет, типографика, отступы, поверхности, кнопки, поля. Меняешь токен в variables.scss — меняется на всём сайте.
Цвет
Типографика
Heading 1 · hero
Защита бизнеса
Heading 2 · секция
Наши услуги
Heading 3
Подзаголовок блока
Subtitle
Крупный вводный текст
Body Large
Основной текст увеличенный для акцента.
Body
Основной текст параграфа на странице.
Small
Вспомогательный мелкий текст, подписи.
Caption
Самый мелкий служебный текст.
Отступы · 4-кратная сетка
space-14px
space-28px
space-312px
space-416px
space-520px
space-624px
space-832px
space-1040px
space-1456px
space-1664px
Радиусы
sm
md
lg
xl
pill
Тени
sm
md
lg
Liquid Glass
light
dark
bronze
Кнопки
Наведи курсор — у каждой кнопки своё hover-состояние.