/* Шапка и логотип «Квадеры» (kvadera/_header.html, _logo.html) — по образцу лендинга
   «Квадера Брокер» (landing.css, «Шапка»); цвета — экосистемы. */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(250, 249, 246, .95); backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid #e5e1eb;
}
.header-row { display: flex; align-items: center; gap: 20px; min-height: 72px; }

/* Логотип: пропорции образца (landing.css, .logo-mark) — знак 1.6em, «квадера.» 26px. */
.logo { display: inline-flex; align-items: center; color: #29244f; text-decoration: none; }
.logo:hover { color: #29244f; }
.logo-mark { display: inline-flex; align-items: center; gap: .45em; font-size: 26px; font-weight: 800; line-height: 1; white-space: nowrap; color: inherit; }
.logo-mark svg { width: 1.6em; height: 1.6em; flex: none; }
.logo-plate { fill: #29244f; }
.logo-tiles { fill: #d4c5ff; }
.logo-name { letter-spacing: -.055em; }
/* На тёмном фоне (подвал) — светлый текст и светлая плашка знака. */
.logo-inverted, .logo-inverted:hover { color: #fff; }
.logo-inverted .logo-mark { font-size: 22px; }
.logo-inverted .logo-plate { fill: #9f8bdc; }
.logo-inverted .logo-tiles { fill: #231d48; }

.site-nav { display: none; }
.site-nav a { color: #656379; text-decoration: none; font-size: 14px; font-weight: 500; }
.site-nav a:hover { color: #342b76; }
.header-actions { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.header-icon { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.header-login { display: none; align-items: center; gap: 4px; color: #24233e; font-weight: 600; font-size: 14px; text-decoration: none; }
.header-login .header-icon { width: 15px; height: 15px; }
.header-login:hover { color: #342b76; }
.header-btn {
  display: none; align-items: center; border-radius: 999px; padding: 10px 20px;
  background: #29244f; color: #fff; font-size: 14px; font-weight: 600; line-height: 1.2; text-decoration: none;
  transition: background-color .15s;
}
.header-btn:hover { background: #342b76; color: #fff; }
.menu-toggle {
  display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0;
  border: 1px solid #e5e1eb; border-radius: 999px; background: #fff; color: #24233e; cursor: pointer;
}

/* Меню на телефоне — раскрывается под шапкой (script.js). */
.menu-open .site-nav {
  display: flex; flex-direction: column; gap: 4px;
  position: absolute; left: 0; right: 0; top: 72px; padding: 8px 16px 16px;
  background: #faf9f6; border-bottom: 1px solid #e5e1eb; box-shadow: 0 14px 24px #241b4219;
}
.menu-open .site-nav a { padding: 10px 0; font-size: 17px; color: #24233e; }

@media (min-width: 560px) { .header-btn { display: inline-flex; } }
@media (min-width: 1100px) {
  .site-nav { display: flex; gap: 26px; margin: 0 auto; }
  .menu-open .site-nav { position: static; flex-direction: row; padding: 0; box-shadow: none; border: 0; background: none; }
  .menu-open .site-nav a { padding: 0; font-size: 14px; color: #656379; }
  .header-actions { margin-left: 0; gap: 20px; }
  .nav-login, .menu-toggle { display: none; }
  .header-login { display: inline-flex; }
}
@media (max-width: 420px) { .logo-mark { font-size: 22px; } }