/* Перемикач мов у шапці. Малюється скриптом js/lang.js. */
.langsw{position:relative;flex:0 0 auto}

.langsw__btn{display:inline-flex;align-items:center;gap:.35rem;
  padding:.42rem .6rem;border:1px solid rgba(255,255,255,.16);
  border-radius:.5rem;background:transparent;color:inherit;cursor:pointer;
  font:inherit;font-size:.8rem;font-weight:600;letter-spacing:.04em;
  line-height:1;transition:border-color .18s,background-color .18s}
.langsw__btn:hover{border-color:currentColor}
.langsw__btn:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.langsw__btn svg{transition:transform .18s;opacity:.6}
.langsw.is-on .langsw__btn svg{transform:rotate(180deg)}

.langsw__list{position:absolute;top:calc(100% + .4rem);right:0;z-index:60;
  min-width:10.5rem;margin:0;padding:.3rem;list-style:none;
  border:1px solid rgba(255,255,255,.10);border-radius:.6rem;
  background:#252220;color:#F5F2EC;
  box-shadow:0 14px 34px rgba(0,0,0,.42);
  opacity:0;visibility:hidden;transform:translateY(-.3rem);
  transition:opacity .16s,transform .16s,visibility .16s}
.langsw.is-on .langsw__list{opacity:1;visibility:visible;transform:none}

.langsw__list a{display:block;padding:.5rem .6rem;border-radius:.4rem;
  color:inherit;text-decoration:none;font-size:.88rem;line-height:1.2}
.langsw__list a:hover{background:rgba(255,255,255,.08)}
.langsw__list a[aria-current]{font-weight:700;color:#C4A874}
.langsw__list a[aria-current]::after{content:'✓';float:right;opacity:.5}

/* Перемикач живе тільки у верхній панелі, а вона на сайті завжди темна.
   Якщо колись зʼявиться світла шапка — ось світлий варіант. */
.layer-light .langsw__btn{border-color:rgba(22,20,19,.18)}
.layer-light .langsw__list{background:#FFFFFF;color:#131110;
  border-color:rgba(22,20,19,.11);box-shadow:0 14px 34px rgba(0,0,0,.14)}
.layer-light .langsw__list a:hover{background:rgba(22,20,19,.06)}
.layer-light .langsw__list a[aria-current]{color:#7A6540}

@media (max-width:520px){
  .langsw__btn{padding:.38rem .5rem;font-size:.75rem}
  .langsw__list{min-width:9rem}
}