:root {
  color: #3f3632;
  background: #fbf3e6;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1.55;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { background: #fbf3e6; }
a { color: #8f2d2d; text-decoration-thickness: 1px; text-underline-offset: 0.14em; }
a:hover, a:focus { color: #692020; }
img { max-width: 100%; }

.container { width: min(100% - 4rem, 980px); margin-inline: auto; }
.site-page { min-height: 100vh; display: flex; flex-direction: column; }
.post-list { flex: 1; }

.year-heading, .page-title, .projects-title, .not-found h1 {
  margin: 1.15rem 0 1.45rem;
  color: #8f2d2d;
  font-size: 2.1rem;
  line-height: 1.1;
}

.post-preview { display: grid; grid-template-columns: minmax(9rem, 16%) 1fr; gap: 1.25rem; margin: 0 0 2rem; }
.post-date { padding-top: 0.3rem; white-space: nowrap; }
.post-title { display: inline; margin: 0; font-size: 2rem; font-weight: 400; line-height: 1.2; }
.post-title a { text-decoration: none; }
.post-summary { min-width: 0; }
.post-summary p:first-child { margin-top: 0.4rem; }
.read-more { display: inline-block; margin-top: 0.4rem; }

.pager { margin-top: auto; padding: 4rem 0 6rem; }
.pager-links { display: flex; justify-content: space-between; padding-left: clamp(0rem, 16%, 12rem); }
.pager-link { display: inline-block; border: 1px solid #aca094; border-radius: 999px; padding: 0.35rem 1.4rem; color: #675d56; text-decoration: none; }
.pager-link.is-disabled { color: #a99e94; }

.content-page { min-height: 58vh; padding-top: 1.3rem; }
.page-title { margin-bottom: 0.35rem; font-size: 2rem; }
.page-date { margin: 0 0 1.5rem; color: #6b5b53; font-size: 0.95rem; }
.prose { max-width: 75ch; }
.prose h2, .section-title { margin: 2rem 0 0.65rem; color: #8f2d2d; font-size: 1.45rem; line-height: 1.2; }
.prose p, .projects-intro p { margin: 0 0 1.1rem; }
.prose pre { overflow: auto; padding: 1rem; background: #f0e8dc; }
.prose code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.prose-figure { width: fit-content; max-width: 100%; margin: 1.5rem auto; text-align: center; }
.prose-figure img { display: block; margin-inline: auto; }
.prose-figure figcaption { margin-top: 0.45rem; color: #6b5b53; font-size: 0.8rem; font-style: italic; line-height: 1.35; }

.site-footer { padding: 4rem 0 2.2rem; }
.site-footer-inner { width: min(100% - 4rem, 980px); margin-inline: auto; text-align: center; }
.not-found { display: grid; min-height: 100vh; place-content: center; text-align: center; }
.not-found h1 { margin: 0; font-size: 4rem; }
.not-found h2 { margin: 0.4rem 0; font-size: 1.5rem; }

@media (max-width: 768px) {
  :root { font-size: 17px; }
  .container, .site-footer-inner { width: min(100% - 2rem, 980px); }
  .year-heading, .page-title, .projects-title { font-size: 1.65rem; }
  .post-preview { grid-template-columns: 1fr; gap: 0.25rem; margin-bottom: 1.5rem; }
  .post-date { padding: 0; }
  .post-title { font-size: 1.55rem; }
  .pager { padding: 2.5rem 0 3rem; }
  .pager-links { padding: 0; }
  .site-footer { padding-top: 2.5rem; }
}