/* ---------- i18n (11.10.2026): kielivaihtaja FI / EN ----------
   Navissa teemanapin vasemmalla puolella: sama maitolasipilleri kuin .nav_theme (korkeus 2,75rem), cap-tyylinen tunnus.
   Valikon alarivillä (.menu_foot) tekstilinkki, jotta vaihtaja löytyy myös kapeassa mobiiliheaderissa.
   Kerrosnäkymässä (floor.js) oma .fl_lang teemanapin vieressä. Alleviivaus aina suora (ei kaarevaa). */
.nav_lang{position:relative;flex:none;height:2.75rem;min-width:2.75rem;padding:0 .9rem;border-radius:100px;display:inline-flex;align-items:center;justify-content:center;
  font-size:.6875rem;line-height:1;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:#f7f7f5;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.42);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 10px 26px -14px rgba(0,0,0,.55);transition:color .6s var(--out),background-color .45s var(--out),border-color .45s var(--out),box-shadow .45s var(--out),opacity .4s}
.nav_lang span{position:relative;padding-left:.14em}
.nav_lang span::after{content:"";position:absolute;left:.14em;right:0;bottom:-.3em;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--out)}
.nav_lang:hover,.nav_lang:focus-visible{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.7)}
.nav_lang:hover span::after,.nav_lang:focus-visible span::after{transform:scaleX(1)}
.nav_lang:focus-visible{outline:2px solid var(--accent-l);outline-offset:3px}
html.ui-dark:not(.menu-open):not(.in-room) .nav_lang{color:var(--ink);background:rgba(255,255,255,.32);border-color:rgba(255,255,255,.66);box-shadow:0 10px 26px -14px rgba(10,14,30,.4)}
html.ui-dark:not(.menu-open):not(.in-room) .nav_lang:hover,html.ui-dark:not(.menu-open):not(.in-room) .nav_lang:focus-visible{background:rgba(255,255,255,.55);border-color:#fff}
/* kapealla ruudulla navissa ei ole tilaa neljälle osalle: vaihtaja löytyy valikon alariviltä */
@media (max-width:479px){.nav_lang{display:none}}

/* valikon alarivi */
.menu_lang{align-self:flex-end;display:inline-flex;align-items:center;gap:.6rem;color:var(--faint)}
.menu_lang a{color:var(--fg);border-bottom:1px solid rgba(247,247,245,.35);padding-bottom:.15rem;transition:color .3s,border-color .3s}
.menu_lang a:hover,.menu_lang a:focus-visible{color:#fff;border-color:var(--accent-l)}

/* kerrosnäkymä: pilleri teemanapin vasemmalla (desktop), mobiilissa teemanapin alla */
.fl_lang{position:absolute;right:calc(var(--fl-ui) + 3.85rem);top:1.35rem;z-index:6;height:3.25rem;min-width:3.25rem;padding:0 1rem;border-radius:100px;display:inline-flex;align-items:center;justify-content:center;
  font-size:.75rem;line-height:1;letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.fl_lang:hover,.fl_lang:focus-visible{background:#fff;color:var(--fl-ink);border-color:#fff!important}
.fl .fl_lang:focus-visible{outline:2px solid #fff;outline-offset:3px}
.fl .fl_lang{transition:opacity .6s ease .5s,background-color .35s var(--fl-out),color .35s var(--fl-out),border-color .35s var(--fl-out)}
.fl.is-pre .fl_lang,.fl.t-win .fl_lang{opacity:0}
.fl.is-out .fl_lang{opacity:0;transition:opacity .35s ease}
@media (max-width:899px){
  .fl_lang{position:fixed;right:auto;left:max(.75rem,env(safe-area-inset-left));top:calc(max(.75rem,env(safe-area-inset-top)) + 7rem);height:3rem;min-width:3rem;padding:0 .9rem}
}