/* Shared academic-site shell. Independent of the legacy teaching styles. */
:root {
  color-scheme: light;
  --paper: #faf9f6;
  --ink: #24222a;
  --muted: #5e5b64;
  --purple: #4b2e83;
  --rule: #d9d5cd;
  --accent: #85754d;
  --width: 72rem;
}
* { box-sizing: border-box; }
html { scroll-padding-top: 2rem; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Segoe UI", Arial, sans-serif; font-size: 1rem; line-height: 1.65; }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--purple); text-underline-offset: .25em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid var(--purple); outline-offset: 5px; }
h1, h2, p, figure { margin: 0; }
h1, h2 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; line-height: 1.16; }
h1 { font-size: clamp(3rem, 5.8vw, 4.75rem); letter-spacing: -.045em; margin-bottom: 1.5rem; }
h2 { font-size: clamp(1.65rem, 2.8vw, 2.15rem); letter-spacing: -.025em; }
p + p { margin-top: 1rem; }
.container { width: min(var(--width), calc(100% - 5rem)); margin-inline: auto; }
.skip-link { position: absolute; top: -8rem; left: 1rem; z-index: 10; padding: .75rem 1rem; background: white; }
.skip-link:focus { top: 1rem; }
.site-header { border-top: 4px solid var(--purple); }
.header-layout { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: 1.8rem; border-bottom: 1px solid var(--rule); }
.site-identity { text-decoration: none; text-transform: uppercase; font-size: .95rem; font-weight: 650; letter-spacing: .15em; color: var(--ink); }
.nav-list { display: flex; flex-wrap: wrap; gap: .4rem 2rem; list-style: none; padding: 0; margin: 0; }
.nav-list a { display: inline-block; padding-block: .5rem; color: var(--ink); text-decoration: none; font-size: .95rem; }
.nav-list a:hover { color: var(--purple); text-decoration: underline; }
.profile { display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; gap: 5rem; padding-block: 4.5rem 5rem; }
.eyebrow { color: var(--purple); font-size: .73rem; font-weight: 650; text-transform: uppercase; letter-spacing: .13em; margin-bottom: 1.2rem; }
.profile-role { font-size: 1.04rem; line-height: 1.5; }
.profile-role p + p { margin-top: .25rem; }
.affiliation { font-size: .93rem; color: var(--muted); }
.profile-copy > .affiliation { margin-top: 1.1rem; }
.intro { font-size: 1.14rem; line-height: 1.75; max-width: 34rem; margin-top: 1.8rem; }
.profile-image { align-self: center; }
.profile-image img { aspect-ratio: 4 / 4.7; object-fit: cover; object-position: 58% center; width: 100%; }
figcaption { font-size: .75rem; color: var(--muted); margin-top: .65rem; }
.link-row { display: flex; flex-wrap: wrap; gap: .9rem 1.7rem; margin-top: 1.5rem; }
.text-link { display: inline-block; font-size: .9rem; font-weight: 600; padding-block: .25rem; }
.text-link span { margin-left: .25rem; }
.section-row { display: grid; grid-template-columns: 1fr 1.2fr; gap: 5rem; border-top: 1px solid var(--rule); padding-block: 3.5rem; }
.section-row .eyebrow { margin-bottom: 1rem; }
.section-copy { max-width: 37rem; padding-top: .15rem; }
.section-copy > p { font-size: 1.05rem; }
.section-copy > .text-link { margin-top: 1.25rem; }
.site-footer { margin-top: 1rem; border-top: 1px solid var(--rule); background: #f0eee8; }
.footer-layout { display: flex; justify-content: space-between; gap: 2rem; padding-block: 2.75rem; }
.footer-title { font-size: 1.55rem; margin-bottom: .75rem; }
.copyright { font-size: .78rem; margin-top: .65rem; }
@media (max-width: 60rem) {
  .profile { gap: 2.5rem; }
  .section-row { gap: 2.5rem; }
}
@media (max-width: 44rem) {
  .container { width: calc(100% - 2.5rem); }
  .header-layout { align-items: flex-start; flex-direction: column; gap: .65rem; padding-block: 1.2rem; }
  .nav-list { gap: .35rem 1.5rem; }
  .profile { grid-template-columns: 1fr; padding-block: 2.75rem; gap: 2rem; }
  .profile-image { width: min(100%, 26rem); }
  .profile-image img { aspect-ratio: 5 / 4; object-position: center top; }
  .section-row { grid-template-columns: 1fr; gap: 1.5rem; padding-block: 2.5rem; }
  .footer-layout { flex-direction: column; }
}
@media print {
  body { background: white; }
  .container { width: 100%; }
  .skip-link, .nav-list { display: none; }
  .profile, .section-row { break-inside: avoid; padding-block: 1.5rem; }
}