@font-face {
  font-family: "Manrope";
  src: url("fonts/Manrope-Variable.ttf") format("truetype");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --reading-font: "Manrope", "PingFang SC", "Microsoft YaHei", sans-serif;
  --sans: var(--reading-font);
  --serif: var(--reading-font);
}

body {
  font-family: var(--reading-font);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.8;
  font-synthesis: none;
}

h1, h2, h3 {
  font-family: var(--reading-font);
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0;
}

.brand-name, .brand-mark, .author-symbol, .author-identity h3,
.quote-band p, .footer-signature strong, .about-poster p,
.about-poster .big-l, .path-number, .article-content blockquote {
  font-family: var(--reading-font);
  font-style: normal;
}

.brand-name { font-size: 28px; font-weight: 600; letter-spacing: -0.5px; }
.hero h1 { font-size: 52px; font-weight: 500; line-height: 1.45; letter-spacing: 0; }
.hero .intro { font-size: 17px; line-height: 1.8; }
.section-title { font-size: 28px; font-weight: 500; letter-spacing: 0; }
.article-row h3, .archive-list .article-row h3 {
  font-size: 22px; font-weight: 500; line-height: 1.6; letter-spacing: 0;
}
.article-row p, .archive-list .article-row p { font-size: 17px; line-height: 1.8; }
.article-meta, .sample-pill, .section-en, .hero-note, .list-note,
.brand-subtitle, .eyebrow, .filter, .strip-label, .illustration-caption,
.card-eyebrow, .author-identity span, .author-tags span, .pathway small,
.archive-count, .breadcrumb, .toc p, .toc a, .article-end span,
.about-aside .aside-note, .site-footer { font-size: 13px; }
.section-en, .eyebrow, .card-eyebrow, .toc p { letter-spacing: 0.04em; }
.sample-pill { line-height: 1.6; }
.strip-items, .pathway strong, .pathways h3, .author-card p,
.about-principles strong, .about-principles p { font-size: 15px; }
.page-heading h1, .about-content h1 { font-size: 48px; line-height: 1.45; font-weight: 500; }
.page-heading p, .about-content p { font-size: 17px; line-height: 1.8; }
.article-header h1 { font-size: 40px; font-weight: 500; line-height: 1.5; letter-spacing: 0; }
.article-description, .article-content { font-size: 17px; line-height: 1.8; }
.article-content h2, .about-content h2 { font-size: 28px; font-weight: 500; line-height: 1.55; letter-spacing: 0; }
.article-content h3 { font-size: 22px; font-weight: 500; }
.article-content strong, .about-content strong { font-weight: 600; }
.sample-notice { font-size: 14px; line-height: 1.8; }
.article-content table { font-size: 15px; }
.article-content th { font-weight: 500; }
.search-field input { font-size: 15px; }
.toc a { line-height: 1.8; }
.about-content .lede { font-family: var(--reading-font); font-size: 21px; line-height: 1.8; }

@media (max-width: 1000px) {
  .hero h1 { font-size: 44px; }
}

@media (max-width: 760px) {
  .hero h1 { font-size: 38px; }
  .page-heading h1, .about-content h1 { font-size: 38px; }
  .article-header h1 { font-size: 32px; }
  .section-title, .article-content h2, .about-content h2 { font-size: 26px; }
  .article-row h3, .archive-list .article-row h3 { font-size: 21px; }
  .hero .intro, .article-row p, .archive-list .article-row p,
  .article-description, .article-content, .about-content p { font-size: 17px; }
  .article-meta, .sample-pill, .filter, .section-en, .brand-subtitle,
  .hero-note, .eyebrow, .site-footer, .toc a { font-size: 13px; }
  .article-content table { font-size: 14px; }
}

@media (max-width: 460px) {
  .hero h1 { font-size: 36px; letter-spacing: 0; }
  .article-header h1 { font-size: 30px; }
  .article-row, .archive-list .article-row {
    grid-template-columns: minmax(0, 1fr) 72px;
  }
  .article-row h3, .archive-list .article-row h3 { font-size: 20px; }
  .article-row p, .archive-list .article-row p { font-size: 16px; }
  .strip-items { flex-wrap: wrap; row-gap: 8px; }
}
