.article-page{
  max-width:760px;
  margin:0 auto;
  padding:0 24px 64px;
}

.article-header{padding-top:32px;}
.article-hero-img{
  width:100%;
  height:360px;
  object-fit:cover;
  border-radius:8px;
}

.card-meta{margin-top:16px;}
.breadcrumb{font-size:13px;color:#6a6a6a;}
.breadcrumb a{color:var(--teal);font-weight:600;}
.breadcrumb-sep{margin:0 6px;color:#999;}

.article-h1{
  font-size:34px;
  font-weight:800;
  line-height:1.2;
  margin-top:16px;
}

.author-byline{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:14px;
  font-size:14px;
  color:#5a5a5a;
}
.author-name{font-weight:700;color:var(--ink);}
.author-sep{color:#bbb;}

.article-lead{
  font-size:18px;
  color:#3d3d3d;
  margin-top:20px;
  line-height:1.6;
}

.article-body{
  margin-top:24px;
  font-size:17px;
  line-height:1.75;
  color:var(--ink);
}
.article-body p{margin-bottom:20px;}
.article-body h2{
  font-size:24px;
  font-weight:800;
  margin:36px 0 16px;
}
.article-body h3{
  font-size:19px;
  font-weight:700;
  margin:28px 0 12px;
}
.article-body ul, .article-body ol{
  margin:0 0 20px 24px;
}
.article-body li{margin-bottom:8px;}
.article-body a{color:var(--teal);font-weight:600;text-decoration:underline;}

.author-bio-card{
  display:flex;
  gap:16px;
  align-items:flex-start;
  border:1px solid var(--border);
  border-radius:10px;
  padding:20px;
  margin-top:48px;
  background:#fafafa;
}
.author-bio-avatar{
  width:56px;
  height:56px;
  border-radius:50%;
  object-fit:cover;
  flex-shrink:0;
}
.author-bio-name{font-weight:800;font-size:15px;}
.author-bio-title{font-size:13px;color:var(--teal);font-weight:600;margin-top:2px;}
.author-bio-text{font-size:14px;color:#5a5a5a;margin-top:8px;line-height:1.5;}

.faq-section{margin-top:48px;}
.faq-section h2{font-size:22px;font-weight:800;margin-bottom:16px;}
#faq-items .faq-item{
  border-top:1px solid var(--border);
  padding:16px 0;
}
#faq-items .faq-item:last-child{border-bottom:1px solid var(--border);}
#faq-items .faq-q{font-weight:700;font-size:15px;margin-bottom:6px;}
#faq-items .faq-a{font-size:14px;color:#5a5a5a;line-height:1.6;}

.cta-banner{
  margin-top:48px;
  background:var(--bg-tint);
  border-radius:10px;
  padding:28px;
  text-align:center;
}

@media (max-width:600px){
  .article-hero-img{height:220px;}
  .article-h1{font-size:26px;}
}