/* ============================================================
   GuardPlus — логотип. ЕДИНСТВЕННОЕ место, где он описан.
   Заведён 24.08.2026.

   Зачем. До этого логотип был описан ТРИЖДЫ и выглядел по-разному:
     · index.html      — свой .nav-logo + .gp-g/.gp-p/.gp-vpn в <style>;
     · shared.css      — свой .nav-logo (для download / help / devices);
     · privacy + terms — вообще другой класс .logo: 18 px вместо 19 и «VPN»
                         обычным текстом через пробел, без отбивки и веса 600.
   Страницы из-за этого разъезжались: на /privacy и /terms логотип был мельче
   и с другой посадкой слова VPN.

   Подключается ВСЕМИ страницами сайта:
     index, download, help, devices, privacy, terms —
     <link rel="stylesheet" href="/brand.css">

   Разметка одна и та же везде, менять только здесь и во всех шести файлах сразу:
     <a href="/" class="nav-logo"><span class="gp-g">Guard</span><span
        class="gp-p">Plus</span><span class="gp-vpn">VPN</span></a>

   Цвета и шрифт берутся из токенов страницы — каждая из шести объявляет у себя
   --font-display, --text, --blue-400 и --indigo-500. Собственных значений здесь
   намеренно нет: иначе логотип перестал бы следовать светлой/тёмной теме.
   ============================================================ */
.nav-logo{font-family:var(--font-display);font-size:19px;font-weight:700;color:var(--text);
  text-decoration:none;letter-spacing:-0.02em;white-space:nowrap;
  display:inline-flex;align-items:center;line-height:1}
.nav-logo .gp-g{color:var(--text)}
.nav-logo .gp-p{background:linear-gradient(135deg,var(--blue-400),var(--indigo-500));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.nav-logo .gp-vpn{margin-left:8px;font-weight:600;color:var(--text)}

/* ── Геометрия шапки. Тоже одна на все страницы (24.08.2026).
   Классы два, потому что исторически шапка на лендинге и трёх страницах называется
   .navbar, а на privacy/terms — .topbar. Раньше у .topbar были свои отступы 18px 24px,
   и логотип на правовых страницах стоял на 16 px левее и ниже, чем везде.
   Здесь ТОЛЬКО геометрия: высота, выравнивание, поля. Фон, границу, sticky/fixed
   каждая страница задаёт у себя — они у них разные по смыслу. */
.navbar,.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;
  height:64px;padding:0 40px}
@media(max-width:1000px){.navbar,.topbar{padding:0 20px}}

/* ── Подпись кнопки кабинета на узких экранах (24.08.2026).
   Замер: при 412 px шапка /download переполнялась — кнопка вылезала за правый край
   (отступ справа 2 px вместо 20). Причина: логотип 19 px (~150 px) + «Личный кабинет»
   (~185 px) + поля 40 не влезают. Ниже 560 px показываем короткое «Кабинет».
   Обе подписи лежат в разметке, а не подставляются через ::after — так их видит
   и читалка экрана, и поиск по странице. */
.lbl-short{display:none}
@media(max-width:560px){.lbl-full{display:none}.lbl-short{display:inline}}
