/* ===========================
   BLOG (SCOPED) — sicuro da caricare ovunque
=========================== */

/* Sfondo/colore solo quando il body ha il flag del blog */
body.site.has-blog { background:#f6f7f9; color:#1d1f24; }

/* Card Bootstrap (nuovo layout coerente con il sito) */
.blog-card{ border-radius:16px; overflow:hidden; }
.blog-cover{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.blog-title{ color:inherit; text-decoration:none; }
.blog-title:hover{ text-decoration:underline; text-underline-offset:3px; }

/* Articolo singolo */
.article{ max-width: 860px; margin: 0 auto; }
.article h1{ font-size: clamp(28px, 3vw, 44px); margin: 0 0 10px; }
.article .meta{ color: rgba(17,24,39,.6); font-size: .95rem; margin-bottom: 18px; }
.article img{ max-width: 100%; height: auto; border-radius: 16px; margin: 14px 0 18px; }
.article p{ line-height: 1.8; }
.nav-articles{ display:flex; justify-content:space-between; gap:12px; margin: 24px 0; }
.nav-articles a{ text-decoration:none; }
.nav-articles a:hover{ text-decoration:underline; text-underline-offset:3px; }
.back a{ text-decoration:none; }
.back a:hover{ text-decoration:underline; text-underline-offset:3px; }

/* Wrapper del blog: mettilo su <main> nelle pagine blog */
.blog-container { max-width:1060px; margin:0 auto; padding:24px; }
.blog-container h1{ font-size:clamp(28px, 3vw, 40px); margin:10px 0 14px; }

/* Card articolo */
.blog-container .post-card{
  background:#0f1013;
  color:#e9edf2;
  border:1px solid #24262c;
  border-radius:16px;
  padding:18px;
  margin:20px 0 28px;
  box-shadow:0 10px 24px rgba(0,0,0,.15);
  transition: transform .25s ease, border-color .25s ease;
}
.blog-container .post-card:hover{ border-color:#d33; transform: translateY(-2px); }

.blog-container .post-card .title{ color:#fff; text-decoration:none; }
.blog-container .post-card .title:hover{ color:#ffd18a; }

/* Cover */
.blog-container .post-cover{
  width:100%;
  aspect-ratio:16/9;
  border-radius:12px;
  object-fit:cover;
  object-position:50% 40%;
  margin:10px 0;
  display:block;
}

/* Testi meta */
.blog-container .post-excerpt{ color:#c1c7d0; line-height:1.6; margin-top:10px; }
.blog-container .post-meta{ color:#98a1ad; font-size:14px; margin-top:8px; }

/* Pager */
.blog-container .pager{ display:flex; gap:8px; justify-content:center; margin:22px 0; }
.blog-container .pager a,
.blog-container .pager span{
  border:1px solid #dfe3ea; background:#fff; color:#0d2a55;
  padding:8px 12px; border-radius:10px; text-decoration:none;
}
.blog-container .pager .current{ background:#f1f3f7; color:#6a7280; }

/* (Opzionale) griglia elenco post */
.blog-container .post-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:18px;
}

/* Responsive extra (solo blog) */
@media (max-width:900px){
  .blog-container .footer-grid{ grid-template-columns:1fr; }
}