:root {
  --navy: #102a43;
  --navy-soft: #334e68;
  --burgundy: #8b2635;
  --paper: #fbfaf7;
  --ink: #20252a;
  --muted: #66717b;
  --line: #d8d4cb;
  --serif: Georgia, "Noto Serif SC", "Songti SC", "Times New Roman", serif;
  --sans: Inter, "Noto Serif SC", "Songti SC", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--navy-soft); text-decoration-color: #9dabb7; text-underline-offset: 3px; }
a:hover { color: var(--burgundy); text-decoration-color: var(--burgundy); }
.container, .nav-inner { width: min(1060px, calc(100% - 48px)); margin: 0 auto; }

.site-nav {
  position: sticky; top: 0; z-index: 10;
  color: #fff; background: rgba(16, 42, 67, .97);
  border-bottom: 3px solid var(--burgundy);
}
.nav-inner { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { color: #fff; font: 700 18px/1 var(--serif); letter-spacing: .02em; text-decoration: none; }
.nav-links { display: flex; gap: 28px; }
.nav-links a { color: #d9e2ec; font-size: 13px; font-weight: 600; letter-spacing: .03em; text-decoration: none; }
.nav-links a:hover { color: #fff; }

.hero { padding: 64px 0 58px; border-bottom: 1px solid var(--line); background: #f1f0eb; }
.hero-grid { display: grid; grid-template-columns: minmax(0,1fr) 220px; gap: 68px; align-items: center; }
.eyebrow { margin: 0 0 18px; color: var(--burgundy); font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
h1 { margin: 0; color: var(--navy); font: 700 clamp(46px, 6vw, 68px)/1.02 var(--serif); letter-spacing: -.025em; }
h1 span { display: inline; margin-left: 15px; color: #5c6770; font: 400 .52em/1.2 var(--serif); letter-spacing: 0; }
.hero-lead { max-width: 670px; margin: 25px 0 0; color: #435363; font: 400 clamp(18px,2vw,21px)/1.6 var(--serif); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 28px; }
.button { display: inline-flex; align-items: center; min-height: 38px; padding: 0; border: 0; border-bottom: 2px solid var(--burgundy); color: var(--navy); background: none; border-radius: 0; font-family: var(--serif); font-size: 15px; font-weight: 700; text-decoration: none; }
.button.secondary { color: var(--navy); border-color: #8da0b0; }
.portrait-wrap { position: relative; padding: 9px; background: #fff; border: 1px solid #c9c4ba; box-shadow: 0 8px 24px rgba(16,42,67,.1); }
.portrait-wrap::before { display: none; }
.portrait { display: block; width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center top; filter: saturate(.88); }

main.container { padding-bottom: 78px; }
.content-section { scroll-margin-top: 78px; display: grid; grid-template-columns: 155px minmax(0,1fr); gap: 48px; padding: 52px 0; border-bottom: 1px solid var(--line); }
.section-label { margin: 0; color: var(--navy); font: 700 23px/1.25 var(--serif); }
.section-label::after { content: ""; display: block; width: 35px; height: 3px; margin-top: 12px; background: var(--burgundy); }
.section-body > p:first-child { margin-top: 0; }
.interests { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 22px; }
.interest { color: var(--navy-soft); font-family: var(--serif); font-size: 14px; font-style: italic; }
.interest:not(:last-child)::after { content: "·"; margin-left: 18px; color: var(--burgundy); }

.publication-group + .publication-group, .year-group + .year-group { margin-top: 38px; }
.group-title { margin: 0 0 16px; color: var(--muted); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.year-heading { display: flex; align-items: center; gap: 16px; margin: 0 0 12px; color: var(--burgundy); font: 700 20px/1 var(--serif); }
.year-heading::after { content: ""; height: 1px; flex: 1; background: var(--line); }
ol { margin: 0; padding: 0; list-style: none; counter-reset: paper; }
ol li { position: relative; display: block; margin: 0; padding: 15px 0 16px 45px; border-bottom: 1px solid #e5e1d9; font-size: 14px !important; line-height: 1.6; }
ol li::before { counter-increment: paper; content: counter(paper, decimal-leading-zero); position: absolute; left: 0; top: 19px; color: #929aa1; font: 600 11px/1 var(--sans); }
ol a, .paper-title { display: inline; color: var(--navy); font: 700 16px/1.45 var(--serif); }
ol b { color: #53606b; font-weight: 400; }
ol u { color: var(--ink); font-weight: 700; text-decoration: none; }
ol i { color: var(--burgundy); font-style: italic; font-weight: 600; }

.page-footer { padding: 27px 0 44px; color: var(--muted); background: #f1f0eb; font-size: 12px; }
.footer-inner { display: flex; justify-content: space-between; gap: 20px; }
.back-top { color: var(--navy); font-family: var(--serif); font-weight: 700; text-decoration: none; }

@media (max-width: 720px) {
  .container, .nav-inner { width: min(100% - 30px, 1060px); }
  .nav-links { gap: 16px; }
  .nav-links a:nth-child(2) { display: none; }
  .hero { padding: 44px 0; }
  .hero-grid { grid-template-columns: 1fr; gap: 36px; }
  h1 span { display: block; margin: 9px 0 0; }
  .portrait-wrap { width: min(210px, 64vw); }
  .content-section { grid-template-columns: 1fr; gap: 24px; padding: 40px 0; }
  .section-label::after { margin-top: 9px; }
  ol li { padding-left: 34px; }
  .footer-inner { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }