# AVAT — «Глубина». Брендбук сайта v1.5

Рабочая система для первой главной и следующих страниц. Направление зафиксировано командой: **первоначальный айсберг с водой**. Подтверждены **Depth #111C23**, **Paper #F6F7F7**, **Oxide #7A4037** и тёплый латунный материал с базой **#A07436**. В версии 1.5 от 26 сентября 2026 года расширена библиотека материалов для услуг, кейсов и статей: кристалл, базальт, сатинированная латунь, минеральный Oxide и сдержанный песчаный рельеф. Правила композиции заголовков, ритма страницы и редких латунных акцентов сохраняются. Утверждённая пара шрифтов — **Geologica + Inter**. Визуальная презентация и полная методичка объединены на одной странице раздела «О компании»; этот файл остаётся редактируемым источником правил.

**Статус решений:** айсберг, вода и единая геометрия логотипа сохраняются. **Geologica + Inter утверждены.** Oxide и латунь подтверждены командой. Manrope и остальные семейства сохранены только в архиве сравнения. Бронза — архивная альтернатива; на одном экране не смешиваем два металла. Архивный архитектурный макет остаётся цветовым референсом, не заменой айсберга. **Oxide Mist больше не применяется как фон разделов, цитат и CTA:** его розоватая подложка не соответствует выбранному характеру.

## 1. Визуальная идея

Снаружи — ясный продукт. Внутри — маркетинг, архитектура, инженерия и защита. ИИ ускоряет работу; за качество и результат отвечают люди. Стиль выражает глубину, спокойную уверенность и точность.

Эталон — `assets/approved-reference.png`, исходный макет без изменений. В `assets/hero-water.png` сохранена та же сцена с водой, очищенная image_gen от надписей для вёрстки. Это техническая производная эталона, не новое направление. При споре о форме, свете и композиции сравниваем с исходным макетом. Новый вариант внутреннего айсберга и четыре альтернативные метафоры не применяются.

## 2. Логотип: один мастер

**Единственный мастер — `logos/avat-master.svg`.** Он векторный, не набран шрифтом. Четыре знака: А без перекладины, V, А без перекладины, T. Не вводим кириллический вариант и не перепечатываем его текстом.

- ViewBox 332 × 78. Масштабирование только пропорциональное.
- Толщина штриха 5,4 в координатах мастера. Не редактировать для меню или footer.
- Геометрия мастер-файла: `M12 66 40 10 68 66 M96 10 124 66 152 10 M181 66 209 10 237 66 M264 10H320 M292 10V66`.
- `avat-ink.svg` и `avat-light.svg` — тот же мастер, меняется только цвет. Это не разные логотипы.
- На светлом фоне Ink #20282C; на тёмном Ice White #F6F7F7.
- В меню ширина 135 px на desktop, 105 px на телефоне. Рекомендованный минимум полного слова — 104 px. Если места меньше, меняем компоновку меню, а не сжимаем знак.
- Охранное поле — не менее ¼ высоты всей SVG-области со всех сторон. В тесном меню соблюдать минимум 12 px.
- Не растягивать, не скруглять углы, не утолщать, не добавлять перекладины А, градиент, тени или объём.
- Большой полупрозрачный знак может быть частью фоновой композиции с непрозрачностью 4–6%; он не заменяет основной логотип.
- Кристалл в форме арки — иллюстрация, не второй знак и не favicon. Новый самостоятельный символ не утверждён.
- Редакционное название в тексте — **AVAT** или **AVAT Studio**, набранное основным текстовым шрифтом. Это упоминание компании, не замена логотипа.

## 3. Два шрифта

### Утверждённая пара — Geologica + Inter

**Выбор команды: Geologica 400/500 для заголовков и Inter 400/500/600 для текста и интерфейса.** Основные начертания заголовков — Regular и Medium. Geologica 600 допускается только для короткого акцента, не для всей страницы.

- Geologica 400 — первый экран, крупная фраза, крупные цифры.
- Geologica 500 — H2/H3, названия услуг и кейсов.
- Geologica 600 — короткое выделение, когда одного контраста недостаточно. Не набирать им длинный SEO-заголовок.
- Оси зафиксированы: `SHRP 50`, `CRSV 0`, `slnt 0`; насыщенность меняется через `font-weight`.
- Заголовки всегда прямые. Наклонные оси Geologica не используются в фирменной системе. Не включать искусственный italic, transform-skew или шрифт с засечками для одного слова.
- Локальные мастер-файлы — `fonts/geologica.woff2` и `fonts/Geologica[CRSV,SHRP,slnt,wght].ttf`. Лицензия — `fonts/Geologica-OFL.txt`.

