:root{
  --cream:#f7f2e9;
  --ink:#181513;
  --wine:#5b2027;
  --wine-dark:#43171d;
  --muted:#746b64;
  --line:#d9cfc2;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Inter,Arial,sans-serif;line-height:1.55}
.site-header{max-width:1400px;margin:auto;padding:30px 5%;display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--wine)}
.wordmark{text-decoration:none;color:var(--ink);letter-spacing:.22em}
.wordmark span{display:block;font-family:"Cormorant Garamond",Georgia,serif;font-size:32px;font-weight:600}
.wordmark small{font-size:10px;letter-spacing:.25em}
nav{display:flex;gap:30px;padding-top:12px}
nav a,.link-grid a{color:var(--ink);text-decoration:none;font-size:12px;font-weight:600;letter-spacing:.12em}
nav a:hover,.link-grid a:hover{color:var(--wine)}
main{max-width:1400px;margin:auto}
.hero{padding:42px 5% 52px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:62px;align-items:center}
.portrait{
  height:650px;
  overflow:hidden;
}
.portrait img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.placeholder{background:linear-gradient(145deg,#6a2930,#3f151a);display:flex;align-items:center;justify-content:center;color:#f8eee6;letter-spacing:.18em;font-size:12px}
.hero-copy{min-width:0;max-width:650px}
.portrait{grid-column:1}
.hero-copy{grid-column:2}
.eyebrow{font-size:12px;letter-spacing:.22em;font-weight:600;margin:0 0 15px}
h1,h2,h3,.role,.subtitle{font-family:"Cormorant Garamond",Georgia,serif}
h1{font-size:76px;line-height:.9;margin:0 0 15px;font-weight:600}
.role{font-size:31px;margin:0}
.institution{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:23px;margin:0}
.rule{width:80px;border-top:2px solid var(--wine);margin:28px 0}
.areas{font-size:12px;letter-spacing:.13em;line-height:1.8}
.hero-copy p:not(.eyebrow):not(.role):not(.institution):not(.areas){max-width:620px}
.button{display:inline-block;background:var(--wine);color:white;text-decoration:none;padding:17px 30px;margin-top:14px;font-size:11px;letter-spacing:.18em}
.button:hover{background:var(--wine-dark)}
.featured{border-top:1px solid var(--line);padding:45px 5%;display:grid;grid-template-columns:.85fr 1.15fr;gap:58px;align-items:center}
.featured h2{font-size:62px;line-height:.85;margin:8px 0 12px}
.subtitle{font-size:25px;font-style:italic;line-height:1.05;margin:0 0 20px}
.small{padding:14px 25px}
.research-image{min-height:420px;background:linear-gradient(135deg,#b5a99b,#514a44)}
.research-image {
  height: 420px;
  overflow: hidden;
}

.research-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.link-grid{border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);padding:30px 5% 45px}
.link-grid article{padding:5px 40px;border-right:1px solid var(--line)}
.link-grid article:first-child{padding-left:0}
.link-grid article:last-child{border:0}
.link-grid h3{font-size:35px;margin:0 0 8px}
.link-grid p{font-size:14px;max-width:300px}
footer{background:var(--wine-dark);color:#f7efe7;padding:40px max(5%,calc((100% - 1400px)/2 + 70px)) 22px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px}
footer strong{font-family:"Cormorant Garamond",Georgia,serif;letter-spacing:.15em}
footer p{font-size:13px}
footer a{color:#f7efe7}
.footer-location{text-align:right}
.copyright{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.35);padding-top:18px;margin-top:12px}
@media(max-width:850px){
 .site-header{display:block}
 nav{gap:14px;flex-wrap:wrap;margin-top:18px}
 .hero,.featured{grid-template-columns:1fr;gap:32px}
 .portrait{min-height:500px}
 h1{font-size:58px}
 .featured h2{font-size:50px}
 .link-grid{grid-template-columns:1fr}
 .link-grid article,.link-grid article:first-child{padding:22px 0;border-right:0;border-bottom:1px solid var(--line)}
 footer{grid-template-columns:1fr}
 .footer-location{text-align:left}
}



/* Full-size desktop layout */
@media (min-width: 1200px) {

  main,
  .site-header {
    width: min(1500px, 94vw);
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }

  .site-header {
    padding: 30px 0;
  }

  .hero {
    padding: 42px 0 52px;
    grid-template-columns: 520px 1fr;
    gap: 70px;
  }

  .portrait {
    height: 650px;
  }

  .featured {
    padding: 45px 0;
  }

  .link-grid {
    padding: 30px 0 45px;
  }
}