:root{
  --paper:#DAD2BE;
  --paper-2:#CFC6AC;
  --ink:#1F2B24;
  --ink-soft:#2C3A2F;
  --moss:#45523F;
  --brick:#8C3B2E;
  --line: rgba(31,43,36,0.16);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter', sans-serif;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
::selection{ background:var(--brick); color:var(--paper); }
a{ color:var(--brick); }
a:focus-visible, button:focus-visible{
  outline:2px solid var(--brick);
  outline-offset:3px;
}

.wrap{
  max-width:920px;
  margin:0 auto;
  padding:0 28px;
}

/* ---------- Nameplate + nav ---------- */
header{
  padding:40px 0 0;
}
.nameplate{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  flex-wrap:wrap;
  gap:10px;
  padding-bottom:22px;
}
.nameplate .name{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:1.3rem;
  letter-spacing:0.01em;
  text-decoration:none;
  color:var(--ink-soft);
}
.nameplate .place{
  font-size:0.85rem;
  color:var(--moss);
}
nav.sitenav{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:14px 0;
}
nav.sitenav ul{
  list-style:none;
  display:flex;
  gap:28px;
  margin:0;
  padding:0;
}
nav.sitenav a{
  text-decoration:none;
  font-size:0.92rem;
  color:var(--ink);
  border-bottom:2px solid transparent;
  padding-bottom:3px;
}
nav.sitenav a:hover{ border-bottom-color:var(--moss); }
nav.sitenav a[aria-current="page"]{
  color:var(--brick);
  border-bottom-color:var(--brick);
  font-weight:500;
}

/* ---------- Page intro blocks ---------- */
.page-intro{
  padding:52px 0 20px;
}
.page-intro h1{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:clamp(2.1rem, 5vw, 3rem);
  line-height:1.18;
  margin:0 0 26px;
  max-width:17ch;
  color:var(--ink-soft);
}
.page-intro p{
  max-width:56ch;
  font-size:1.08rem;
  color:var(--ink);
}
.page-intro p + p{ margin-top:16px; }
.page-intro .aside{
  font-family:'Fraunces', serif;
  font-style:italic;
  color:var(--moss);
  font-size:1.02rem;
  max-width:52ch;
  margin-top:22px;
}

/* ---------- Shelf / books ---------- */
.shelf-heading{ padding:36px 0 8px; }
.shelf-heading h2{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:1.5rem;
  margin:0;
  color:var(--ink-soft);
}
.shelf-heading p{
  color:var(--moss);
  font-size:0.95rem;
  margin:8px 0 0;
}
.shelf{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  padding:32px 0 64px;
}
.book{
  background:var(--paper-2);
  border-left:4px solid var(--brick);
  padding:24px 24px 26px;
}
.book .status{
  font-size:0.74rem;
  color:var(--moss);
  display:block;
  margin-bottom:10px;
}
.book h3{
  font-family:'Fraunces', serif;
  font-style:italic;
  font-weight:500;
  font-size:1.28rem;
  margin:0 0 4px;
  color:var(--ink-soft);
}
.book .subtitle{
  font-size:0.85rem;
  color:var(--moss);
  margin:0 0 12px;
}
.book p.desc{
  font-size:0.95rem;
  margin:0;
  color:var(--ink);
}

/* ---------- Generic content blocks ---------- */
.content-block{
  padding:0 0 56px;
}
.content-block p{
  max-width:58ch;
  font-size:1.02rem;
  color:var(--ink);
}
.content-block p + p{ margin-top:14px; }
.content-block h2{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:1.5rem;
  margin:0 0 18px;
  color:var(--ink-soft);
}

/* ---------- Contact ---------- */
.contact{ padding:0 0 72px; }
.contact h2{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:1.3rem;
  margin:0 0 14px;
  color:var(--ink-soft);
}
.contact a{
  font-size:1.05rem;
  text-decoration:none;
  border-bottom:1px solid var(--brick);
  padding-bottom:2px;
}
.contact a:hover{ opacity:0.8; }

footer{
  border-top:1px solid var(--line);
  padding:24px 0;
  font-size:0.82rem;
  color:var(--moss);
}
.footer-row{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:8px;
}

@media (max-width:700px){
  .shelf{ grid-template-columns:1fr; }
  nav.sitenav ul{ gap:18px; flex-wrap:wrap; }
  .page-intro{ padding:40px 0 16px; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
}
