/* Blog-specific rules. The nav, page head, footer and mobile menu all come from
   legal.css, which is really the shared stylesheet for the site's simple inner
   pages — the blog loads it first and only adds what is its own. */

.blog-body{max-width:1080px;margin:0 auto 5rem;padding:0 1.5rem}

/* ---------- index ---------- */
.post-list{max-width:760px;margin:0 auto;list-style:none}
.post-item{border-top:1px dotted rgba(20,20,20,.28);padding:2.2rem 0}
.post-item:last-child{border-bottom:1px dotted rgba(20,20,20,.28)}
.post-item a.post-link{display:grid;grid-template-columns:150px 1fr;gap:0 2rem;align-items:start}
.post-item .thumb{width:150px;aspect-ratio:1/1;object-fit:cover;border-radius:4px;display:block}
.post-item .no-thumb{display:none}
.post-date{display:block;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--wine);margin-bottom:.5rem}
.post-item h2{font-size:clamp(1.5rem,3.4vw,2.1rem);line-height:1.2;margin-bottom:.5rem}
.post-item p{font-size:.95rem;line-height:1.7;opacity:.8;max-width:52ch}
.post-item a.post-link:hover h2{color:var(--wine)}
.post-more{display:inline-block;margin-top:.7rem;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:2px}

/* Nothing published yet — say so plainly rather than showing an empty page. */
.post-empty{max-width:560px;margin:1rem auto 0;padding:2.5rem 2rem;background:var(--cream);border-radius:14px;text-align:center;font-size:1rem;line-height:1.75}
.post-empty strong{display:block;font-family:Italiana,serif;font-size:1.6rem;font-weight:400;margin-bottom:.6rem}

/* ---------- single post ---------- */
.post{max-width:1080px;margin:0 auto 5rem;padding:3rem 3.5rem;background:var(--cream);border-radius:14px;box-shadow:0 2px 14px rgba(20,20,20,.04)}
.post-inner{max-width:680px;margin:0 auto;font-size:1.05rem;line-height:1.8}
.post-hero{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:8px;margin-bottom:2.2rem;display:block}
.post-inner h2{font-size:clamp(1.4rem,3vw,1.9rem);line-height:1.3;margin:2.2rem 0 .8rem}
.post-inner h3{font-size:1.2rem;margin:1.8rem 0 .6rem}
.post-inner p{margin:0 0 1.15rem}
.post-inner ul{margin:0 0 1.15rem 1.2rem}
.post-inner li{margin:.4rem 0}
.post-inner strong{font-weight:500}
.post-inner em{font-style:italic}
.post-inner a{text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.post-inner a:hover{color:var(--wine)}
.post-back{display:block;max-width:680px;margin:2.5rem auto 0;padding-top:1.6rem;border-top:1px dotted rgba(20,20,20,.28);font-size:.75rem;letter-spacing:.18em;text-transform:uppercase}
.post-back:hover{color:var(--wine)}

@media(max-width:820px){
  .blog-body{padding:0 1.1rem}
  .post-item{padding:1.6rem 0}
  .post-item a.post-link{grid-template-columns:96px 1fr;gap:0 1.1rem}
  .post-item .thumb{width:96px}
  .post-item p{font-size:.9rem}
  .post{margin:0 1.1rem 3.5rem;padding:1.6rem 1.25rem}
  .post-inner{font-size:1rem}
  .post-hero{aspect-ratio:4/3;margin-bottom:1.5rem}
}
@media(max-width:520px){
  .post-item a.post-link{grid-template-columns:1fr}
  .post-item .thumb{width:100%;aspect-ratio:16/9;margin-bottom:.9rem}
}