/* ═══════════════════════════════════════════════════════════════════════════════════════════════ LANDING.CSS — стили девяти страниц Vantage. Подключается ТОЛЬКО на лендинге (App.razor). ⚠ ТОКЕНЫ ЖИВУТ ЗДЕСЬ, app.css НЕ ТРОГАЕМ (решение Emil). Часть значений дублирует литералы экрана логина. Это ПРИНЯТЫЙ ХВОСТ, а не недосмотр: поднять девять переменных в app.css значит тронуть стили 31 страницы, при этом сам логин остался бы на литералах — токены объявлены и не используются. Половина рефакторинга хуже его отсутствия. ⚠ ПРАВИЛО TEAL — ОДНО НА ВСЕ ДЕВЯТЬ СТРАНИЦ (утверждено Emil 18.08): ЗАЛИВКА --teal-soft = СТАТУС (утверждение про элемент) ГРАДИЕНТ 135deg = ДЕЙСТВИЕ (призыв нажать) Проверочный вопрос: заливка что-то УТВЕРЖДАЕТ про элемент или ЗОВЁТ нажать? Если второе — это кнопка, и у неё градиент. Законные заливки: .mod.base («входит всегда»), .src (чипы источников), .build-col.on («наш вариант» в сравнении двух), .cap-ic/.branch-ic/.axis-ic (иконки). ⚠ ФИЗИЧЕСКИХ left/right НЕТ НИ ОДНОГО — только логические свойства: страницы идут и в RTL (he), и в LTR (en, ru), и зеркалиться должны сами. ⚠ ШКАЛА ТИПОГРАФИКИ — СЕМЬ СТУПЕНЕЙ. Ничего мимо --fs-*. ═══════════════════════════════════════════════════════════════════════════════════════════════ */ :root{ /* из живого app.css, дословно */ /* ⚠⚠ ЧЕТЫРЕ ТОКЕНА ПОДНЯТЫ ДО КОНТРАСТА AA (правка Emil 20.08 — подпись в подвале терялась на фоне). Замерено на --bg #f7f8fa, норма WCAG AA для мелкого текста 4.5:1: --sub #8a8ea3 → #6b6f8a 3.05 → 4.63 (12 правил, почти весь мелкий текст) --muted #6b6f8a → #5f6480 4.63 → 5.46 (сдвинут на ступень, чтобы не слиться с sub) --teal-dk #17898c → #137276 3.96 → 5.35 (18 правил: метки секций, ссылки, чипы) --placeholder #b8bccd → #8a8ea3 1.83 → 3.14 (плейсхолдер полей ввода) ⚠ --teal НЕ ТРОНУТ: он нигде не цвет текста, только border-color и фон — требования контраста к нему не предъявляются, а сдвиг испортил бы фирменный цвет ни за чем. ⚠ Про «Google забанит»: банят СКРЫТЫЙ текст (цвет в цвет с фоном, off-screen, display:none) под набивку ключевыми словами. Здесь текст видимый, просто плохо читаемый — домену ничего не грозило. Чинить всё равно надо: это провал доступности и минус в Lighthouse, а он уже влияет на оценку страницы. */ --navy:#161848; --navy-lt:#383a63; --navy-soft:#ececf0; --teal:#1ca2a5; --teal-dk:#137276; --teal-soft:#dcf1f1; --ink:#161848; --muted:#5f6480; --line:#e4e5ec; --bg:#f7f8fa; --panel:#fff; --heebo:"Heebo","Segoe UI","Arial","Rubik",sans-serif; /* литералы экрана логина, поднятые в токены */ --brand-deep:#141640; --teal-glow:#54d6d9; --sub:#6b6f8a; --field-line:#e6e8f0; --field-bg:#fbfbfe; --brand-p:#b9bde0; --label:#3a3d5c; --placeholder:#8a8ea3; /* текст на тёмном: три ступени вместо шести случайных */ --on-navy-1:#dfe2f5; --on-navy-2:#aeb4e0; --on-navy-3:#9098c9; --teal-ink:#17575a; --fs-1:44px; --fs-2:30px; --fs-3:20px; --fs-4:17px; --fs-5:15px; --fs-6:13px; --fs-7:11.5px; --r:11px; --shadow-cta:0 8px 20px rgba(28,162,165,.26); --shadow-cta-hi:0 12px 26px rgba(28,162,165,.34); --focus:0 0 0 4px rgba(28,162,165,.14); --hair:rgba(255,255,255,.10); } @media (max-width:980px){ :root{ --fs-1:31px; --fs-2:24px; --fs-3:18px; --fs-4:16px; } } /* ⚠⚠ БЕЗ ЭТОЙ СТРОКИ ПОЛЯ ФОРМЫ ВЫЛЕЗАЛИ ЗА КАРТОЧКУ. Измерено на живой странице: карточка 470px, паддинг 30+30, содержимое 410 — заголовок, подпись, кнопка и примечание ровно 410, а input и textarea 442, то есть на 32px шире и на 2px за краем карточки. Причина: у