/* Localized-page additions to the "Paper & Keys" system.
   Kept in a SEPARATE file loaded only by /<locale>/ pages, so shipping the
   international tree does not force a site.css cache-bust across the 45 live
   English pages (CSS_V is shared, and bumping it re-fetches everything). */

/* --- Language switcher (footer) --- */
footer .langlabel {
  color: var(--paper-2);
  font-size: 12px;
  font-weight: 600;
  margin: 4px 0 10px;
  font-family: var(--mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
}
footer .langswitch {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 14px;
  margin: 0 auto 26px;
  max-width: 780px;
  font-size: 13.5px;
  line-height: 1.7;
}
footer .langswitch a { color: #C9BDA6; white-space: nowrap; }
footer .langswitch a:hover { color: var(--amber); }
footer .langswitch a[aria-current="true"] {
  color: var(--paper-2);
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* A single-column footer needs a narrower measure than the English 4-column
   one, or the links stretch the full 980px and read as a list of orphans. */
footer .fcols { grid-template-columns: minmax(0, 1fr); max-width: 420px; margin-inline: auto; }
@media (min-width: 700px) {
  footer .fcols { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 620px; }
}

/* --- CJK typography ---
   Fraunces has no CJK coverage, so headings in ja/ko/zh fall back to whatever
   the OS picks — usually a mismatched weight. Name the system CJK faces and
   drop the tight Latin letter-spacing, which looks broken on ideographs. */
html[lang="ja"] h1, html[lang="ja"] h2, html[lang="ja"] h3,
html[lang="ko"] h1, html[lang="ko"] h2, html[lang="ko"] h3,
html[lang="zh-Hans"] h1, html[lang="zh-Hans"] h2, html[lang="zh-Hans"] h3 {
  font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic',
               'Apple SD Gothic Neo', 'PingFang SC', 'Noto Sans CJK',
               var(--sans);
  letter-spacing: 0;
  font-weight: 700;
}
html[lang="ja"] h1, html[lang="ko"] h1, html[lang="zh-Hans"] h1 { font-size: 38px; line-height: 1.3; }
html[lang="ja"] h2, html[lang="ko"] h2, html[lang="zh-Hans"] h2 { font-size: 26px; line-height: 1.4; }
html[lang="ja"] p, html[lang="ko"] p, html[lang="zh-Hans"] p { line-height: 1.9; }

/* The eyebrow and breadcrumb are styled for Latin: uppercase + wide tracking.
   `text-transform` does nothing to CJK, while the tracking pushes ideographs
   apart and strands a single character on its own line (observed: a lone 「ス」
   under the Japanese homepage eyebrow). Ideographs are already uniform-width —
   they need neither treatment. */
html[lang="ja"] .eyebrow, html[lang="ko"] .eyebrow, html[lang="zh-Hans"] .eyebrow,
html[lang="th"] .eyebrow, html[lang="ja"] .crumb, html[lang="ko"] .crumb,
html[lang="zh-Hans"] .crumb, html[lang="th"] .crumb {
  /* font-family matters as much as the tracking: site.css sets these to
     var(--mono), and a monospace fallback renders CJK and Thai in mismatched,
     often synthetically-widened forms. */
  font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic',
               'Apple SD Gothic Neo', 'PingFang SC', 'Noto Sans CJK',
               'Noto Sans Thai', var(--sans);
  letter-spacing: 0;
  text-transform: none;
  word-break: normal;
  overflow-wrap: anywhere;
  line-height: 1.7;
}

/* Thai and Hindi need extra leading or diacritics collide with the line above. */
html[lang="th"] p, html[lang="hi"] p { line-height: 2; }
html[lang="th"] h1, html[lang="hi"] h1 { line-height: 1.4; }