/* ===== Blog listing grid ===== */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
@media (max-width:860px){.blog-grid{grid-template-columns:1fr;}}

.article-card{
  background:var(--bg-panel);
  border:1px solid var(--line-soft);
  border-radius:4px;
  overflow:hidden;
  transition:border-color .25s ease, transform .25s ease;
}
.article-card:hover{border-color:var(--gold);transform:translateY(-3px);}
.article-thumb{display:block;aspect-ratio:16/10;overflow:hidden;}
.article-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.article-card:hover .article-thumb img{transform:scale(1.05);}
.article-card .article-body{padding:24px 24px 28px;max-width:none;margin:0;}
.article-meta{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.article-cat{
  font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--gold-soft);border:1px solid var(--line);padding:4px 10px;border-radius:12px;
}
.article-date{font-size:12.5px;color:var(--ink-faint);}
.article-card h3{font-size:19px;margin-bottom:10px;line-height:1.35;}
.article-link{color:var(--cream);transition:color .2s;}
.article-link:hover{color:var(--gold-soft);}
.article-excerpt{font-size:14px;color:var(--ink-muted);}

/* ===== Article (single post) page ===== */
.article-page{padding-bottom:80px;}
.article-header{padding:56px 0 0;}
.article-hero-img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:4px;margin:32px 0 40px;border:1px solid var(--line);}
.card-meta{display:flex;align-items:center;gap:14px;font-size:13px;color:var(--ink-faint);margin-bottom:18px;}
.breadcrumb{font-size:13px;color:var(--ink-faint);margin-bottom:20px;}
.breadcrumb a{color:var(--ink-faint);}
.breadcrumb a:hover{color:var(--gold-soft);}
.breadcrumb-sep{margin:0 8px;color:var(--line);}
.article-h1{font-size:38px;margin-bottom:18px;max-width:820px;}
.author-byline{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-muted);margin-bottom:8px;}
.author-name{color:var(--gold-soft);}
.author-sep{color:var(--ink-faint);}
.article-lead{font-size:18px;color:var(--ink-muted);max-width:760px;margin:20px 0 8px;font-family:'Playfair Display',serif;font-style:italic;}

.article-body{max-width:760px;margin:0 auto;font-size:16.5px;color:var(--ink-muted);}
.article-body h2{color:var(--cream);font-size:26px;margin:40px 0 16px;}
.article-body h3{color:var(--cream);font-size:20px;margin:30px 0 12px;}
.article-body p{margin-bottom:20px;}
.article-body ul,.article-body ol{margin:0 0 20px 22px;}
.article-body li{margin-bottom:8px;}
.article-body a{color:var(--gold-soft);text-decoration:underline;}
.article-body blockquote{border-left:3px solid var(--gold);padding:4px 24px;margin:28px 0;font-style:italic;color:var(--cream);font-family:'Playfair Display',serif;font-size:19px;}
.article-body img{border-radius:4px;margin:24px 0;border:1px solid var(--line);}

.author-bio-card{
  max-width:760px;margin:56px auto 0;
  display:flex;gap:20px;align-items:flex-start;
  background:var(--bg-panel);border:1px solid var(--line-soft);border-radius:4px;padding:28px;
}
.author-bio-avatar{width:64px;height:64px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.author-bio-name{font-family:'Playfair Display',serif;font-size:17px;color:var(--cream);margin-bottom:4px;}
.author-bio-title{font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:10px;}
.author-bio-text{font-size:14.5px;color:var(--ink-muted);}

.faq-section{max-width:760px;margin:56px auto 0;}
.faq-section h2{font-size:26px;margin-bottom:20px;}
#faq-items{display:flex;flex-direction:column;}
#faq-items .faq-item{border-bottom:1px solid var(--line-soft);padding:22px 0;}

.cta-banner{margin-top:56px;}

.related-section{max-width:1180px;margin:72px auto 0;padding:0 32px;}
.related-section h2{font-size:26px;margin-bottom:28px;text-align:center;}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.rel-card{background:var(--bg-panel);border:1px solid var(--line-soft);border-radius:4px;overflow:hidden;}
.rel-card img{width:100%;aspect-ratio:16/10;object-fit:cover;}
.rel-title{padding:16px 18px;font-size:15px;color:var(--cream);}
@media (max-width:860px){.related-grid{grid-template-columns:1fr;}}