:root{
  --cream: #FBF3E7;
  --cream-deep: #F1E3CE;
  --ink: #2A1F17;
  --ink-soft: #5B4A3A;
  --terracotta: #9E4429;
  --terracotta-deep: #7E3320;
  --border: #DCC7A8;
  --max: 760px;
  --tcolor: #9E4429;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  line-height:1.55;
  font-size:16px;
}
.display{
  font-family:"Iowan Old Style","Palatino Linotype",Georgia,"Times New Roman",serif;
}
img{ max-width:100%; display:block; }
a{ color:var(--terracotta-deep); text-decoration:none; }
a:hover{ text-decoration:underline; }
a:focus-visible, button:focus-visible{ outline:3px solid var(--ink); outline-offset:2px; }

/* Layout shell */
.wrap{ max-width:var(--max); margin:0 auto; padding:0 1.25rem; }

/* Site header */
.top{
  text-align:center;
  padding:1.5rem 0 .75rem;
}
.site-header{
  padding:0 0 1.25rem;
  border-bottom:1px solid var(--border);
}
.site-header .wrap{
  display:flex;
  justify-content:center;
}
.brand{
  font-weight:700;
  font-size:3.1rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--tcolor);
}
.tagline{
  font-size:.72rem;
  color:var(--ink-soft);
  display:none;
}
@media (min-width:640px){
  .tagline{ display:inline; }
}
.site-nav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:.5rem 0.75rem;
  max-width:640px;
}
.site-nav a{
  font-size:.95rem;
  font-weight:600;
  color:var(--ink-soft);
}
.site-nav a:hover{ color:var(--terracotta-deep); text-decoration:none; }

 nav span.sep { color: var(--ink); }

/* Post list / cards */
.post-list{
  padding:2rem 0 1rem;
  display:grid;
  gap:1.25rem;
}
.post-card{
  display:grid;
  grid-template-columns:1fr;
  gap:.9rem;
  background:var(--cream-deep);
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  text-decoration:none;
  color:var(--ink);
}
.post-card:hover{ text-decoration:none; border-color:var(--terracotta); }
.post-card .thumb{
  aspect-ratio:16/9;
  width:100%;
  overflow:hidden;
  background:var(--border);
}
.post-card .thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.post-card .body{ padding:0 1.1rem 1.1rem; }
.post-card .eyebrow{
  font-size:.7rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--terracotta-deep);
  font-weight:700;
  margin:0 0 .4rem;
}
.post-card h2{
  font-size:1.3rem;
  margin:0 0 .5rem;
  line-height:1.25;
}
.post-card .excerpt{
  font-size:.95rem;
  color:var(--ink-soft);
  margin:0 0 .6rem;
}
.post-card .meta{
  font-size:.78rem;
  color:var(--ink-soft);
}
.post-card .readmore{
  font-size:.85rem;
  font-weight:700;
  color:var(--terracotta-deep);
}

@media (min-width:640px){
  .post-card{ grid-template-columns:220px 1fr; }
  .post-card .thumb{ aspect-ratio:auto; height:100%; }
}

/* Single post */
.post-hero-thumb{
  border-radius:12px;
  overflow:hidden;
  margin:1.5rem 0;
  border:1px solid var(--border);
}
.post-title{
  font-size:2rem;
  line-height:1.2;
  margin:1.5rem 0 .5rem;
}
.post-meta{
  font-size:.8rem;
  color:var(--ink-soft);
  margin-bottom:1.5rem;
}
.post-content{ font-size:1.05rem; }
.post-content p{ margin:0 0 1.1rem; }
.post-content blockquote{
  margin:1.5rem 0;
  padding:.9rem 1.1rem;
  border-left:4px solid var(--terracotta);
  background:var(--cream-deep);
  border-radius:0 8px 8px 0;
  font-family:"Iowan Old Style",Georgia,serif;
  font-size:1.05rem;
}
.post-nav{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:1.5rem 0;
  border-top:1px solid var(--border);
  margin-top:1rem;
  font-size:.9rem;
  flex-wrap:wrap;
}

/* CTA (reused from landing page) */
.cta{
  display:inline-block;
  background:var(--terracotta);
  color:var(--cream);
  font-weight:700;
  font-size:1rem;
  text-decoration:none;
  padding:.85rem 1.75rem;
  border-radius:10px;
}
.cta:hover{ background:var(--terracotta-deep); text-decoration:none; }

/* Footer */
.site-footer{
  margin-top:3rem;
  padding:1.5rem 0 2.5rem;
  border-top:1px solid var(--border);
  text-align:center;
  font-size:.78rem;
  color:var(--ink-soft);
}

/* Empty state */
.empty{
  padding:3rem 1rem;
  text-align:center;
  color:var(--ink-soft);
}