/* Faithful port of the official site's .languages and mobile-language-menu.
   Breakpoint and color token names match the new site's existing shell. */
.desktop-links{gap:clamp(13px,1.55vw,27px)}
.desktop-links .languages{margin-left:4px}
.languages{display:flex;gap:10px;align-items:center;font-size:.92rem}
.languages a[aria-current="page"]{font-weight:800}
.languages a{font-size:13px}
.mobile-controls{display:none;align-items:center;gap:10px}
.lang-select{font:inherit;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:8px 10px;color:var(--ink)}
.mobile-language-options[hidden]{display:none!important}
@media(max-width:1100px){
  .site-header .desktop-links{display:none}
  .site-header .mobile-controls{display:flex}
  .site-header .header-inner{position:relative}
  .mobile-language-menu{position:relative}
  .mobile-controls .mobile-zh-link{font-size:20px;font-weight:800;line-height:1;white-space:nowrap;flex:0 0 auto}
  .mobile-controls .mobile-menu-toggle{font-size:1.0625rem;width:100px;min-width:100px;padding:8px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:absolute;left:50%;transform:translateX(-50%)}
  .mobile-controls .mobile-language-toggle{
    font-size:1.2em;
    padding:5px 8px;
    border-radius:14px;
    line-height:1.2;
    background:var(--card);
    color:var(--ink);
    min-width:54px;
    font-weight:400;
    position:relative;
  }
  .mobile-language-options{
    position:absolute;
    right:0;
    top:calc(100% + 10px);
    z-index:100;
    width:min(260px,calc(100vw - 32px));
    padding:0;
    border:1px solid var(--border);
    border-radius:12px;
    background:var(--section);
    color:var(--ink);
    box-shadow:0 14px 34px rgba(50,55,58,.16);
    opacity:0;
    transform:translateY(-8px) scale(.98);
    transform-origin:top right;
    transition:opacity 180ms cubic-bezier(.22,1,.36,1),transform 180ms cubic-bezier(.22,1,.36,1);
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:repeat(2,1fr);
    overflow:hidden;
  }
  .mobile-language-options.is-open{opacity:1;transform:translateY(0) scale(1)}
  .mobile-language-options a{display:flex;align-items:center;justify-content:center;min-height:82px;padding:12px;border-radius:0;white-space:nowrap;background:transparent;color:var(--ink);font-size:1rem;text-align:center}
  .mobile-language-options a:nth-child(odd){border-right:1px solid var(--border)}
  .mobile-language-options a:nth-child(-n+2){border-bottom:1px solid var(--border)}
  html[dir="rtl"] .mobile-language-options a:nth-child(odd){border-right:0;border-left:1px solid var(--border)}
  .mobile-language-options a:hover,.mobile-language-options a:focus-visible,.mobile-language-options a[aria-current="page"]{background:var(--card)}
  .mobile-language-options a:focus-visible{outline:none;box-shadow:inset 0 0 0 3px rgba(113,128,138,.45)}
  html[dir="rtl"] .mobile-language-options{right:auto;left:0;transform-origin:top left}
  .site-header .menu-toggle{display:block;width:100px;height:auto;min-height:40px;background:var(--card);border-radius:10px;white-space:nowrap;text-align:center}
  .site-header .mobile-controls{gap:10px}
  .site-header .mobile-menu:not([hidden]){display:flex;flex-direction:column;padding:15px 32px 25px;background:var(--page);border-top:1px solid var(--border)}
  .site-header .mobile-menu a{padding:12px 0;border-bottom:1px solid var(--border)}
}
@media(max-width:360px){
  .site-header .header-inner{gap:8px}
  .mobile-controls{gap:4px}
}
@media(max-width:340px){
  .mobile-controls .mobile-menu-toggle{width:84px;min-width:84px}
  html[lang^="es"] .mobile-controls .mobile-menu-toggle{font-size:.95rem;padding-left:2px;padding-right:2px}
}
@media(max-width:320px){
  html[dir="rtl"] .mobile-controls .mobile-menu-toggle{width:68px;min-width:68px;padding-left:2px;padding-right:2px}
}
@media(prefers-reduced-motion:reduce){.mobile-language-options{transition:none}}
/* Give the centered mobile service control its own space between the wordmark
   and the independent language controls; never overlay the logo. */
@media(max-width:600px){
  .site-header .wordmark-frame{--wm-scale:.52!important}
  .mobile-controls .mobile-menu-toggle{left:calc(50% + 24px);width:88px;min-width:88px}
}
@media(max-width:350px){
  .site-header .wordmark-frame{--wm-scale:.47!important}
  .mobile-controls .mobile-menu-toggle{left:calc(50% + 19px);width:79px;min-width:79px;font-size:.95rem}
}