/* Cyber Pusa — language switch and Chinese typography */

/* EN · 中 toggle */
.lang {
  display: flex;
  align-items: center;
  gap: .45rem;
  padding-left: 2rem;
  border-left: 1px solid var(--hair);
  font: 400 .8125rem/1 var(--f-mono);
  color: var(--hair-2);
}
.lang button {
  appearance: none;
  margin: 0;
  padding: .3rem .15rem;
  border: 0;
  background: none;
  font: inherit;
  letter-spacing: .14em;
  color: var(--mute);
  cursor: pointer;
  transition: color .4s var(--ease);
}
.lang button[lang="zh-Hans"] { font-family: var(--f-zh); font-size: .9rem; letter-spacing: 0; }
.lang button:hover, .lang button[aria-pressed="true"] { color: var(--paper); }
.lang button[aria-pressed="true"] { cursor: default; }
.lang button:focus-visible { outline: 1px solid var(--gold); outline-offset: 3px; }
@media (max-width: 720px) {
  .lang { padding-left: 0; border-left: 0; }
}

/* section labels: the other language sits on the right of the hairline */
.label__en { display: none; margin-left: auto; color: var(--paper-dim); }
html[lang="zh-Hans"] .label > [lang="zh-Hans"] { display: none; }
html[lang="zh-Hans"] .label__en { display: inline; }

/* Chinese mode: Latin stays in the Garamonds and Plex, Han falls through to Noto Serif SC */
html[lang="zh-Hans"] {
  --f-display: "Cormorant Garamond", "Noto Serif SC", "Songti SC", serif;
  --f-body: "EB Garamond", "Noto Serif SC", "Songti SC", serif;
  --f-mono: "IBM Plex Mono", "Noto Serif SC", "Songti SC", monospace;
}
html[lang="zh-Hans"] body { line-height: 1.9; letter-spacing: .03em; }
html[lang="zh-Hans"] .hero__lede { line-height: 1.7; font-weight: 300; }
html[lang="zh-Hans"] .promises__ai { font-style: normal; font-size: 1.15rem; letter-spacing: .06em; }
html[lang="zh-Hans"] .precepts h3 { font-size: 1.45rem; line-height: 1.5; letter-spacing: .06em; }
html[lang="zh-Hans"] .rescue__title { letter-spacing: .08em; }

/* the vow in Chinese: large, upright, two lines */
html[lang="zh-Hans"] .vow__quote p {
  max-width: none;
  white-space: pre-line;
  font: 300 clamp(1.75rem, 3vw, 2.6rem)/1.8 var(--f-zh);
  letter-spacing: .16em;
}
/* …and the English vow moves into the vertical column, set sideways and quiet */
html[lang="zh-Hans"] .vow__zh {
  inline-size: 20rem;
  white-space: normal;
  font: italic 300 1.2rem/1.7 var(--f-display);
  letter-spacing: .02em;
}
@media (max-width: 720px) {
  html[lang="zh-Hans"] .vow__zh { inline-size: auto; }
}