Шрифт должен поддерживать айсберг и содержание. Узнаваемый рисунок, точные интервалы и масштаб дают характер; декоративная сложность в каждом слове не нужна.

Onest, Unbounded, Exo 2 и прежний Manrope остаются в сравнительном разделе и истории. **На новых страницах их не подключаем.** Рабочая страница загружает только Geologica, Inter и отдельный настоящий Inter Italic. Кириллица и символы проверены в `font-options/VERIFICATION.json` и `fonts/VERIFICATION.json`.

### Текст и интерфейс — Inter

Inter 400 — абзацы, описания и формы. Inter 500 — навигация, кнопки, подписи полей. Inter 600 — короткое выделение, имя автора, ключевой факт. Для абзацев запрещён сплошной 600/700.

Inter Italic 400 — настоящий курсив для короткой цитаты или редакционного выделения внутри основного текста. При необходимости имя/акцент в такой цитате допускает Inter Italic 500. Курсив не используется в меню, кнопках, таблицах, цифрах KPI и крупных заголовках.

Сочетания:

| Ситуация | Заголовок | Текст |
| --- | --- | --- |
| Первый экран | Geologica 400 | Inter 400, CTA Inter 500 |
| Раздел услуги | Geologica 500 | Inter 400, короткие strong 600 |
| Кейс | Geologica 500; показатели 400/500 | Inter 400; подписи 500 |
| Отзыв | Имя Inter 600 | Inter 400; короткая цитата допустима Inter Italic 400 |
| Статья | Geologica 500 | Inter 400, strong 600, настоящий italic 400 |

Обязательны `font-synthesis: none` и реальные файлы начертаний. При ошибке загрузки сначала восстанавливаем файлы, а не разрешаем браузеру рисовать наклон или жирность.

Проверены русские прописные и строчные буквы, Ё/ё, Й/й, ₽, №, тире и кавычки. Результаты: `fonts/VERIFICATION.json`. В визуальном брендбуке есть живые строки с разными весами и курсивом. На Windows и Android возможны отличия сглаживания — геометрия и начертания остаются теми же.

### Размеры и набор

| Элемент | Desktop | Телефон | Интерлиньяж / трекинг |
| --- | --- | --- | --- |
| H1, главная | 68–100 px | 35–62 px по ширине | 1.08 / −0.035…−0.045em |
| H1, услуга/кейс | 56–80 px | 36–44 px | 1.1 / −0.035…−0.045em |
| H2 | 42–66 px | 30–34 px | 1.15 / −0.025…−0.035em |
| H3 | 24–34 px | 22–28 px | 1.2 / −0.03em |
| Основной текст | 16–18 px | 15–16 px | 1.6–1.75 / 0 |
| Компактные описания | 13–14 px | 13–14 px | 1.65 / 0 |
| Служебная подпись | 11–12 px | 10–12 px | 1.5 / +0.08…0.15em |

Строчные абзацы — максимум 65–75 символов в строке. Не разрежать кириллические абзацы. Капитель допускается только в коротких служебных подписях. Не разрывать слова искусственно. На широком экране H1 не должен заходить на объект. Длинный SEO-заголовок адаптируем переносами и размером, не сокращением содержания.

### Композиция заголовков — обязательное правило

- Заголовок раздела занимает всю доступную ширину контентного контейнера с сохранением полей. Его не ограничивают левой половиной сетки, чтобы поставить описание справа. «Во всю ширину» означает пространство для текста, а не растяжение букв.
- Подзаголовок или вводный абзац располагается **под заголовком**, с читаемой длиной строки. Порядок: служебная подпись → большой заголовок → объяснение → содержание.
- Переносы следуют смысловым группам. Не оставлять одно короткое слово в последней строке: «…поискать другого / подрядчика» — ошибка; «…кому лучше / поискать другого подрядчика» — возможная осмысленная композиция.
- Сначала дать заголовку нужную ширину, затем подобрать масштаб и баланс строк. Использовать `text-wrap: balance`, при необходимости — осмысленные переносы для конкретного размера экрана. Короткая неразрывная группа допустима только когда не создаёт переполнение на телефоне.
- Не обрезать заголовок маской, фиксированной высотой, многоточием или `line-clamp`. Не вставлять искусственные дефисы, не выкидывать и не переставлять слова SEO-заголовка ради вёрстки. Проверять отсутствие склеенных слов вокруг `<br>`.
- Первый экран с крупным арт-объектом и компактная карточка — осмысленные исключения: заголовок использует полную ширину своей области. Описание всё равно следует под ним. Исключение не становится стандартом всех разделов.

