/* Blog article styles */
.blog-article{max-width:820px;margin:0 auto}
.article-header{margin-bottom:2.5rem}
.article-category{
  display:inline-block;background:rgba(200,150,62,.12);color:var(--accent-dark);
  font-size:.75rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  padding:.3rem .8rem;border-radius:50px;margin-bottom:1rem;
}
.article-title{font-size:clamp(1.8rem,3.5vw,2.5rem);line-height:1.2;margin-bottom:.75rem}
.article-meta{
  display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;
  font-size:.85rem;color:var(--neutral-600);
  padding:.75rem 0;
  border-top:1px solid var(--neutral-200);
  border-bottom:1px solid var(--neutral-200);
  margin-bottom:1.5rem;
}
.article-meta span{display:flex;align-items:center;gap:.35rem}
.article-hero-img{
  width:100%;height:400px;object-fit:cover;
  border-radius:var(--radius-xl);
  margin-bottom:2rem;
  box-shadow:var(--shadow-lg);
}
.article-body h2{margin:2rem 0 .75rem}
.article-body h3{margin:1.5rem 0 .6rem;font-size:1.25rem}
.article-body p{font-size:1rem;line-height:1.8;margin-bottom:1.25rem;color:var(--neutral-700)}
.article-body ul,.article-body ol{padding-left:1.5rem;margin-bottom:1.25rem}
.article-body li{margin-bottom:.5rem;font-size:1rem;color:var(--neutral-700);line-height:1.7}
.article-body blockquote{
  border-left:4px solid var(--accent);
  background:rgba(200,150,62,.06);
  padding:1.25rem 1.5rem;
  margin:1.5rem 0;
  border-radius:0 var(--radius-md) var(--radius-md) 0;
  font-style:italic;color:var(--neutral-700);
}
.article-body blockquote cite{display:block;font-style:normal;font-size:.85rem;margin-top:.5rem;font-weight:600;color:var(--primary)}
.article-body .article-img{
  width:100%;border-radius:var(--radius-lg);
  margin:1.5rem 0;box-shadow:var(--shadow-md);
  height:300px;object-fit:cover;
}
.article-body figcaption{font-size:.82rem;color:var(--neutral-600);text-align:center;margin-top:.5rem;font-style:italic}
.article-body a{color:var(--accent);text-decoration:underline;font-weight:500}
.article-body a:hover{color:var(--accent-dark)}
.article-body .highlight-box{margin:1.5rem 0}
.article-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--neutral-200)}
.article-tag{
  background:var(--neutral-100);color:var(--neutral-700);
  font-size:.78rem;padding:.3rem .8rem;border-radius:50px;
  border:1px solid var(--neutral-200);
  transition:var(--transition);
}
.article-tag:hover{background:var(--accent);color:var(--white);border-color:var(--accent)}

/* Author box */
.author-box{
  background:var(--neutral-50);border:1px solid var(--neutral-200);
  border-radius:var(--radius-lg);padding:1.5rem 2rem;
  display:flex;gap:1.25rem;align-items:flex-start;
  margin:2.5rem 0;
}
.author-avatar{
  width:64px;height:64px;min-width:64px;border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--primary-light));
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;color:var(--white);font-weight:700;font-family:var(--font-heading);
}
.author-name{font-size:.95rem;font-weight:700;color:var(--primary);margin-bottom:.15rem}
.author-title{font-size:.8rem;color:var(--accent);font-weight:600;margin-bottom:.5rem}
.author-bio{font-size:.875rem;color:var(--neutral-600);margin:0}

/* Related articles */
.related-articles{margin-top:3rem}
.related-articles h3{margin-bottom:1.5rem}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.related-card{
  background:var(--white);border-radius:var(--radius-md);overflow:hidden;
  border:1px solid var(--neutral-200);transition:var(--transition);
}
.related-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}
.related-card img{width:100%;height:140px;object-fit:cover}
.related-card-body{padding:1rem}
.related-card-body .blog-category{margin-bottom:.4rem}
.related-card-body h4{font-size:.925rem;color:var(--primary);line-height:1.3;margin-bottom:.5rem}
.related-card-body a{font-size:.82rem;color:var(--accent);font-weight:600}
@media(max-width:768px){
  .related-grid{grid-template-columns:1fr}
  .article-hero-img{height:240px}
  .author-box{flex-direction:column}
}
