/* Переключатель языка в шапке (2026-11-01, чат «SEO, блог и ссылки»): блог (scripts/build-blog.mjs) и нишевые
   лендинги на языках (scripts/i18n-landings.mjs). Без JS: <details>. Цвета шапки берёт из styles.css (--w-*). */

.lang-switch{position:relative;flex:0 0 auto}
.lang-switch>summary{list-style:none;display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none;
  color:var(--w-70);font-size:14px;font-weight:600;letter-spacing:.03em;padding:9px 10px;border-radius:9px}
.lang-switch>summary::-webkit-details-marker{display:none}
.lang-switch>summary:hover,.lang-switch[open]>summary{color:#fff;background:var(--w-07)}
.lang-switch>summary:focus-visible{outline:2px solid var(--cyan,#5fd4ff);outline-offset:2px}
.lang-switch>summary svg{width:16px;height:16px;flex:0 0 auto;opacity:.85}
.lang-switch>summary::after{content:"";width:5px;height:5px;margin-left:1px;border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.7}
.lang-switch[open]>summary::after{transform:translateY(1px) rotate(225deg)}
.lang-switch ul{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:188px;margin:0;padding:6px;list-style:none;
  background:rgba(10,15,26,.97);border:1px solid var(--w-12);border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.lang-switch li>a,.lang-switch li>span{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:9px 12px;border-radius:8px;font-size:14px;line-height:1.2;color:var(--w-70)}
.lang-switch li>a:hover{color:#fff;background:var(--w-07)}
.lang-switch li>span{color:#fff;font-weight:600}
.lang-switch li b{font-size:11px;font-weight:600;letter-spacing:.05em;opacity:.5}

/* Узкий телефон: в шапке только глобус, код языка прячется, список тот же. */
@media (max-width:420px){
  .lang-switch>summary{padding:9px 8px;gap:4px}
  .lang-switch>summary .lang-code{display:none}
}