/* =============================================================
   DOCES PALESTINA — Blog, Receitas, Contato, Onde Comprar, História
   Arquivo: assets/css/blog.css
   Desenvolvedor: Juliano Alves
   ============================================================= */

/* -----------------------------------------------------------
   Blog — Card de post
   ----------------------------------------------------------- */
.blog-card {
  background: var(--cor-branco);
  border-radius: var(--raio-lg);
  box-shadow: var(--sombra-sm);
  overflow: hidden;
  transition: var(--trans-normal);
  display: flex;
  flex-direction: column;
}
.blog-card:hover {
  box-shadow: var(--sombra-lg);
  transform: translateY(-5px);
}
.blog-card__foto-wrapper {
  overflow: hidden;
  aspect-ratio: 16/9;
}
.blog-card__foto {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s ease;
}
.blog-card:hover .blog-card__foto {
  transform: scale(1.07);
}
.blog-card__corpo {
  padding: var(--esp-6);
  flex: 1;
  display: flex;
  flex-direction: column;
}
.blog-card__data {
  font-size: var(--tamanho-xs);
  color: var(--cor-texto-claro);
  margin-bottom: var(--esp-2);
  display: flex;
  align-items: center;
  gap: var(--esp-2);
}
.blog-card__data svg { width: 13px; height: 13px; }
.blog-card__titulo {
  font-size: var(--tamanho-xl);
  font-weight: var(--peso-bold);
  color: var(--cor-primaria);
  margin-bottom: var(--esp-3);
  line-height: 1.3;
  transition: var(--trans-rapida);
}
.blog-card:hover .blog-card__titulo { color: var(--cor-destaque); }
.blog-card__resumo {
  font-size: var(--tamanho-sm);
  color: var(--cor-texto-suave);
  line-height: 1.7;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.blog-card__rodape {
  margin-top: var(--esp-5);
  padding-top: var(--esp-4);
  border-top: 1px solid var(--cor-borda);
}

/* Post completo */
.blog-post-conteudo {
  max-width: 760px;
  margin-inline: auto;
  font-size: var(--tamanho-md);
  line-height: 1.8;
  color: var(--cor-texto);
}
.blog-post-conteudo h2, .blog-post-conteudo h3 {
  margin-top: var(--esp-8);
  margin-bottom: var(--esp-4);
}
.blog-post-conteudo p { margin-bottom: var(--esp-5); }
.blog-post-conteudo ul, .blog-post-conteudo ol {
  margin-block: var(--esp-4);
  padding-left: var(--esp-6);
}
.blog-post-conteudo li { list-style: disc; margin-bottom: var(--esp-2); }
.blog-post-conteudo img {
  border-radius: var(--raio-lg);
  margin-block: var(--esp-6);
  width: 100%;
}
