/* Shared reading typography: the approved Heti serif preview, adapted to this UI. */
:root {
  --font-reading: "Noto Serif SC", "Songti SC", "SimSun", serif;
  --reading-size: 16px;
  --reading-leading: 1.85;
  --reading-measure: 42em;
}

body {
  font-family: var(--font-reading);
  text-autospace: normal;
  line-break: strict;
}

.about-hero h1 { font-family: var(--font-geist-sans), sans-serif; }

/* New pages inherit the serif family; code and explicit UI metadata stay monospace. */
.reading-copy,
.reading-title,
.prose {
  font-family: var(--font-reading);
}

html :is(
  .reading-copy,
  .about-role,
  .about-motto,
  .about-introduction,
  .about-capabilities p,
  .about-career-excerpt,
  .about-tool-body > p,
  .about-job-points p,
  .about-education-copy,
  .about-contact-copy,
  .project-row-body > p,
  .home-essays p,
  .home-personal > div > p:not(.portfolio-kicker)
) {
  font-family: var(--font-reading);
  font-size: var(--reading-size);
  font-weight: 400;
  line-height: var(--reading-leading);
  letter-spacing: .02em;
  overflow-wrap: break-word;
  text-wrap: pretty;
}

html :is(.reading-copy, .about-introduction) :is(p, strong, a) {
  letter-spacing: inherit;
}
html :is(.reading-copy, .about-introduction) strong {
  font-weight: 600;
}
html .about-introduction {
  max-width: var(--reading-measure);
  line-height: 1.95;
}
html :is(.reading-copy, .about-introduction) p + p {
  margin-block-start: 1.1em;
}
html :is(.about-section-head h2, .home-sections h2) {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .02em;
}
html :is(.home-sections h3, .about-career-heading h3, .about-tool-body h3, .about-timeline h3) {
  font-family: var(--font-reading);
  font-size: 21px;
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: .02em;
}
html .about-capabilities h3 {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.55;
}
html :is(.about-capabilities p, .about-tool-body > p, .about-job-points p) {
  font-size: 15px;
}
html .editorial-hero-copy {
  font-family: var(--font-reading);
  max-width: var(--reading-measure);
  font-size: 20px;
  line-height: var(--reading-leading);
  letter-spacing: .02em;
  text-wrap: pretty;
}
html .prose {
  font-size: var(--reading-size);
  line-height: var(--reading-leading);
  letter-spacing: .02em;
  overflow-wrap: break-word;
}

@media (max-width: 760px) {
  :root { --reading-size: 15px; }
  html :is(.about-section-head h2, .home-sections h2) { font-size: 25px; }
  html :is(.home-sections h3, .about-career-heading h3, .about-tool-body h3, .about-timeline h3) { font-size: 20px; }
  html .editorial-hero-copy { font-size: 17px; max-width: 330px; }
  html :is(.about-role, .about-motto) { font-size: 13px; }
}
