* { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body {
  max-width: 760px;
  margin: 0 auto;
  padding: 46px 28px 28px;
  background: #f7f4ef;
  color: #292523;
  font: 17px/1.75 Arial, Helvetica, sans-serif;
  overflow-wrap: break-word;
}
h1, h2 { font-family: Georgia, 'Times New Roman', serif; line-height: 1.2; }
h1 { color: #8b2929; font-size: clamp(36px, 7vw, 49px); letter-spacing: -.035em; margin: 0 0 12px; }
h2 { font-size: 29px; margin: 12px 0 22px; }
p { margin: 0 0 19px; }
header { border-top: 4px solid #8b2929; border-bottom: 1px solid #cfc7bc; padding: 24px 0 22px; }
.byline { color: #665950; font: 14px/1.5 'Courier New', monospace; margin-bottom: 16px; }
.subtitle { color: #625951; margin-bottom: 22px; }
a { color: #8b2929; text-underline-offset: 5px; text-decoration-thickness: 1px; }
a:hover { color: #4f1111; }
a:focus-visible { outline: 2px solid #8b2929; outline-offset: 5px; }
nav { display: flex; flex-wrap: wrap; gap: 25px; font-size: 15px; }
article { padding: 33px 0 22px; }
time { color: #706156; font: 13px/1.6 'Courier New', monospace; }
.signature { color: #8b2929; font: italic 20px/1.5 Georgia, 'Times New Roman', serif; margin-top: 24px; }
#about { border-top: 1px solid #cfc7bc; padding: 23px 0 16px; }
#about h2 { font-size: 23px; margin-bottom: 15px; }
#about p { font-size: 16px; }
footer { border-top: 1px solid #cfc7bc; padding-top: 18px; color: #706156; font: 13px/1.6 'Courier New', monospace; }
@media (max-width: 480px) {
  body { padding: 24px 21px; font-size: 16px; }
  h1 { font-size: 36px; }
  h2 { font-size: 27px; }
  article { padding-top: 27px; }
}