/* Переключатель языка — общий для лендинга и подстраниц (разметку рисует /assets/lang.js).
   Цвета заданы прямо здесь: у лендинга и подстраниц разные наборы CSS-переменных. */
.lang {
  --lang-h: 40px;
  position: relative; display: inline-flex; align-items: center; flex: none;
}
.lang-btn {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: var(--lang-h); padding: 0 10px 0 12px;
  border: 1px solid #ffffff14; border-radius: 999px; background: #ffffff05;
  color: #f5f4fc; font: inherit; font-size: 13px; font-weight: 700; line-height: 1;
  letter-spacing: 0.04em; cursor: pointer;
  transition: border-color .15s, background .15s;
}
.lang-btn:hover, .lang.open .lang-btn { border-color: rgba(248, 180, 22, 0.4); background: #ffffff0a; }
.lang-btn:focus-visible { outline: 2px solid #f8b416; outline-offset: 2px; }
.lang-btn svg { width: 16px; height: 16px; color: #b5b6cc; flex: none; }
.lang-btn .lang-chev { width: 14px; height: 14px; transition: transform .15s; }
.lang.open .lang-chev { transform: rotate(180deg); }
.lang-menu {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 60;
  min-width: 184px; max-width: calc(100vw - 32px); padding: 6px;
  border: 1px solid #ffffff14; border-radius: 14px; background: #0f0f1c;
  box-shadow: 0 20px 50px #00000080;
}
.lang-menu[hidden] { display: none; }
.lang .lang-menu a {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 40px; padding: 8px 12px; border-radius: 10px;
  color: #f5f4fc; font-size: 14px; font-weight: 600; line-height: 1.2;
  text-decoration: none; white-space: nowrap;
}
.lang .lang-menu a:hover, .lang .lang-menu a:focus { background: #ffffff0f; color: #fff; outline: none; }
.lang .lang-menu a:focus-visible { box-shadow: inset 0 0 0 2px #f8b416; }
.lang .lang-menu a[aria-checked="true"] { color: #f8b416; }
.lang .lang-menu a[aria-checked="true"]::after { content: "✓"; font-weight: 800; }
@media (prefers-reduced-motion: reduce) {
  .lang-btn, .lang-chev { transition: none; }
}