:root{
  --paper:#f7f6f2;
  --ink:#16202b;
  --ink-soft:#5a6570;
  --rule:#dcd8ce;
  --accent:#7c2b2b;
  --serif:"Newsreader",Georgia,serif;
  --sans:"IBM Plex Sans",system-ui,sans-serif;
}

*{box-sizing:border-box}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:1.0625rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

.page{
  max-width:52rem;
  margin:0 auto;
  padding:3.5rem 1.75rem 6rem;
}

a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--accent);text-decoration-color:var(--accent)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

/* ---------- masthead ---------- */

.masthead{
  display:grid;
  grid-template-columns:1fr 14rem;
  gap:2.75rem;
  align-items:start;
  margin-bottom:3.25rem;
}

h1{
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(2.6rem,7vw,3.9rem);
  line-height:1;
  letter-spacing:-0.015em;
  margin:0 0 1.5rem;
}

.intro p{margin:0 0 1rem;max-width:34em}
.intro p:last-child{margin-bottom:0}

.portrait{
  width:100%;
  height:auto;
  display:block;
  filter:saturate(.92);
}

.contact{margin-top:2rem;max-width:34em}
.contact::before{
  content:"";
  display:block;
  width:3.5rem;
  height:1px;
  background:var(--rule);
  margin-bottom:1.1rem;
}

.profile-links{
  font-family:var(--sans);
  font-size:.875rem;
  display:flex;
  flex-wrap:wrap;
  gap:.45rem .55rem;
}
.profile-links a{text-underline-offset:.2em}

/* Middot between the profile links. Sits in the flex gap, so it disappears
   automatically if the row ever wraps to one item per line. */
.profile-links a + a::before{
  content:"\00B7";
  color:var(--rule);
  margin-right:.55rem;
  text-decoration:none;
  display:inline-block;
}


.colophon{margin:0}

/* ---------- contact strip ---------- */

.strip{
  font-family:var(--sans);
  font-size:.875rem;
  display:flex;
  flex-wrap:wrap;
  gap:.45rem 1.5rem;
  padding:1rem 0;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  margin-bottom:3.5rem;
}
.strip a{text-underline-offset:.2em}

/* ---------- sections ---------- */

section{margin-bottom:3.5rem}

h2{
  font-family:var(--serif);
  font-weight:400;
  font-size:1.375rem;
  letter-spacing:.005em;
  margin:0 0 1.5rem;
  padding-bottom:.5rem;
  border-bottom:1px solid var(--rule);
}

/* ---------- books ---------- */

.book{
  display:grid;
  grid-template-columns:11.5rem 1fr;
  gap:2.25rem;
  margin-bottom:2.75rem;
  align-items:start;
}
.book:last-child{margin-bottom:0}

.book img{
  width:100%;
  height:auto;
  display:block;
  box-shadow:0 1px 2px rgba(22,32,43,.14),0 10px 22px -8px rgba(22,32,43,.3);
}
.book a.cover{text-decoration:none}

.book h3{
  font-family:var(--serif);
  font-weight:400;
  font-style:italic;
  font-size:1.3rem;
  line-height:1.3;
  margin:.1rem 0 .35rem;
}

.imprint{color:var(--ink-soft);margin:0 0 .6rem}

.book-note{
  font-family:var(--sans);
  font-size:.8125rem;
  line-height:1.55;
  color:var(--ink-soft);
  margin:0 0 .35rem;
}
.honor{color:var(--accent)}

/* ---------- publications ---------- */

ul.pubs{list-style:none;margin:0;padding:0;max-width:42em}

ul.pubs li{
  padding-left:1.45em;
  text-indent:-1.45em;
  margin-bottom:1.05rem;
}
ul.pubs li:last-child{margin-bottom:0}

.meta{color:var(--ink-soft)}

/* ---------- abstracts ---------- */

details{text-indent:0;margin-top:.3rem}

summary{
  font-family:var(--sans);
  font-size:.78rem;
  color:var(--ink-soft);
  cursor:pointer;
  list-style:none;
  display:inline-block;
  padding:.1rem 0;
}
summary::-webkit-details-marker{display:none}
summary::before{
  content:"+";
  display:inline-block;
  width:1.1em;
  color:var(--accent);
  font-weight:500;
}
details[open] summary::before{content:"\2212"}
summary:hover{color:var(--accent)}
summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

.abstract{
  margin:.45rem 0 .3rem;
  padding-left:1.1em;
  border-left:1px solid var(--rule);
  font-size:.9375rem;
  line-height:1.6;
  color:var(--ink-soft);
  max-width:36em;
}

/* ---------- footer ---------- */

footer{
  font-family:var(--sans);
  font-size:.8125rem;
  color:var(--ink-soft);
  border-top:1px solid var(--rule);
  padding-top:1.25rem;
}

/* ---------- small screens ---------- */

@media (max-width:640px){
  .page{padding:2.5rem 1.25rem 4rem}
  .masthead{grid-template-columns:1fr;gap:1.75rem}
  .portrait{max-width:13rem}
  .book{grid-template-columns:6.5rem 1fr;gap:1.25rem}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* ---------- subpages ---------- */

.backlink{
  font-family:var(--sans);
  font-size:.875rem;
  display:inline-block;
  margin-bottom:1.5rem;
  text-underline-offset:.2em;
}

h1.pagetitle{
  font-size:clamp(2.1rem,5.5vw,3rem);
  margin-bottom:2.75rem;
}

ul.plain{list-style:none;margin:0;padding:0;max-width:42em}
ul.plain li{margin-bottom:.8rem}
ul.plain li:last-child{margin-bottom:0}

.note{
  font-family:var(--sans);
  font-size:.8125rem;
  line-height:1.55;
  color:var(--ink-soft);
  margin:.2rem 0 0;
  text-indent:0;
}

.also{
  font-family:var(--sans);
  font-size:.8125rem;
  color:var(--ink-soft);
  margin:.3rem 0 0;
  text-indent:0;
}

/* ---------- embedded PDF ---------- */

.pdfnote{
  font-family:var(--sans);
  font-size:.875rem;
  color:var(--ink-soft);
  margin:0 0 1.25rem;
}
.pdfnote a{text-underline-offset:.2em}

.pdfframe{
  display:block;
  width:100%;
  height:calc(100vh - 20rem);
  min-height:34rem;
  border:1px solid var(--rule);
  background:#fff;
}

@media (max-width:640px){
  .pdfframe{height:70vh;min-height:24rem}
}