/* mm-header-mobile.css — компактная мобильная шапка В ОДНУ СТРОКУ.
   Работает В ПАРЕ со штатным /mobile-nav.js: тот даёт бургер (.mmnav-burger) и прячет
   в панель пункты меню + переключатель языка/темы. Здесь — только выравнивание бара
   в одну строку, единый размер лого и стиль ряда «язык/тема» внутри панели.
   Геро-шапки (главная .header) и десктоп НЕ трогаем (правила только в @media). */

/* ═══ ЕДИНАЯ СВЕТЛАЯ ТЕМА для ВСЕХ страниц (многие лендинги были dark-only).
   Переопределяем общие CSS-переменные — работает на всех, кто их использует.
   Страницы со своим html.theme-light (их inline-стиль идёт ПОСЛЕ этого <link>) не меняются. */
html.theme-light {
  color-scheme: light;
  --bg:#f4f4f9; --bg2:#eef0f7; --surface:#ffffff; --surf2:#ffffff; --surf:#ffffff;
  --card:#ffffff; --panel:#ffffff; --elev:#ffffff;
  --border:rgba(25,25,60,0.13); --border2:rgba(25,25,60,0.22);
  --text:#1c1c30; --soft:#45455f; --dim:#70708c;
  --text-soft:#45455f; --text-dim:#70708c; --ink:#1c1c30; --ink-soft:#45455f;
  --acc-glow:rgba(124,58,237,0.15);
}
/* Заголовки с белым градиент-текстом (для тёмного геро) washed на светлом → тёмно-фиолетовый */
html.theme-light .pricing-hero h1,
html.theme-light h1.hero-title,
html.theme-light .hero h1 {
  background: linear-gradient(135deg, #1c1c30 20%, #7c3aed 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
}
html.theme-light .bg-glow, html.theme-light .glow { opacity:.14 !important; }
html.theme-light .bg-grid { opacity:.5; }
html.theme-light body > nav,
html.theme-light .topbar,
html.theme-light header { background: rgba(255,255,255,0.9); }

/* Базовый стиль переключателя темы (для страниц, где его добавляет mm-header-auth.js) */
.theme-toggle {
  background: rgba(127,127,160,.12); border: 1px solid var(--border, rgba(127,127,160,.3));
  color: var(--text, #eeeef8); width: 34px; height: 32px; border-radius: 9px;
  cursor: pointer; font-size: 1rem; line-height: 1; flex-shrink: 0; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.theme-toggle:hover { color: var(--text); }

/* ═══ ЕДИНЫЙ ПОРЯДОК КОНТРОЛОВ во ВСЕХ шапках: [ссылки] → RU|EN → тема → Войти → CTA.
   Раньше порядок зависел от разметки каждой страницы (на части лендингов .theme-toggle
   захардкожен ДО языка, на других инжектится mm-header-auth.js ПОСЛЕ) → визуально разъезд.
   Выравниваем через flex `order` в одном месте: DOM/SEO/язык/вход не трогаем, только визуал.
   Обычные ссылки остаются с order:0 (идут первыми), контролы — с высокими order по канону. */
.nav-links > .mm-lang-switch, nav.nav > .links > .mm-lang-switch, .topbar-nav > .mm-lang-switch,
.nav-links > .mm-auth-lang, .topbar-nav > .mm-auth-lang { order: 80; }
.nav-links > .theme-toggle, nav.nav > .links > .theme-toggle, .topbar-nav > .theme-toggle { order: 81; }
.nav-links > .mm-auth-link, nav.nav > .links > .mm-auth-link, .topbar-nav > .mm-auth-link { order: 82; }
.nav-links > .nav-cta, .nav-links > .cta, .nav-links > .btn-primary,
nav.nav > .links > .cta, .topbar-nav > .cta, .topbar-nav > .btn-primary { order: 83; }
/* Бургер (mobile) — всегда крайний правый, ПОСЛЕ CTA. mobile-nav.js добавляет его последним
   в DOM, но order:83 у CTA перетягивал кнопку за него → бургер оказывался слева от CTA.
   Возвращаем привычный порядок «… CTA · ☰» (☰ под большой палец справа). */
.mmnav-burger { order: 90 !important; flex-shrink: 0 !important; }

/* ═══ ЕДИНАЯ КНОПКА-CTA во ВСЕХ шапках (пользователь выбрал вид /tools): плотный фиолетовый
   градиент 135°, скруглённый прямоугольник r=12, мягкое свечение. Раньше вид зависел от
   переменных страницы (--accent/--cta2/--r/--acc-glow различались) — на главной кнопка была
   светлее/глянцевее. Фиксируем жёсткими значениями, чтобы кнопка была одинаковой везде. */
.nav-links > .nav-cta, .nav-links > .cta, .nav-links > .btn-primary,
header .wrap.nav .nav-links > .nav-cta, nav.nav > .links > .cta,
.topbar-nav > .cta, .topbar-nav > .btn-primary {
  background: linear-gradient(135deg, #7c3aed, #9333ea) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  box-shadow: 0 0 20px rgba(124, 58, 237, .4) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.nav-links > .nav-cta:hover, .nav-links > .cta:hover, .nav-links > .btn-primary:hover,
nav.nav > .links > .cta:hover { color: #fff !important; opacity: .92; }

/* ═══ КАНОНИЧЕСКИЙ ВИД ШАПКИ (десктоп) — подтягиваем ДВА структурных исключения
   (profile .topbar и partners header>.wrap.nav) к виду лендинг-семьи <nav>.
   Лендинг-семью (body>nav) НЕ трогаем — она уже канонична. SEO/язык/вход не затрагиваются. */
.topbar {
  position: sticky; top: 0; z-index: 100;
  height: 64px; padding: 0 2rem;
  background: rgba(6,6,16,0.88);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.06));
}
html.theme-light .topbar { background: rgba(255,255,255,0.9); }
.topbar .topbar-logo-mark { height: 28px; }
.topbar .topbar-nav { gap: .25rem; }
.topbar .topbar-nav a {
  padding: .45rem .9rem; border-radius: 12px;
  color: var(--text-soft, #8888aa); font-size: .9rem; transition: color .15s, background .15s;
}
.topbar .topbar-nav a:hover { color: var(--text); background: rgba(127,127,160,.1); }
.topbar .mm-auth-lang { font-size: .85rem; margin-right: .25rem; }

/* tools-хаб (nav.nav > .links): зелёный CTA → канон-фиолетовый, лого/ссылки к общему виду */
.nav > .links .cta {
  padding: .5rem 1.2rem !important; border-radius: 12px !important;
  /* канон-фиолетовый: убираем зелёный бордер + 3D-тень «хардвер-кнопки» tools */
  background: linear-gradient(135deg, #7c3aed, #9333ea) !important;
  color: #fff !important; font-weight: 600 !important; text-decoration: none;
  border: none !important;
  box-shadow: 0 0 20px rgba(124,58,237,.4) !important;
  transform: none !important;
}
.nav > .links .cta:hover { color: #fff !important; opacity: .92; }
.nav > .links .cta:active { transform: none !important; box-shadow: 0 0 20px rgba(124,58,237,.4) !important; }
.nav > .links > a:not(.cta) { color: var(--text-soft, var(--soft, #8888aa)); font-size: .9rem; }
/* Вертикальное выравнивание tools-шапки (CTA «висел» ниже лого/бургера).
   Высокая специфичность + align-self, чтобы гарантированно перебить tools.css .nav (класс). */
body > nav.nav { display: flex !important; align-items: center !important; }
body > nav.nav > .links { display: inline-flex !important; align-items: center !important; flex-wrap: nowrap !important; }
body > nav.nav > .links > * { align-self: center !important; }
body > nav.nav > .links .cta { display: inline-flex !important; align-items: center !important; line-height: 1 !important; align-self: center !important; }
body > nav.nav .lockup { height: 28px; align-self: center !important; }

header > .wrap.nav .logo img { height: 28px; }
header > .wrap.nav .nav-links .lnk {
  padding: .45rem .9rem; border-radius: 12px;
  color: var(--text-soft, #8888aa); font-size: .9rem;
}
header > .wrap.nav .nav-links .lnk:hover { color: var(--text); background: rgba(127,127,160,.1); }

@media (max-width: 640px) {
  /* Бар — строго одна строка, ровная высота, без переноса */
  body > nav,
  header > .wrap.nav,
  .topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: .5rem !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 .85rem !important;
    row-gap: 0 !important;
  }
  /* tools .nav: padding/wrap tools.css бил мои правила — давим макс. специфичностью */
  body > nav.nav { padding: 0 .6rem !important; gap: .35rem !important; max-width: 100vw !important; flex-wrap: nowrap !important; }
  body > nav.nav > .links { gap: .35rem !important; flex-wrap: nowrap !important; font-size: .74rem !important; }
  /* Логотип — прямой ребёнок nav.nav (не в .links) → центрируем явно, чтобы не «висел» выше */
  body > nav.nav { align-items: center !important; }
  body > nav.nav > * { align-self: center !important; margin-top: 0 !important; margin-bottom: 0 !important; }
  body > nav.nav > .logo, body > nav.nav .logo, body > nav.nav .lockup { align-self: center !important; display: inline-flex !important; align-items: center !important; }
  body > nav.nav > .links > a.cta { padding: .4rem .62rem !important; white-space: nowrap !important; }
  body > nav.nav > .links .mmnav-burger { flex-shrink: 0 !important; }

  /* Логотип — единый компактный размер на всех страницах */
  body > nav .nav-logo-lockup,
  body > nav .nav-logo img,
  header > .wrap.nav .logo img,
  .topbar .topbar-logo-mark {
    height: 26px !important; width: auto !important; max-width: 44vw !important;
    object-fit: contain !important; flex-shrink: 1;
  }
  header > .wrap.nav .logo span,
  .topbar .topbar-logo-type { display: none !important; }

  /* Приоритетный CTA остаётся в баре — компактно, без переноса */
  body > nav .nav-cta,
  header > .wrap.nav .nav-links .btn-primary {
    font-size: .8rem !important; padding: .45rem .8rem !important;
    white-space: nowrap !important; flex-shrink: 0 !important;
  }

  /* Широкие текстовые пункты меню на страницах без бургера (кабинеты/partners) —
     прячем, чтобы бар не переполнялся (mobile-nav.js там не строит бургер). */
  /* Прячем ССЫЛКИ-пункты (не контейнеры) — их собирает бургер; контейнеры нужны для ☰ */
  .topbar .topbar-nav > a:not(.mm-auth-link),
  .nav > .links > a:not(.cta):not(.mm-auth-link),
  header > .wrap.nav .nav-links .lnk { display: none !important; }
  /* tools CTA компактно на мобиле */
  .nav > .links .cta { font-size: .8rem !important; padding: .45rem .8rem !important; white-space: nowrap !important; }

  /* Ряд «язык + тема» внутри панели бургера (mobile-nav.js переносит их сюда) */
  .mmnav-extra {
    display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
    margin-top: .6rem; padding-top: .7rem;
    border-top: 1px solid var(--border, rgba(255,255,255,.1));
  }
  .mmnav-extra .mm-lang-switch,
  .mmnav-extra .mm-auth-lang { font-size: .95rem; }
  .mmnav-extra .theme-toggle { font-size: 1.1rem; }
}

/* Совсем узкие экраны (≤360px): плотнее, лого меньше — гарантия одной строки */
@media (max-width: 360px) {
  body > nav, header > .wrap.nav, .topbar { gap: .35rem !important; padding: 0 .6rem !important; }
  body > nav .nav-logo-lockup,
  header > .wrap.nav .logo img { height: 23px !important; max-width: 40vw !important; }
  body > nav .nav-cta,
  header > .wrap.nav .nav-links .btn-primary { font-size: .74rem !important; padding: .4rem .6rem !important; }
}