:root { color-scheme: light; --ink: #24332b; --green: #315c45; --cream: #faf8f1; }
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--cream); font: 18px/1.65 Georgia, serif; }
.wrap { width: min(100% - 2rem, 960px); margin: auto; }
header { background: var(--green); padding: 1rem 0; } .brand { font-size: 1.45rem; font-weight: bold; }
header a { color: #fff; text-decoration: none; } nav { display: flex; gap: .8rem 1.2rem; flex-wrap: wrap; margin-top: .5rem; font: 15px/1.4 system-ui, sans-serif; } .nav-utility-start { margin-left: auto; }
main { background: #fff; min-height: 70vh; padding: clamp(1.5rem, 4vw, 4rem); } h1, h2, h3 { color: var(--green); line-height: 1.2; } h1 { font-size: clamp(2rem, 5vw, 3.2rem); }
img, iframe, video { max-width: 100%; height: auto; } blockquote { border-left: 4px solid #7a9d75; margin: 1.5rem 0; padding-left: 1rem; } a { color: #1f6545; } footer { padding: 1.25rem 0; color: #fff; background: var(--green); font: 14px system-ui, sans-serif; }
.post-list { list-style: none; padding: 0; } .post-list li { border-bottom: 1px solid #ddd; padding: 1rem 0; } .post-list a { font-size: 1.25rem; font-weight: bold; }