/* Language menu + multi-language typography for 12-13 Richmond Buildings */

/* The header uses paint containment, which would clip the dropdown */
header.header-critical { contain: none !important; }

.lm-wrap { display: flex; align-items: center; gap: 12px; }
.lm { position: relative; }
.lm-btn {
  display: inline-flex; align-items: center; gap: 8px;
  height: 40px; padding: 0 14px;
  background: transparent; color: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.28); border-radius: 999px;
  font: 500 14px/1 "Figtree Variable", Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: .3px; cursor: pointer;
  transition: border-color .2s ease, color .2s ease;
}
.lm-btn:hover, .lm-btn[aria-expanded="true"] { border-color: hsl(41 98% 59%); color: #fff; }
.lm-btn:focus-visible { outline: 2px solid hsl(41 98% 59%); outline-offset: 3px; }
.lm-globe { flex: none; opacity: .85; }
.lm-chev { flex: none; opacity: .7; transition: transform .2s ease; }
.lm-btn[aria-expanded="true"] .lm-chev { transform: rotate(180deg); }

.lm-menu {
  position: absolute; top: calc(100% + 10px); inset-inline-end: 0; z-index: 60;
  min-width: 232px; margin: 0; padding: 6px; list-style: none;
  background: #111; border: 1px solid rgba(255,255,255,.12); border-radius: 12px;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.lm-menu.lm-open { opacity: 1; visibility: visible; transform: none; transition: opacity .18s ease, transform .18s ease; }
.lm-item {
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
  padding: 10px 12px; border-radius: 8px; text-decoration: none;
  color: rgba(255,255,255,.9);
}
.lm-item:hover, .lm-item:focus-visible { background: rgba(255,255,255,.07); outline: none; }
.lm-item[aria-current="page"] { color: hsl(41 98% 59%); }
.lm-native { font: 500 15px/1.3 "Figtree Variable", Figtree, "PingFang SC", "Hiragino Sans", "Microsoft YaHei", "Yu Gothic", "Noto Sans SC", "Noto Sans JP", "Geeza Pro", "Noto Sans Arabic", "Segoe UI", sans-serif; letter-spacing: 0; }
.lm-en { font: 400 11px/1.3 "Figtree Variable", Figtree, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.45); }
.lm-item[aria-current="page"] .lm-en { color: hsl(41 98% 59% / .7); }

@media (max-width: 380px) {
  .lm-btn { padding: 0 11px; }
  .lm-cur { max-width: 74px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* Chinese (Simplified) */
html[lang^="zh"] body { font-family: "Figtree Variable", Figtree, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "Source Han Sans SC", sans-serif; }
html[lang^="zh"] .type-display, html[lang^="zh"] .type-h2, html[lang^="zh"] .font-display {
  font-family: "Playfair Display", "Songti SC", "Noto Serif SC", "Source Han Serif SC", "STSong", "SimSun", serif;
}

/* Japanese */
html[lang="ja"] body { font-family: "Figtree Variable", Figtree, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic", "Meiryo", "Noto Sans JP", sans-serif; }
html[lang="ja"] .type-display, html[lang="ja"] .type-h2, html[lang="ja"] .font-display {
  font-family: "Playfair Display", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif JP", serif;
}
html[lang="ja"] { line-break: strict; }

/* Arabic */
html[lang="ar"] body { font-family: "Figtree Variable", Figtree, "Noto Sans Arabic", "Geeza Pro", "Segoe UI", Tahoma, sans-serif; }
html[lang="ar"] .type-display, html[lang="ar"] .type-h2, html[lang="ar"] .font-display {
  font-family: "Playfair Display", "Noto Naskh Arabic", "Amiri", "Geeza Pro", "Times New Roman", serif;
}
html[lang="ar"] body, html[lang="ar"] body * { letter-spacing: 0 !important; } /* spacing breaks Arabic letter joining */

/* CJK and Arabic need more line height than the Latin display sizes allow */
html[lang^="zh"] .type-display, html[lang="ja"] .type-display, html[lang="ar"] .type-display { line-height: 1.3; }
html[lang^="zh"] .type-h2, html[lang="ja"] .type-h2, html[lang="ar"] .type-h2 { line-height: 1.35; }
html[lang^="zh"] .type-label, html[lang="ja"] .type-label { letter-spacing: .08em; }

/* Right-to-left fixes */
[dir="rtl"] .text-left { text-align: right; }
[dir="rtl"] .ml-2 { margin-left: 0; margin-right: .5rem; }
[dir="rtl"] .mr-2 { margin-right: 0; margin-left: .5rem; }
[dir="rtl"] .lucide-external-link { transform: scaleX(-1); }
[dir="rtl"] svg { direction: ltr; } /* keep map labels and icons laid out as drawn */
