/* =========================================================
   BLOG — listagem + post individual
   ========================================================= */

/* ---- LISTAGEM — grid de cards ---- */
.blog-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:clamp(20px,3vw,36px);
}
@media (max-width:860px){ .blog-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .blog-grid{ grid-template-columns:1fr; } }

.blog-card{
  display:flex; flex-direction:column;
  background:#fff;
  overflow:hidden;
  transition:transform .3s ease, box-shadow .3s ease;
  text-decoration:none; color:var(--ink);
}
.blog-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 36px rgba(42,58,48,.12);
}

.blog-card__img{
  position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--sand,#F4ECDA);
}
.blog-card__img img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s ease;
}
.blog-card:hover .blog-card__img img{ transform:scale(1.04); }

.blog-card__body{ padding:clamp(16px,2vw,28px); flex:1; display:flex; flex-direction:column; }

.blog-card__date{
  font-family:var(--font-display); font-weight:600;
  font-size:.76rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--alecrim); margin-bottom:.5rem;
}

.blog-card__title{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(1.1rem,1.6vw,1.35rem); line-height:1.2;
  color:var(--ink); margin-bottom:.7rem;
}

.blog-card__excerpt{
  font-size:.95rem; line-height:1.55;
  color:var(--ink-soft,rgba(42,58,48,.72));
  flex:1;
}

.blog-card__link{
  font-family:var(--font-display); font-weight:600;
  font-size:.88rem; color:var(--alecrim);
  margin-top:1rem; display:inline-block;
}
.blog-card__link .arrow{ transition:transform .2s; display:inline-block; }
.blog-card:hover .blog-card__link .arrow{ transform:translateX(4px); }

.blog-empty{
  text-align:center; color:var(--ink-soft);
  font-size:1.1rem; padding:clamp(60px,10vw,120px) 0;
}

/* ---- POST INDIVIDUAL — hero cover ---- */
.post-hero{
  width:100vw; margin-left:calc(50% - 50vw);
  height:clamp(300px,42vw,520px);
  position:relative; overflow:hidden;
  background:var(--sand,#F4ECDA);
}
.post-hero__img{
  position:absolute; inset:0;
}
.post-hero__img img{
  width:100%; height:100%; object-fit:cover;
}

/* ---- POST INDIVIDUAL — conteúdo ---- */
.post-back{
  display:inline-block;
  font-family:var(--font-display); font-weight:600;
  font-size:.88rem; color:var(--alecrim);
  margin-bottom:clamp(24px,3vw,40px);
  text-decoration:none;
  transition:color .2s;
}
.post-back:hover{ color:var(--ink); }

.post-header{ margin-bottom:clamp(28px,4vw,48px); max-width:720px; }

.post-date{
  font-family:var(--font-display); font-weight:600;
  font-size:.78rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--alecrim); display:block; margin-bottom:.7rem;
}

.post-title{
  font-family:var(--font-display); font-weight:700;
  font-size:clamp(1.8rem,4vw,3rem); line-height:1.1;
  color:var(--ink);
}

.post-body{
  max-width:720px;
  font-size:1.08rem; line-height:1.75;
  color:var(--ink);
}
.post-body p{ margin-bottom:1.4rem; }
.post-body p + p{ margin-top:0; }
.post-body img{
  width:100%; height:auto; margin:2rem 0;
  display:block;
}
.post-body h2{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(1.3rem,2.5vw,1.8rem);
  margin:2.5rem 0 1rem; color:var(--ink);
}
.post-body h3{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(1.1rem,2vw,1.4rem);
  margin:2rem 0 .8rem; color:var(--ink);
}
.post-body blockquote{
  border-left:3px solid var(--alecrim);
  padding-left:1.2rem; margin:1.5rem 0;
  color:var(--ink-soft);
  font-style:italic;
}