/* ============================================================
   blog.css — estilos exclusivos de pages/blog.html
   ============================================================ */

/* ── BLOG CARD ── */
.card-blog {
  background: var(--blanco);
  border-radius: var(--radio-lg);
  overflow: hidden;
  border: 1px solid var(--crema-oscura);
  transition: var(--transicion);
}
.card-blog:hover { box-shadow: var(--sombra-media); transform: translateY(-4px); }
.card-blog__img { width: 100%; height: 200px; object-fit: cover; }
.card-blog__body { padding: 24px; }
.card-blog__cat {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--verde-claro);
  margin-bottom: 8px;
}
.card-blog__title { font-size: 1.05rem; color: var(--verde-oscuro); margin-bottom: 10px; }
.card-blog__excerpt { font-size: 0.875rem; margin-bottom: 16px; }
.card-blog__meta { font-size: 0.78rem; color: var(--tierra-claro); }

.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  .blog-grid { grid-template-columns: 1fr; }
}