@wasrusgen1 · Бренд-бук · 2026

ЗАЩИТА

Руководство по фирменному стилю

Юридическая экспертиза и сопровождение сделок · Версия 2026

Продукт @wasrusgen1 | ЗАЩИТА

Платформа Юр-кабинет в CRM

Акцент Бордо #9F1239

Зонтичный бренд РАДАР

Логотип

Логотип ЗАЩИТА — знак @WASRUSGEN1 плюс суббренд на Montserrat 700. Выравнивание — по кэп-хейту знака. Символы @ и 1 допустимо выводить за границы.

Основные версии

Светлый фон — основная версия

Тёмный фон — инвертированная версия

Фирменный градиент Бордо — обложки документов и КП

Суббренды — одна система, четыре продукта

РАДАР · #4338CA

РАДАР

CRM · #003E7E

CRM

ЭКСПЕРТ · #0891B2

ЭКСПЕРТ

ЗАЩИТА · #9F1239 · НОВЫЙ

Охранная зона — минимальный отступ = кэп-хейт знака

Жёлтая зона — запретная область для любых других элементов.

Правила использования

✓ МОЖНОНа белом или светлом фоне

✓ МОЖНОНа тёмном фоне с инверсией

✓ МОЖНОНа фирменном градиенте Бордо

ЗАЩИТА

✗ НЕЛЬЗЯПрозрачность / opacity менее 1

ЗАЩИТА

✗ НЕЛЬЗЯПроизвольные цвета суббренда

ЗАЩИТА

✗ НЕЛЬЗЯНаклон, другой шрифт или деформация

Минимальный размер

26px — минимум для экрана

36px — минимум для печати

Цветовая палитра

