/* Language switcher — same grammar as the rest of the header: glass pill, Montserrat,
   Q-mark marker, yellow/orange accent light. Loaded on every page, English included. */
.site-header__cta { display: inline-flex; align-items: center; gap: 10px; }

.lang { position: relative; flex-shrink: 0; }
.lang__btn { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border-radius: 999px; cursor: pointer;
             font: 600 .8rem/1 var(--ui); letter-spacing: .08em; color: inherit;
             background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.07)); border: 1px solid rgba(255,255,255,.32);
             backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3);
             transition: transform .3s var(--ease), background .3s, border-color .3s, box-shadow .3s; }
.lang__btn:hover { transform: translateY(-1px); border-color: rgba(255,235,59,.75); box-shadow: 0 10px 26px -16px rgba(0,0,0,.6); }
.lang__globe { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; }
.lang__chev { font-style: normal; font-size: .62rem; opacity: .7; transition: transform .3s var(--ease); }
.lang.is-open .lang__chev { transform: rotate(180deg); }

body.past-hero .lang__btn { background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(246,245,242,.6)); border-color: var(--line); color: var(--ink); }
body.past-hero .lang__btn:hover { border-color: rgba(255,152,0,.6); }

.lang__menu { position: absolute; top: calc(100% + 12px); right: 0; z-index: 300; width: 330px; padding: 10px; border-radius: 24px;
              background: var(--white); border: 1px solid var(--line); box-shadow: 0 30px 70px -30px rgba(0,0,0,.45), 0 2px 0 rgba(255,255,255,.7) inset;
              display: grid; grid-template-columns: 1fr 1fr; gap: 4px; color: var(--ink);
              opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .28s var(--ease), transform .28s var(--ease), visibility .28s; }
.lang.is-open .lang__menu { opacity: 1; visibility: visible; transform: none; }
.lang__opt { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 11px 12px; border-radius: 15px;
             font: 600 .84rem/1.15 var(--ui); color: var(--ink); transition: background .25s, color .25s; }
.lang__opt:hover { background: linear-gradient(135deg, rgba(255,235,59,.34), rgba(255,152,0,.16)); }
.lang__opt .lang__code2 { font-size: .68rem; letter-spacing: .1em; color: var(--ink-soft); }
.lang__opt.is-on { background: var(--ink); color: var(--white); }
.lang__opt.is-on .lang__code2 { color: rgba(255,255,255,.6); }
.lang__opt.is-on .lang__native { display: inline-flex; align-items: center; gap: 8px; }
.lang__opt.is-on .lang__native::before { content: ""; width: 15px; height: 15px; flex: none; background: url(brand/icon-white.png) center/contain no-repeat; }

@media (max-width: 860px) {
  /* The button sits mid-header on a phone, so anchoring the menu to its right edge threw
     330px of menu off the left of the screen (and off the right in RTL). Below 860px the
     menu leaves the button's coordinate space and spans the viewport gutters instead. */
  .lang__menu { position: fixed; top: var(--header-h, 72px); left: 12px; right: 12px; width: auto;
                max-height: calc(100dvh - var(--header-h, 72px) - 24px); overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .site-header__cta .btn { height: 44px; padding: 0 6px 0 16px; }
  .site-header__cta .btn .arr { width: 32px; height: 32px; }
}
@media (max-width: 520px) {
  .lang__code { display: none; }
  .lang__btn { padding: 0 11px; }
}