## 4. Цветовая система

| Токен | HEX | Роль |
| --- | --- | --- |
| Ice White / paper | #F6F7F7 | Основной фон страницы и светлый текст на тёмном |
| White | #FFFFFF | Чистые смысловые паузы, формы и отдельные поверхности |
| Mist | #E8ECEE | Вторичная поверхность, подложки реальных интерфейсов |
| Ink | #20282C | Заголовки, основной текст, основные кнопки |
| Muted | #5C6A71 | Подписи, вторичный текст на светлом |
| Line | #CCD3D7 | Разделители и границы, не мелкий текст |
| Depth | #111C23 | Тёмные главы, заключительный CTA, фон сложной сцены |
| Depth Text | #EEF2F3 | Текст на тёмном фоне |
| Steel / link | #415D6A | Ссылки, активные состояния, фокус |
| Ice Light | #D5E7EE | Блик и светлая подсветка внутри тёмной сцены |

Основной объём сайта — светлый, но длинная страница не превращается в непрерывную белую ленту. Paper, White и Mist формируют спокойную основу; Depth объединяет инженерные разделы в цельную главу; одна насыщенная поверхность Oxide или Oxide Deep отмечает важный смысловой поворот. Чередование подчиняется содержанию, а не правилу «следующий блок — другой цвет». Реальные кейсы, фотографии, масштаб и свободное место создают дополнительные остановки для взгляда. Сам айсберг получает контраст за счёт материалов и света, без цветных неоновых свечений.

**Depth — цвет тёмного блока со скриншота команды.** Это #111C23, не Ink #20282C. Paper — прохладный почти белый #F6F7F7. Эта пара принята как основа. Визуализация реальных проектов, фото людей и видео сохраняют свои цвета. Не перекрашивать работу клиента ради монохромности.

### Тёплый акцент из «Дюны»: Oxide

Референс — архивный концепт «Вы управляете. Система работает», файл `assets/dune-reference.png`. Его красно-коричневые стены дали направление оттенка. Oxide — адаптация материала для интерфейса, не точная пипетка с освещённой стены. Архитектурный зал не заменяет выбранный айсберг.

| Утверждённый токен | HEX | Применение |
| --- | --- | --- |
| Oxide | #7A4037 | Основной CTA, выбранный пункт, одна осмысленная насыщенная поверхность со светлым текстом |
| Oxide Deep | #4B2926 | Hover основного CTA или глубокая акцентная глава со светлым текстом |
| Oxide Mist — архив | #EEE1DC | Сохранён только для истории палитры. Не использовать для фона разделов, цитат, карточек или CTA |

Контраст Oxide / Paper — 7,48:1, Oxide / White — 8,03:1. Эти пары подходят для обычного текста по порогу 4,5:1. Светлая розоватая подложка Oxide Mist исключена из активной композиции; для спокойного фона использовать Paper или Mist, для тёплого акцента — насыщенный Oxide / Oxide Deep. Не переносить Oxide на Depth для мелких надписей: там нужен светлый текст.

### Латунь: материал, а не один HEX

По референсу команды выбран сатинированный латунный материал с медным подтоном: базовый тон **#A07436**, тёмная тень и мягкий светлый блик. Он сочетается с Depth и оживляет холодные поверхности. Полный диапазон отражений и позиции градиента сохранены в `design-tokens.json`. Прежняя бронза остаётся архивной альтернативой. Не использовать два металла на одном экране.

Латунь — редкая ценная деталь: тонкое подчёркивание, короткий разделитель, узкая кромка или небольшой фрагмент материала. **Не окрашивать латунью целое слово, строку или крупный заголовок.** Заголовки и основной текст остаются Ink на светлом и Depth Text на тёмном. Латунь не используется в логотипе, всей навигации и каждой кнопке. Допустимо изредка выделить короткую служебную подпись на Depth плоским оттенком `#C69752` из утверждённого материала, при контрасте не ниже 4,5:1. Градиент — только для нетекстовых деталей; в мелком тексте блик недопустим. Браузерные образцы в брендбуке — CSS-пробы отражений и фактуры, не фотография и не готовая 3D-модель. Шрифт с засечками и варианты логотипа на цветовой картинке не заменяют утверждённые Geologica и мастер SVG.