Акцентный якорь ЗАЩИТА — Бордо (#9F1239). Глубокий #3B0212 создаёт ощущение надёжности и правовой солидности. Семантические цвета размечают уровни риска в документах.

Primary — Burgundy (Бордо) Scale (950 → 50)

#3B0212
950

#7A0E2E
900

#8C1033
800

#9F1239
700

#B5163F
600

#C81E4E
500

#E8909F
400

#FDA4AF
300

#FECDD3
200

#FFE4E6
100

#FFF1F2
50

Neutral — общая шкала зонтичного бренда

#030712
950

#111827
900

#1F2937
800

#374151
700

#4B5563
600

#6B7280
500

#9CA3AF
400

#D1D5DB
300

#E5E7EB
200

#F3F4F6
100

#F9FAFB
50

Ключевые токены — 6 цветов продукта

Brand Dark

#3B0212

Обложки отчётов, заголовки

Бордо 700

#9F1239

Кнопки, активные элементы

Primary Action

#9F1239

CTA, акценты, ссылки

Бордо 500

#C81E4E

Hover, иконки, декор

Бордо 100

#FFE4E6

Фоны карточек, тинты

Бордо 50

#FFF1F2

Страничный фон, подложки

Семантические цвета — уровни риска в документах

Success

#10B981 · #ECFDF5

✓ Риск не выявлен

Warning

#F59E0B · #FFFBEB

⚠ Требует внимания

Danger

#EF4444 · #FEF2F2

✕ Критичный риск

Info

#3B82F6 · #EFF6FF

ℹ Аналитическая заметка

Фирменные градиенты ЗАЩИТА

Brand Cover

#3B0212 → #9F1239 · 135°

Обложки отчётов, hero-блоки

Brand Mid

#9F1239 → #9F1239 · 135°

Карточки KPI, акценты

Brand Light

#9F1239 → #FDA4AF · 135°

Иконки, визуализации данных

Матрица применения цветов

Цвет	Применение	Текст на цвете	Контраст WCAG
#9F1239 Бордо 700	Кнопки, CTA, навигационные акценты	Белый	AA ✓
#9F1239 Primary	Ссылки, иконки, hover-акценты	Белый	AA ✓
#3B0212 Brand Dark	Заголовки, обложки, тёмные поверхности	Белый	AAA ✓
#FFF1F2 Бордо 50	Фон страниц в Бордо-теме, карточки	Бордо 700	AA ✓
#10B981 Success	Рост индексов, позитивные delta	Белый	AA ✓
#EF4444 Danger	Критичный риск, срыв срока	Белый	AA ✓

Типографика

Montserrat — только для логотипа. Inter — весь UI, таблицы, отчёты. Смешивать нельзя.

ЗАЩИТА

Шрифт

Montserrat

Вес

700 Bold

Применение

Только логотип и суббренды

Трекинг

letter-spacing: 3–4px

Montserrat — только для логотипа. В UI использовать Inter.

Данные решают

Шрифт

Inter

Веса

300 / 400 / 500 / 600 / 700 / 800

Применение

Весь UI — заголовки, текст, таблицы

Fallback

system-ui, sans-serif

Шкала размеров — Inter

Display

48px / 800 / −4%

ЗАЩИТА

36px / 700 / −3%

Защита в каждой сделке

24px / 700 / −2%

Ценовой индекс по категориям

18px / 700 / −1%

Динамика цен за период

Body Large

16px / 400 / normal

Кабинет проверяет договор, выявляет риски и контролирует сроки — до того, как вы подпишете.

Body

14px / 400 / normal

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

Caption

12px / 400 / normal

Метки рисков · Сроки · Статусы документов

Label

11px / 700 / +1.5px

МЕТКИ РАЗДЕЛОВ · ИНДЕКСЫ · СТАТУСЫ

Пары шрифтов в интерфейсе

Логотип

Montserrat 700

Исключительно для суббрендов: РАДАР, CRM, ЗАЩИТА. Больше нигде не используется.

UI / Content

Inter 300–800

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

UI-компоненты

Компоненты ЗАЩИТА используют Бордо-токены. Не хардкодить HEX — только через CSS-переменные. Светлая и тёмная версии входят в поставку.

Кнопки — 5 вариантов · 3 размера · Light

ЗАЩИТА ▲ Рост 12% ▼ −0.08 ⚠ Контроль Нейтрально

Ценовой индекс В норме Тревога На проверке Premium

Outline Бордо Ghost Бордо

Бейджи и статусы

Ценовой индекс

vs. конкуренты

0.94

▼ −0.03 за неделю

Покрытие

Товаров отслежено

1 247

▲ +18%

Аномалии

Скачки цен

▼ высокий риск

KPI-карточки — статус документов (Бордо акцент)

📊

Отчёт готов

Недельный анализ конкурентов сформирован — 1 247 позиций

⚠

Ценовой индекс снизился

−0.03 за 7 дней — рекомендуется пересмотр позиций

⚡

Аномальный скачок цены

Конкурент снизил цену на 34% — требует реакции

Уведомления и контроль сроков

Конкурент	Категория	Ценовой индекс	Δ нед.	Статус
Наш магазин Наши	Кухни	0.94	▼ −0.03	Контроль
Мебель Комфорт	Кухни	1.02	▲ +0.01	Стабильно
КухниПрофи	Кухни	0.78	▼ −0.16	Демпинг
Стиль Интерьер	Кухни	1.08	▲ +0.04	Растёт

Таблица документов — кабинет ЗАЩИТА

ЦЕНОВОЙ ИНДЕКС

0.94

▼ −0.03 за неделю

ПОКРЫТИЕ

1 247

▲ +18% товаров

ЗАЩИТА ▲ Рост ⚡ Демпинг ⚠ Контроль

Dark mode — ЗАЩИТА на тёмной поверхности (#0C1929)

Дизайн-токены

CSS-переменные для подключения к любому фреймворку. Используй токены — не хардкодь цвета напрямую в компонентах.

Ключевые переменные продукта

--brand-cyan

#9F1239 · Primary action (Бордо 600)

--brand-dark

#3B0212 · Dark surface (Бордо 950)

--brand-cyan-l

#9F1239 · Hover / accent (Бордо 500)

--brand-logo

#5B5B5B · Logo label on light bg

--p-950

#3B0212 · Gradient start, deep dark

--p-700

#9F1239 · Button bg, nav active

--p-600

#B5163F · Бордо 600

--p-500

#C81E4E · Section numbers, accents

--p-50

#FFF1F2 · Бордо tint bg, rules box

--n-50

#F9FAFB · Page background

--n-200

#E5E7EB · Borders default

--n-500

#6B7280 · Muted / helper text

--s-success

#10B981 · Positive metric, growth

--s-danger

#EF4444 · Alert / decline / threat

--s-warning

#F59E0B · Attention needed

--sidebar-bg

#0C1929 · Sidebar / dark panel bg

CSS :root — подключение токенов ЗАЩИТА

:root {
  /* ── BRAND (ЗАЩИТА / Бордо) ── */
  --brand-cyan:    #9F1239; /* Primary action */
  --brand-dark:    #3B0212; /* Dark surface */
  --brand-cyan-l: #9F1239; /* Hover / accent */
  --brand-logo:    #5B5B5B; /* Logo label on light */

  /* ── PRIMARY SCALE (Бордо) ── */
  --p-950: #3B0212; --p-900: #7A0E2E; --p-800: #8C1033;
  --p-700: #9F1239; --p-600: #B5163F; --p-500: #C81E4E;
  --p-400: #E8909F; --p-300: #FDA4AF; --p-200: #FECDD3;
  --p-100: #FFE4E6; --p-50: #FFF1F2;

  /* ── NEUTRAL SCALE (shared) ── */
  --n-900: #111827; --n-800: #1F2937; --n-700: #374151;
  --n-500: #6B7280; --n-400: #9CA3AF; --n-200: #E5E7EB;
  --n-100: #F3F4F6; --n-50: #F9FAFB;

  /* ── SEMANTIC ── */
  --s-success: #10B981; --s-success-bg: #ECFDF5;
  --s-warning: #F59E0B; --s-warning-bg: #FFFBEB;
  --s-danger: #EF4444; --s-danger-bg: #FEF2F2;
  --s-info: #3B82F6; --s-info-bg: #EFF6FF;

  /* ── UI SURFACES ── */
  --sidebar-bg: #0C1929; /* Dark cyan-tinted sidebar */
}

Важные правила ЗАЩИТА

1. Montserrat 700 — только для логотипа. В UI не применять.
2. Суббренд ЗАЩИТА — юридический кабинет: экспертиза договоров, контроль сроков, сопровождение сделок. РАДАР — мониторинг. CRM — кабинет. ЭКСПЕРТ — аналитика цен.
3. Logo gray #5B5B5B — цвет суббренда на светлом. На тёмном фоне — rgba(255,255,255,0.92).
4. Все цвета — только через токены. Не хардкодить HEX в компонентах.
5. Sidebar ЗАЩИТА: #0C1929 (Бордо-dark tint), не чистый чёрный. Active nav border: #9F1239.