/* Переключатель языка — ОДИН компонент на трёх поверхностях: статический лендинг
   (sites/nurion), каталог /projects и кабинет партнёра. Разметку даёт
   src/lib/langSwitcher.js, поведение — public/js/lang.js, а копии этих трёх
   кусков в статические лендинги кладёт tmp/sync-lang-switcher.mjs. Правим здесь,
   потом гоняем скрипт — иначе поверхности разъезжаются.

   Без флагов: флаг обозначает страну, а не язык. «Кыргызча» — это не флаг, а
   English — не Великобритания. Ритм списка, который держали кружки флагов,
   теперь держит колонка кодов, она же повторяет подпись самой кнопки.

   var(--muted,#939393): в приложении токен зовётся --muted, на лендинге —
   --muted-d. Фолбэк даёт один и тот же цвет на обеих поверхностях и позволяет
   файлам оставаться байт-в-байт. */
.lang2{position:relative}
.lang2__btn{display:flex;align-items:center;gap:7px;padding:11px 12px;border:1px solid rgba(0,0,0,.18);font:inherit;font-size:13px;font-weight:600;letter-spacing:.06em;line-height:1;color:var(--ink);background:none;cursor:pointer;transition:border-color .2s}
.lang2__btn:hover{border-color:var(--ink)}
.lang2__btn svg{width:9px;height:6px;flex:none;transition:transform .2s}
.lang2.open .lang2__btn svg{transform:rotate(180deg)}
.lang2__list{position:absolute;top:calc(100% + 6px);right:0;z-index:60;min-width:100%;margin:0;padding:0;list-style:none;background:#fff;border:1px solid rgba(0,0,0,.18);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,transform .18s,visibility .18s}
.lang2.open .lang2__list{opacity:1;visibility:visible;transform:none}
/* Шапка каталога красит в красный любую ссылку внутри себя
   (.hdr__nav a:not(.btn):hover). Свои цвета компонент задаёт сам — селектор той
   же силы, а i18n.css грузится после app.css, поэтому выигрывает он. */
.lang2 a.lang2__i{display:flex;align-items:center;gap:10px;white-space:nowrap;padding:10px 14px 10px 12px;border-left:2px solid transparent;font-size:14px;font-weight:400;line-height:1.2;opacity:1;color:var(--ink);transition:background .16s}
.lang2 a.lang2__i:hover{background:rgba(0,0,0,.05);color:var(--ink)}
.lang2 a.lang2__i i{flex:none;min-width:22px;font-style:normal;font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--muted,#939393)}
.lang2 a.lang2__i--on{border-left-color:var(--red);font-weight:600}
.lang2 a.lang2__i--on i{color:var(--red)}
.lang2__btn:focus-visible,.lang2__i:focus-visible{outline:2px solid var(--red);outline-offset:3px}
@media(max-width:430px){.lang2__btn{padding:9px 10px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.lang2__btn,.lang2__btn svg,.lang2__list,.lang2 a.lang2__i{transition:none}}