Латунь должна занимать лишь следовую долю экрана: одна тонкая деталь рядом с главным акцентом, а не несколько конкурирующих золотистых пятен. Образец материала в палитре — демонстрация, не пропорция для сайта. Не задавать квоту, которую нужно заполнить металлом. Насыщенный Oxide и Depth дают крупные смысловые акценты, латунь их точечно подчёркивает. Не красить все разделы по очереди. Айсберг, воду и кристаллы не перекрашивать в металл.

Ошибка формы может использовать #8B3530 только как функциональный статус с явным текстовым пояснением. Oxide не обозначает ошибку автоматически. Успешное действие объясняется текстом; цвет не единственный носитель смысла. Контрасты ключевых пар рассчитаны в `CONTRAST.json`.

## 5. Графический язык

Основной мотив — **материальная глубина и точная обработка**. Прозрачные природные грани, серебристое преломление, плотный камень, сатинированный металл и минеральная поверхность принадлежат одной системе. Вода и мягкая светлая атмосфера исходного айсберга остаются эталоном главной. На остальных страницах не нужно повторять айсберг или кристалл: выбираем материал по содержанию.

Можно: тонкие прямые линии 1 px, аккуратные выноски с точкой 3–4 px, номер слоя, осмысленный разрез, фрагмент кристалла или базальта, точное металлическое соединение, минеральная фактура и спокойная тень реального объекта.

Не используем: случайные кольца и орбиты, шестерёнки, шарики, звёздочки, эмодзи-декор, цветные провода, псевдо-CRM, матричный дождь, галактики, пластик, 3D-буквы и случайные материалы вне утверждённой библиотеки. Круг допустим для фотографии человека, служебной точки или элемента настоящего интерфейса; он не становится отдельным декоративным мотивом.

На одном экране один главный арт-объект или одна материальная сцена. Не собирать коллаж из всей библиотеки. Материал не заменяет иконку каждой услуги и не повторяется около каждого абзаца. Для длинной статьи достаточно одного небольшого акцента у начала или конца. Локальная фактура изображения не определяет цвет фона интерфейса.

### Кристаллические объекты

1. `crystal-spire` — вытянутый одиночный кристалл. Боковой акцент первого экрана услуги или заключительного CTA.
2. `crystal-cluster` — связанная группа из трёх форм. Команда, комплексная услуга, несколько связанных направлений.
3. `crystal-section` — прозрачный срез над минеральным основанием. Архитектура, инженерия, объяснение подхода.
4. `crystal-arch` — кристаллическая арка. Обложка кейса или переход между главами; не новый логотип.

Исходники PNG с альфа-каналом и WebP находятся в `assets/`. Файлы не заменяют оригинальный айсберг на главной. Перед применением проверять объект на светлом и тёмном фоне: полупрозрачные края и отражения дают разные впечатления. Не добавлять поверх растрового блика второй CSS glow. Исходные промпты и инструмент — `PROMPTS.json`; генерация выполнена встроенным image_gen.

### Расширенная библиотека материалов

Единый свет, физически правдоподобные поверхности, спокойная композиция и точная работа с масштабом связывают разные материалы. Библиотека предназначена для системы примерно из 100 страниц, а не для размещения всех шести образцов на главной. Каждый материал раскрывает конкретную сторону работы студии.

| Объект / файл | Где применять | Чего избегать |
| --- | --- | --- |
| **Basalt Foundation** · `assets/material-basalt-foundation.webp` | Прочная основа: надёжность, защита данных, поддержка, инженерные гарантии. Плотный графитовый камень и точная грань. | Не заменять им утверждённый айсберг. Не делать новый горный пейзаж или тяжёлую скалу в каждом разделе. |
| **Brass Joint** · `assets/material-brass-joint.webp` | Точность соединения: интеграции, работа систем вместе, передача данных. Маленький латунный узел между спокойными поверхностями. | Не превращать изображение в сборку шестерёнок, механический конструктор или золотую схему CRM. |
| **Oxide Relief** · `assets/material-oxide-relief.webp` | Характер и глубина: подход студии, стратегия, авторская глава или обложка статьи. Минеральный красный и направленная тень. | Не использовать розовую подложку, яркий алый, жилые интерьеры и девелоперский антураж. |
| **Dune Strata** · `assets/material-dune-strata.webp` | Масштаб и движение: исследование, развитие продукта, накопление знаний, переход между главами. Сдержанный песчаный рельеф. | Не перекрашивать сайт в бежевый, не менять Paper и Depth, не добавлять туристические сюжеты, закат и пустынную романтику. |
| **Brass Fold** · `assets/material-brass-fold.webp` | Точная обработка: кастомная разработка, внимание к деталям, качество интерфейса. Один изгиб сатинированного металла. | Не вводить второй металл, не делать блестящий золотой фон или пластмассовую 3D-ленту. |
| **Mineral Interface** · `assets/material-mineral-interface.webp` | Встреча ясности и прочной основы: архитектура решения, продуктовая логика, граница между видимым интерфейсом и внутренней системой. | Не имитировать настоящий продукт клиента и не размещать выдуманные экраны, показатели или мелкий псевдокод. |

