Задача: Сверстать адаптивный сайт с поддержкой светлой и тёмной темы. Тема должна переключаться автоматически по системным настройкам пользователя, а также вручную через интерфейс. Моя роль: Frontend-разработчик. Отвечал за вёрстку, адаптив и систему тем. Что делал: — Сверстал страницу по методологии Mobile First — Настроил CSS-переменные для цветовых схем — Реализовал автоматическое переключение темы через prefers-color-scheme — Реализовал ручное переключение через классы .theme-light, .theme-dark, .theme-auto на — Использовал Grid и Flex для сложных макетов (шапка, секции, галерея) — Реализовал декоративные элементы через псевдоэлементы (уголки, точка у надписи "REC") — Настроил адаптивную типографику с clamp() для заголовков — Реализовал фоновое изображение с background-attachment: fixed и background-size: cover — Настроил состояния кнопок переключения темы (активная кнопка с pointer-events: none) — Скрыл декоративные элементы от скринридеров (aria-hidden) Стек: HTML5, CSS3, Flexbox, Grid, CSS-переменные, медиазапросы, prefers-color-scheme, clamp(), Figma. Результат: Адаптивный сайт с поддержкой светлой и тёмной темы, переключением по системным настройкам и вручную. Готовое решение для блога или лендинга.