/* Language dropdown (see lang-menu.js). */
.lang { position: relative; }
.lang-btn { display: flex; align-items: center; gap: 6px; background: none; border: 1px solid rgba(255, 255, 255, .09); color: #f3f5f8; border-radius: 999px; padding: 6px 12px; font: 600 11px Inter, system-ui, sans-serif; letter-spacing: .08em; cursor: pointer; }
.lang-btn svg { width: 12px; height: 12px; }
.lang-list { position: absolute; right: 0; top: calc(100% + 8px); min-width: 190px; margin: 0; padding: 6px; list-style: none; background: rgba(16, 18, 22, .97); border: 1px solid rgba(255, 255, 255, .09); border-radius: 14px; backdrop-filter: blur(14px); box-shadow: 0 12px 40px rgba(0, 0, 0, .45); z-index: 60; }
.lang-list button { width: 100%; display: flex; justify-content: space-between; gap: 12px; background: none; border: 0; color: #a9b0bb; padding: 9px 12px; border-radius: 9px; font: 500 14px Inter, system-ui, sans-serif; cursor: pointer; text-align: left; }
.lang-list button b { font-size: 11px; letter-spacing: .08em; color: #6f7784; }
.lang-list button:hover, .lang-list button[aria-selected="true"] { background: rgba(255, 255, 255, .07); color: #f3f5f8; }
/* Over the light hero picture the closed button is dark, like the menu links. */
header.site:not(.scrolled) .lang-btn.on-light, header.site.on-light:not(.scrolled) .lang-btn { color: #0a0b0d; border-color: rgba(10, 11, 13, .35); }