/* Modern Institute: shared visual theme. Existing content and components stay in place. */
:root {
  color-scheme: light only;
  --bg: #fcfcfa;
  --bg-card: #ffffff;
  --bg-elev: #f3f4f0;
  --ink: #131515;
  --ink-soft: #343a36;
  --muted: #555b57;
  --rule: #d3d5d0;
  --rule-soft: #e5e7e1;
  --accent: #b31b1b;
  --accent-deep: #8f1515;
  --accent-soft: #f6e5e3;
  --paper: #ffffff;
  --sans: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --serif: var(--sans);
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
}

html { background: var(--bg); color-scheme: light only; }
body { font-weight: 400; line-height: 1.6; }
body::before { content: none; }

header.site-header { background: rgba(252, 252, 250, 0.94); }
.page-nav { background: rgba(252, 252, 250, 0.94); }
.logo-mark { font-weight: 800; letter-spacing: -0.05em; }
.nav-cta { white-space: nowrap; }

.logo-mark em,
.hero .container h1 em,
.hero-name em,
.section-title em,
.pi-info h3 em,
.res-name em,
.software-name em,
.join h2 em,
.footer-brand h3 em {
  font-style: normal;
  font-weight: inherit;
  font-variation-settings: normal;
}

/* The two hero selectors stay separate so the faculty name fits its photo column. */
.hero .container h1 {
  font-weight: 800;
  font-size: clamp(40px, 6.2vw, 84px);
  line-height: 1.04;
  letter-spacing: -0.055em;
  max-width: 1040px;
}
.hero-name {
  font-weight: 800;
  font-size: clamp(48px, 7vw, 68px);
  line-height: 1.04;
  letter-spacing: -0.05em;
}
.section-title { font-weight: 700; line-height: 1.1; letter-spacing: -0.045em; }
.pi-info h3 { font-weight: 700; line-height: 1.1; letter-spacing: -0.04em; }
.join h2 { font-weight: 800; line-height: 1.08; letter-spacing: -0.045em; }
.footer-brand h3 { font-weight: 800; letter-spacing: -0.045em; }

.hero-lede,
.hero-bio,
.pi-bio,
.res-desc,
.join p,
.footer-brand p {
  font-weight: 400;
  line-height: 1.6;
}

.pub-title,
.news-headline,
.press-headline,
.course-name {
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -0.02em;
}
.pub-title { font-style: normal; }
.res-name,
.software-name,
.member-name { font-weight: 700; line-height: 1.25; letter-spacing: -0.025em; }
.pub-authors .lab-member { color: var(--ink); }
.pub:hover { background: var(--bg-elev); }

.nav-cta,
.btn,
.pub-actions a,
.course-link,
.hero-link,
.res-link,
.software-link,
.footer-col h5,
.contact-col h4 { font-weight: 500; }

/* Allow the same cards and rows to accommodate the new typeface. */
.pub > *,
.pub-item > *,
.news-item > *,
.press-item > *,
.hero-inner > *,
.pi-card > *,
.member,
.res-card,
.software-card,
.footer-grid > * { min-width: 0; }
.pub-title,
.news-headline,
.press-headline,
.course-name,
.res-name,
.software-name,
.member-name,
.member-role,
.res-desc { overflow-wrap: anywhere; }
.res-head { gap: 10px 16px; flex-wrap: wrap; }
.res-type { flex-shrink: 0; }

.member-avatar .bio-overlay {
  background: rgba(19, 21, 21, 0.94);
  font-weight: 400;
  line-height: 1.6;
}
.member-avatar .bio-overlay p { color: rgba(252, 252, 250, 0.94); }

.join .bear-watermark { color: rgba(252, 252, 250, 0.07); }
.join .section-head { border-color: rgba(252, 252, 250, 0.35); }
.join h2 em { color: #f0aaa4; }
.join p { color: rgba(252, 252, 250, 0.84); }
.btn-primary:hover { background: var(--accent-soft); }
.btn-ghost { border-color: rgba(252, 252, 250, 0.4); }

/* Retain the existing portrait fallbacks, using the shared palette. */
.avatar > svg rect,
.hero-photo > svg rect { fill: var(--accent); }
.avatar > svg circle,
.avatar > svg path,
.hero-photo > svg circle,
.hero-photo > svg path { fill: var(--bg); }
.avatar > svg text {
  font-family: var(--sans);
  font-style: normal;
  font-weight: 800;
  fill: var(--accent);
}
.member-avatar > svg rect { fill: var(--rule-soft); }
.member-avatar > svg circle,
.member-avatar > svg path { fill: var(--muted); }

.pulse { box-shadow: 0 0 0 0 rgba(179, 27, 27, 0.55); }
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(179, 27, 27, 0.55); }
  70% { box-shadow: 0 0 0 10px rgba(179, 27, 27, 0); }
  100% { box-shadow: 0 0 0 0 rgba(179, 27, 27, 0); }
}

@media (min-width: 721px) and (max-width: 960px) {
  .nav-inner { gap: 16px; }
  .logo-sub { font-size: 9px; letter-spacing: 0.025em; }
  nav.primary { gap: 14px; }
  nav.primary a { font-size: 11px; }
  .pub { grid-template-columns: 80px minmax(0, 1fr) 120px; gap: 24px; }
  .news-item { grid-template-columns: 100px 80px minmax(0, 1fr) 85px; gap: 18px; }
}

@media (max-width: 720px) {
  .hero .container h1 { font-size: clamp(36px, 7.2vw, 44px); }
  .member-name { font-size: 19px; }
}

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