/* The language menu in the header of every marketing page. Uses the page's own
   variables (both public/static-pages.css and the landing page define them), so
   it follows the page into light and dark. Generated markup: bin/build-site-i18n.mjs. */
.bar-end{display:flex;align-items:center;gap:18px}
.lang-menu{position:relative}
.lang-menu summary{
  list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:6px 11px;
  transition:color .2s,border-color .2s;
}
.lang-menu summary::-webkit-details-marker{display:none}
.lang-menu summary:hover,.lang-menu[open] summary{color:var(--bone);border-color:var(--faded)}
.lang-menu summary:focus-visible{outline:2px solid var(--faded);outline-offset:2px}
.lang-menu ul{
  position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:190px;margin:0;padding:6px;list-style:none;
  background:var(--raw-2);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 18px 40px -18px var(--phone-shadow,rgba(0,0,0,.5));
  max-height:min(70vh,460px);overflow-y:auto;
}
.lang-menu li{margin:0}
.lang-menu a{
  display:block;padding:8px 12px;border-radius:8px;font-family:var(--font-body,inherit);font-size:14px;
  color:var(--muted);text-decoration:none;text-transform:none;letter-spacing:0;
}
.lang-menu a:hover{background:var(--tint,rgba(112,149,186,.1));color:var(--bone)}
.lang-menu a[aria-current="true"]{color:var(--bone);font-weight:600}