### Как применять библиотеку на разных страницах

1. Выбрать **один смысл и один материал** для ведущего изображения страницы. Для услуги интеграций подходит соединение; для надёжности — базальт; для подхода — минеральный Oxide. Это визуальные метафоры, не доказательства результата и не изображения реальных клиентских работ.
2. Использовать мастер в разных форматах: широкая полоса, предметный фрагмент рядом с содержанием, компактная обложка. Кадрировать без растяжения и без потери главной грани или соединения. Один ассет можно повторить в другой роли, но соседние разделы не должны выглядеть копиями.
3. Для длинной страницы достаточно одной ведущей сцены и, если нужен, одного небольшого материального акцента в другой главе. Реальные интерфейсы и люди важнее коллекции декоративных объектов. На страницах кейсов материал не подменяет скриншоты проекта.
4. **Цвет изображения не становится новым цветом интерфейса.** Песок остаётся внутри фотографии, Oxide — внутри минеральной сцены или в утверждённой акцентной поверхности. Навигация, текст, формы и соседние блоки продолжают использовать Paper, Mist, Ink, Depth и утверждённые акценты. Новые «песочные», «каменные» или «медные» UI-палитры не вводить.
5. Латунь остаётся редкой. Крупный образец в библиотеке нужен для изучения материала; на странице услуги он работает как небольшой предметный акцент. Не суммировать металлическую картинку, золотистый текст, золотые кнопки и несколько линий на одном экране. **Заголовки целиком и отдельные крупные слова латунью не окрашиваются.**
6. Текст располагать вне активного рельефа или на проверенном ровном поле. Заголовок использует всю доступную ширину, пояснение идёт под ним. Картинка не должна сужать заголовок до случайных обрывков или оставлять одно слово последней строкой.
7. Исходные материалы сохранять в `materials/`, веб-версии — в `assets/` с именами из таблицы. Вёрстка использует WebP с размерами и отложенной загрузкой вне первого экрана. Не подгружать всю библиотеку на каждой странице; выбирать только используемые файлы.

Новые материалы дополняют эталон, а не меняют его. Исходный айсберг с водой, единый SVG-логотип, Geologica + Inter и фирменная палитра остаются неизменными. Архивные концепты со скалой, дубом и зданием по-прежнему не являются вариантами первого экрана.

## 6. Сетка и компоненты

- Desktop: поля 5,3vw, максимум 136 px; контент до 1940 px, крупная сцена до 2200 px. Поля планшета 32 px, телефона 22 px.
- Вступление раздела — единая вертикальная композиция: заголовок на всю ширину контейнера, под ним подзаголовок, затем контент. Не ставить вводный абзац в соседнюю правую колонку.
- Для длинной страницы заранее задать смысловой ритм: светлый вход, выразительные реальные кейсы, глубокая инженерная глава, человеческая глава с фотографиями и один насыщенный тёплый поворот. Не заполнять пустоту декором и не делать все блоки одинаково белыми.
- Базовый шаг интервалов 4 px; основные значения 8, 12, 16, 24, 32, 48, 64, 96. Между большими разделами обычно 80–120 px, на телефоне 56–72 px.
- Кнопка: прямоугольная, радиус 2 px, минимум 48 px высотой, в главном CTA 56 px. Один основной CTA в локальном контексте.
- Форма: понятный label над полем, тонкая граница, явный фокус. Placeholder не заменяет label.
- Карточки: прямоугольные либо радиус 2–4 px. Не закруглять каждый блок в капсулу. Большая капсула допустима как единичный композиционный контейнер, а не универсальная сетка.
- Кейс: реальный скриншот → задача → результат → ссылка. Сохранить цвета интерфейса проекта; без выдуманных данных и генеративных скриншотов.
- Отзыв: точная цитата, имя/роль, реальное фото или честные инициалы при отсутствии фото. Видео только настоящее, без автозвука. Не подставлять случайные или сгенерированные лица.
- Телефон допустим для работающего демо бота. Подписать демонстрационный сценарий; он не должен выдавать себя за реального клиента или рабочий бот.
- В таблицах важнее читаемость, чем декоративность: тонкие горизонтальные линии, минимум заливок, цифры ровными колонками.

