/* ===========================================================
   Spacivo Journal — heading + "Read more" link above a responsive grid of
   blog post cards. Self-contained plugin CSS (no theme dependency beyond
   the theme's own .container wrapper and --color-accent/--color-muted/
   --radius-md variables).
   =========================================================== */

.spacivo-jn-section { padding: 3rem 0; }

.spacivo-jn-header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.spacivo-jn-heading { margin: 0; }
.spacivo-jn-read-more {
  color: var(--color-accent, #72192D); font-weight: 600; text-decoration: none; white-space: nowrap;
}
.spacivo-jn-read-more:hover { text-decoration: none; }

.spacivo-jn-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
@media (min-width: 750px) { .spacivo-jn-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.spacivo-jn-card { display: block; text-decoration: none; color: inherit; }

.spacivo-jn-card__image { border-radius: var(--radius-md, 8px); overflow: hidden; aspect-ratio: 3 / 2; }
.spacivo-jn-card__image img { width: 100%; height: 100%; object-fit: cover; display: block; }

.spacivo-jn-placeholder {
  width: 100%; height: 100%; min-height: 200px; position: relative; overflow: hidden;
  background: linear-gradient(135deg, #F5EBE0 0%, #E8D5E0 50%, #D4C5D9 100%);
}
.spacivo-jn-placeholder::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.3), transparent);
}

.spacivo-jn-card__meta { color: var(--color-muted, #8a8a8a); font-size: .85rem; margin-top: .75rem; }
.spacivo-jn-card__title { font-size: 1.1rem; margin: .25rem 0; }
.spacivo-jn-card__excerpt { color: var(--color-muted, #8a8a8a); font-size: .9rem; margin: 0; }

.spacivo-jn-unconfigured-notice {
  font-size: .85rem; color: #a22022; background: #fff3f3; border: 1px dashed #a22022;
  padding: .75rem 1rem; margin: 1rem auto; max-width: 1280px;
}