/* ============================================================
   TYPOGRAPHY — กฎฟอนต์ 3 ภาษา (Latin / Thai / Chinese)
   ============================================================ */
body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: 400;
  color: var(--c-graphite);
  background: var(--c-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ---------- ภาษาไทย: line-height สูงกว่า กันสระบน/ล่างชนกัน ---------- */
html[lang="th"] {
  --font-body: 'IBM Plex Sans Thai', 'Inter', sans-serif;
  --font-display: 'Noto Serif Thai', 'Cormorant Garamond', serif;
  --lh-body: 1.85;
  letter-spacing: 0;
}
html[lang="th"] h1, html[lang="th"] h2, html[lang="th"] h3, html[lang="th"] h4,
html[lang="th"] .h2, html[lang="th"] .h3,
html[lang="th"] .hero__title, html[lang="th"] .about__quote p, html[lang="th"] .pm__title {
  line-height: 1.45;
  letter-spacing: 0;
  text-transform: none;
  word-break: normal;
}
html[lang="th"] .eyebrow { text-transform: none; letter-spacing: .04em; }

/* ---------- ภาษาจีน ---------- */
html[lang="zh"] {
  --font-body: 'Noto Sans SC', 'Inter', sans-serif;
  --font-display: 'Noto Serif SC', 'Cormorant Garamond', serif;
  --lh-body: 1.8;
  letter-spacing: .02em;
}
html[lang="zh"] h1, html[lang="zh"] h2, html[lang="zh"] h3, html[lang="zh"] h4,
html[lang="zh"] .h2, html[lang="zh"] .h3,
html[lang="zh"] .hero__title, html[lang="zh"] .about__quote p, html[lang="zh"] .pm__title {
  line-height: 1.4;
  letter-spacing: .02em;
  text-transform: none;
}
html[lang="zh"] .eyebrow { text-transform: none; letter-spacing: .12em; }
html[lang="zh"] p { text-justify: inter-ideograph; }
html[lang="zh"] .lead, html[lang="zh"] .section-head__intro { text-align: justify; }

/* ---------- หัวข้อ ---------- */
h1, .hero__title {
  font-family: var(--font-display);
  font-size: var(--fs-h1);
  font-weight: 400;
  line-height: 1.06;
  letter-spacing: -.02em;
  color: var(--c-black);
}
h2, .h2 {
  font-family: var(--font-display);
  font-size: var(--fs-h2);
  font-weight: 400;
  line-height: 1.14;
  letter-spacing: -.02em;
  color: var(--c-black);
}
h3, .h3 {
  font-family: var(--font-body);
  font-size: var(--fs-h3);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -.01em;
  color: var(--c-black);
}
h4 { font-size: 1.0625rem; font-weight: 500; line-height: 1.4; color: var(--c-black); }

p { max-width: 68ch; }
p + p { margin-top: var(--sp-2); }

.lead { font-size: 1.1875rem; color: var(--c-graphite); }

/* ---------- Eyebrow (uppercase เฉพาะ EN) ---------- */
.eyebrow {
  display: flex; align-items: center; gap: var(--sp-2);
  font-size: .75rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--c-grey-500);
  margin-bottom: var(--sp-3);
}
.eyebrow .num { color: var(--c-accent); font-variant-numeric: tabular-nums; }
.eyebrow .num::after {
  content: ''; display: inline-block; width: 28px; height: 1px;
  background: var(--c-sand); margin-left: var(--sp-2); vertical-align: middle;
}
.eyebrow--light { color: rgba(255,255,255,.72); }
.eyebrow--center { justify-content: center; }

.sub-label {
  font-size: .8125rem; font-weight: 500; text-transform: uppercase; letter-spacing: .16em;
  color: var(--c-grey-500); padding-bottom: var(--sp-2);
  border-bottom: var(--line); margin-bottom: var(--sp-3);
}
html[lang="th"] .sub-label, html[lang="zh"] .sub-label { text-transform: none; letter-spacing: .06em; }
.sub-label--mt { margin-top: clamp(64px, 8vw, 112px); }