.topbar { justify-content: initial; gap: clamp(24px, 3vw, 52px); font-family: 'SimSun', 'Songti SC', 'Noto Serif SC', serif; font-size: 18px; }
.topbar .brand { flex: 0 0 auto; white-space: nowrap; font: 700 18px/1.3 'SimSun', 'Songti SC', 'Noto Serif SC', serif; }
.topbar nav { flex: 1; justify-content: center; font-size: 18px; }
.topbar nav a { gap: 8px; font-weight: 700; white-space: nowrap; }
.topbar nav a span { font: 600 18px/1.3 'SimSun', 'Songti SC', 'Noto Serif SC', serif; color: #9b8d7d; }
.topbar nav a:hover span, .topbar nav a:focus-visible span { color: var(--color-red); }
.topbar-note { flex: 0 0 auto; font-size: 18px; white-space: nowrap; }

.prologue { padding-top: clamp(76px, 9vw, 120px); padding-bottom: clamp(80px, 9vw, 120px); }
.prologue .section-head { max-width: 760px; }
.prologue .kicker { font-size: 25px; font-weight: 700; letter-spacing: .04em; }
.prologue .section-head h2 { margin-top: 20px; margin-bottom: 16px; }
.prologue .section-head p { margin: 0; }
.prologue .stat-feature { margin-top: 44px; }
.prologue .stat-grid { gap: 16px; }
.prologue .timeline button.chosen { border-top-color: var(--color-red-dark); color: var(--color-red-dark); }
.prologue .timeline button.chosen::before { width: 12px; height: 12px; top: -7px; background: var(--color-red-dark); }
.prologue .stat-card { border-top: 2px solid var(--color-red-dark); }

@media (max-width: 1050px) {
  .topbar-note { display: none; }
}
@media (max-width: 720px) {
  :root { --header-height: 104px; }
  .topbar { height: 104px; display: block; padding-top: 12px; padding-bottom: 8px; }
  .topbar .brand { display: block; font-size: 18px; }
  .topbar nav { justify-content: flex-start; gap: 24px; width: 100%; margin-top: 8px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: var(--color-gold) transparent; font-size: 18px; }
  .topbar nav a span { display: inline; }
}
@media (max-width: 430px) {
  .topbar .brand span:last-child { max-width: none; }
  .topbar nav { gap: 20px; }
  .topbar nav a { font-size: 18px; }
}
