:root {
  --ink: #1f2933;
  --muted: #66727d;
  --line: #e6e9ec;
  --paper: #ffffff;
  --soft: #f7f8fa;
  --accent: #163a5f;
  --accent-2: #2f5f78;
  --warm: #8a6a43;
  --max: 1080px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
img { max-width: 100%; display: block; }

.container { width: min(calc(100% - 40px), var(--max)); margin-inline: auto; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.header-inner {
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.brand {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .01em;
  color: var(--ink);
}
.brand small {
  display: block;
  color: var(--muted);
  font-weight: 400;
  font-size: 11px;
  letter-spacing: .09em;
  text-transform: uppercase;
  line-height: 1.3;
  margin-top: 3px;
}
.nav { display: flex; gap: 22px; align-items: center; }
.nav a { color: #38434d; font-size: 14px; }
.nav a.active { color: var(--accent); font-weight: 700; }
.menu-button { display:none; border:0; background:none; font-size:25px; color:var(--ink); cursor:pointer; }

.hero {
  padding: 86px 0 72px;
  border-bottom: 1px solid var(--line);
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.38fr .62fr;
  gap: 72px;
  align-items: center;
}
.eyebrow {
  text-transform: uppercase;
  letter-spacing: .13em;
  color: var(--accent-2);
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 15px;
}
h1, h2, h3 { line-height: 1.17; margin-top: 0; color: #1c252d; }
h1 { font-size: clamp(42px, 6vw, 67px); font-weight: 500; letter-spacing: -.035em; margin-bottom: 12px; }
.hero h1 span { display:block; font-size:.44em; font-weight:500; color:var(--muted); letter-spacing:0; margin-top:12px; }
.hero-lead { font-size: clamp(21px, 2.6vw, 29px); line-height: 1.35; color: var(--accent); max-width: 780px; margin: 20px 0 22px; font-weight: 400; }
.affiliation { color: #47535d; margin: 3px 0; font-size: 16px; }
.intro { max-width: 760px; margin-top: 25px; color:#46515b; }
.motto { margin-top: 26px; padding-left: 18px; border-left: 3px solid var(--warm); color:#2b3540; font-weight:600; }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:9px 17px; border:1px solid var(--accent); font-size:14px; font-weight:600; }
.button.primary { background:var(--accent); color:white; }
.button:hover { text-decoration:none; opacity:.9; }
.hero-photo-wrap { position:relative; }
.hero-photo {
  width: 100%;
  max-width: 340px;
  margin-left:auto;
  aspect-ratio: 4/5;
  object-fit: cover;
  object-position: center;
  filter: saturate(.75) contrast(.98);
  border: 1px solid #d7dce0;
}
.photo-note { text-align:right; font-size:11px; color:#8b949c; margin-top:7px; }

.section { padding: 76px 0; border-bottom: 1px solid var(--line); }
.section.soft { background:var(--soft); }
.section-label { color:var(--accent-2); text-transform:uppercase; letter-spacing:.13em; font-size:12px; font-weight:700; margin-bottom:12px; }
.section h2 { font-size: clamp(29px,4vw,43px); letter-spacing:-.025em; font-weight:500; margin-bottom:20px; }
.section-intro { color:#56616b; max-width:780px; font-size:18px; }

.philosophy { padding: 92px 0; text-align:center; }
.philosophy .quote { max-width: 900px; margin:0 auto; font-size:clamp(31px,4vw,49px); line-height:1.28; font-weight:400; letter-spacing:-.025em; color:var(--accent); }
.philosophy .quote strong { color:var(--ink); font-weight:600; }
.philosophy .explain { max-width:760px; margin:28px auto 0; color:#59646e; font-size:17px; }

.cards { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:40px; }
.card { border-top: 2px solid var(--accent); padding:25px 24px 22px 0; }
.card h3 { font-size:21px; font-weight:600; margin-bottom:9px; }
.card p { color:#5a6570; margin:0; }

.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:40px; }
.feature { border-left:1px solid #d8dde2; padding-left:22px; }
.feature h3 { font-size:20px; margin-bottom:8px; }
.feature p { color:#5a6570; font-size:15px; }

.publications { margin-top:35px; }
.pub { padding:20px 0; border-top:1px solid var(--line); }
.pub:last-child { border-bottom:1px solid var(--line); }
.pub-title { font-weight:600; color:#28323a; }
.pub-meta { color:#717b84; font-size:14px; margin-top:3px; }

.metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:36px; }
.metric { border-top:1px solid #cad1d7; padding-top:14px; }
.metric strong { display:block; font-size:27px; font-weight:500; color:var(--accent); }
.metric span { color:#64707a; font-size:13px; }

.circulation-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin-top:38px; }
.circulation-item h3 { font-size:18px; margin-bottom:8px; }
.circulation-item p { font-size:14px; color:#66727c; }

.footer { padding:42px 0 50px; }
.footer-grid { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; }
.footer strong { display:block; }
.footer p { margin:5px 0 0; color:#707b84; font-size:13px; }
.social { display:flex; flex-wrap:wrap; gap:15px; justify-content:flex-end; font-size:13px; }

.page-hero { padding:62px 0 45px; border-bottom:1px solid var(--line); }
.page-hero h1 { font-size:clamp(38px,5vw,57px); }
.page-hero p { max-width:780px; color:#59646e; font-size:18px; }
.content { padding:58px 0 80px; }
.content .narrow { max-width:820px; }
.content h2 { font-size:28px; margin:44px 0 14px; }
.content h3 { font-size:20px; margin:30px 0 8px; }
.content p, .content li { color:#4f5b65; }
.clean-list { padding-left:19px; }
.contact-card { border:1px solid var(--line); padding:26px; margin-top:25px; }


/* Outreach example cards — restored from the earlier site version. */
.engagement-examples {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin: 26px 0 18px;
}
.engagement-card {
  display: flex;
  flex-direction: column;
  gap: 7px;
  border: 1px solid var(--line);
  padding: 22px;
  color: var(--ink);
  background: #fff;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.engagement-card:hover {
  text-decoration: none;
  transform: translateY(-2px);
  border-color: #cbd3d9;
  box-shadow: 0 8px 24px rgba(31,41,51,.06);
}
.engagement-card .engagement-type {
  color: var(--accent-2);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 10px;
  font-weight: 700;
}
.engagement-card strong {
  font-size: 17px;
  line-height: 1.3;
  color: #27313a;
}
.engagement-card > span:not(.engagement-type) {
  color: #63707a;
  font-size: 13px;
  line-height: 1.55;
}
.engagement-card em {
  margin-top: auto;
  padding-top: 4px;
  color: var(--accent);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}
.curation-note {
  font-size: 13px;
  color: #7b858d !important;
  border-left: 2px solid #d7dde2;
  padding-left: 14px;
  margin-top: 14px;
}

@media (max-width: 860px) {
  .menu-button { display:block; }
  .nav { display:none; position:absolute; top:70px; left:0; right:0; background:white; border-bottom:1px solid var(--line); padding:20px; flex-direction:column; align-items:flex-start; gap:13px; }
  .nav.open { display:flex; }
  .hero { padding-top:56px; }
  .hero-grid { grid-template-columns:1fr; gap:42px; }
  .hero-photo { margin:0; max-width:280px; }
  .photo-note { text-align:left; max-width:280px; }
  .cards, .feature-grid, .engagement-examples { grid-template-columns:1fr; }
  .metrics, .circulation-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 540px) {
  .container { width:min(calc(100% - 28px), var(--max)); }
  .hero { padding:45px 0 55px; }
  .section { padding:58px 0; }
  .philosophy { padding:65px 0; }
  .metrics, .circulation-grid { grid-template-columns:1fr; }
  .footer-grid { flex-direction:column; align-items:flex-start; }
  .social { justify-content:flex-start; }
}


/* Added after v1 to support the temporary maintenance page while preserving the original visual language. */
.maintenance {
  min-height: calc(100vh - 70px);
  display: flex;
  align-items: center;
  padding: 82px 0;
  border-bottom: 1px solid var(--line);
}
.maintenance-card {
  max-width: 760px;
  border-top: 2px solid var(--accent);
  padding-top: 28px;
}
.maintenance-card h1 {
  font-size: clamp(42px, 6vw, 67px);
  font-weight: 500;
  letter-spacing: -.035em;
  margin: 18px 0 16px;
}
.maintenance-card p {
  max-width: 680px;
  color: #59646e;
  font-size: 18px;
}
.badge {
  display: inline-block;
  color: var(--accent-2);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: 12px;
  font-weight: 700;
}
.example-links { margin-top: 12px !important; }
.example-links a { font-weight: 600; }