## 7. Движение и интерактив

Картинка с водой сохраняется. Пока не утверждена отдельная разборка, не двигать силуэт и не делить его на случайные плоские полосы. Допустимы подсветка выбранного уровня, выноска и подробное описание рядом. Подпись или панель описания не перекрывает айсберг, другие элементы управления или основной текст; ей выделяется собственное место. Интерактив помогает понять технологическую архитектуру и не превращается в декоративную схему из случайных линий. Видимая смена состояния должна соответствовать реальной функции.

Фокус и hover: 180–240 ms; переход выбранного слоя до 400 ms. Без постоянного вращения главного объекта, большого параллакса, захвата скролла и второго курсора. Управление одинаково доступно мышью, клавиатурой и касанием. При `prefers-reduced-motion` отключить необязательное движение.

## 8. Система страниц

- Главная: эталонный айсберг с водой; ясный оффер; одна типографическая фраза; реальные кейсы; команда и отзывы; объяснение подхода; квиз.
- Услуга: тот же header, шрифты, цвета, кнопки; один материал по смыслу из библиотеки вместо повторения горы. Содержание и польза услуги важнее арта.
- Кейс: реальная работа на первом плане; дополнительный материал необязателен. Метрики и отзыв связаны с этим же проектом.
- Статья: читабельная колонка, Geologica в заголовках и Inter в тексте. Курсив только настоящий. Декор не повторяется между абзацами.
- Каталог услуг/кейсов: одинаковая логика карточек и ссылок. Не вводить новую цветовую тему для каждой категории.

## 9. SEO и верстка

Не менять URL, H1, исходную иерархию заголовков, значимые тексты, canonical, hreflang, микроразметку и перелинковку ради внешнего вида. Дополнительные смыслы и блоки маркируются отдельно. Квиз — согласованное функциональное изменение; не выдавать новую логику за неизменившийся калькулятор.

Текст остаётся HTML, не частью картинки. Изображения получают размеры и alt; вторичные изображения загружаются лениво. Демо — noindex. Production не наследует noindex и локальные обработчики форм. Сохранение структуры не является гарантией поисковых позиций.

## 10. Инструкция для дальнейшей разработки

1. Прочитать этот файл и проверить последнюю версию `design-tokens.json`.
2. Брать логотип только из `logos/avat-master.svg`; светлую/тёмную версию строить заменой цвета.
3. Подключать утверждённые локальные Geologica + Inter и отдельный Inter Italic. Для Geologica сохранять SHRP 50 / CRSV 0 / slnt 0 и основные веса 400/500. Не возвращать Manrope и не подключать остальные шрифты сравнения на новых страницах.
4. Начинать новый экран с сетки, типографики и реального содержания. Затем добавлять одну уместную сцену или объект из библиотеки материалов. Не выводить из цвета изображения новую палитру интерфейса.
5. Не менять форму айсберга, воду или метафору без отдельного решения команды.
6. Проверить 1920 и 2560 px, обычный desktop и телефон: подзаголовок под заголовком, осмысленные переносы без одиноких слов, контраст, загрузку кириллицы, настоящий курсив, отсутствие наложений. Проверить, что латунь осталась редкой деталью, а Oxide Mist не вернулся в фоны.
7. Если нужна новая роль цвета или компонента — сначала обновить брендбук и токены, затем страницы. Не делать локальное исключение молча.

Единая веб-версия брендбука для просмотра и будущей публикации: `outputs/avat-depth-home/dist/about/brand/index.html`. Кодовые токены: `tokens.css` и `design-tokens.json`. Эталон и ассеты: `assets/`. Проверка шрифтов: `fonts/VERIFICATION.json`. Это обязательная основа новых страниц, исторический архив концептов сохраняется как архив.