/* Blog styles: blog.html listing and /blog/ posts */
:root { --adhoc-primary: #681B1B; --adhoc-dark: #353535; }

.blog-breadcrumb { font-size: .9rem; margin-bottom: .75rem; }
.blog-breadcrumb a { color: var(--adhoc-primary); }
.blog-intro { max-width: 720px; margin: 0 auto 2.5rem; color: #666; }

/* Category filter */
.blog-filters { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-bottom: 2.5rem; }
.blog-filter {
    border: 2px solid var(--adhoc-primary); background: #fff; color: var(--adhoc-primary);
    padding: .4rem 1.1rem; font-family: Roboto, sans-serif; font-weight: 500; font-size: .9rem;
    transition: all .2s ease;
}
.blog-filter:hover, .blog-filter.active { background: var(--adhoc-primary); color: #fff; }

/* Featured post */
.blog-featured { background: #fff; box-shadow: 0 0 45px rgba(0,0,0,.07); margin-bottom: 3rem; }
.blog-featured .blog-img img { height: 260px; }
@media (min-width: 992px) {
    .blog-featured .blog-img { height: 100%; min-height: 380px; }
    .blog-featured .blog-img img { position: absolute; inset: 0; height: 100%; }
}
.blog-featured h2 { font-size: 1.75rem; }

/* Cards (follow .service-item pattern from services.html) */
.blog-card { height: 100%; display: flex; flex-direction: column; background: #fff; }
.blog-img { overflow: hidden; position: relative; }
.blog-img img { width: 100%; height: 220px; object-fit: cover; transition: transform .5s ease; }
.blog-card:hover .blog-img img, .blog-featured:hover .blog-img img { transform: scale(1.06); }
.blog-cat {
    position: absolute; top: 15px; left: 15px; background: var(--adhoc-primary); color: #fff;
    font-size: .75rem; font-weight: 500; letter-spacing: .5px; text-transform: uppercase; padding: .3rem .7rem;
}
.blog-card .blog-body { flex: 1; display: flex; flex-direction: column; }
.blog-meta { font-size: .8rem; color: #888; margin-bottom: .6rem; }
.blog-meta i { color: var(--adhoc-primary); margin-right: .3rem; }
.blog-meta span + span { margin-left: 1rem; }
.blog-card h3 { font-size: 1.1rem; line-height: 1.4; }
.blog-card h3 a, .blog-featured h2 a { color: var(--adhoc-dark); }
.blog-card h3 a:hover, .blog-featured h2 a:hover { color: var(--adhoc-primary); }
.blog-card p { color: #666; font-size: .95rem; }
.blog-readmore { margin-top: auto; font-weight: 500; color: var(--adhoc-primary); }
.blog-readmore i { transition: margin .2s ease; }
.blog-readmore:hover i { margin-left: .9rem !important; }
.blog-col.d-none-filter { display: none !important; }

/* Pagination */
.blog-pagination .page-link { color: var(--adhoc-primary); border-radius: 0 !important; margin: 0 3px; min-width: 42px; text-align: center; }
.blog-pagination .page-item.active .page-link { background: var(--adhoc-primary); border-color: var(--adhoc-primary); color: #fff; }

/* CTA band */
.blog-cta { background: linear-gradient(rgba(104,27,27,.92), rgba(104,27,27,.92)), url(/img/services/main/amc_service.jpg) center/cover; }
.blog-cta .btn-light { color: var(--adhoc-primary); font-weight: 500; }

@media (max-width: 991.98px) {
    .blog-featured h2 { font-size: 1.4rem; }
}

/* ---------- Article pages ---------- */
.post-wrap { max-width: 860px; margin: 0 auto; }
.post-header .blog-cat { position: static; display: inline-block; margin-bottom: 1rem; }
.post-hero img { width: 100%; max-height: 460px; object-fit: cover; }
.post-body { font-size: 1.05rem; line-height: 1.85; color: #555; }
.post-body h2 { font-size: 1.6rem; margin: 2.2rem 0 1rem; }
.post-body h3 { font-size: 1.25rem; margin: 1.8rem 0 .8rem; }
.post-body ul, .post-body ol { margin-bottom: 1.4rem; }
.post-body img { max-width: 100%; height: auto; margin: 1rem 0; }
.post-body a { color: var(--adhoc-primary); text-decoration: underline; }
.post-body blockquote { border-left: 4px solid var(--adhoc-primary); padding: .5rem 1.2rem; background: #f8f8f8; }
.post-body table { width: 100%; margin-bottom: 1.4rem; border-collapse: collapse; }
.post-body th, .post-body td { border: 1px solid #e5e5e5; padding: .6rem .8rem; }
.post-related { border: 5px solid #f8f8f8; padding: 1.5rem; }
.blog-empty { max-width: 560px; margin: 1rem auto 0; padding: 3rem 2rem; border: 5px solid #f8f8f8; text-align: center; color: #666; }
.post-takeaways { background: #f8f8f8; border-left: 4px solid var(--adhoc-primary); padding: 1.5rem 1.75rem .5rem; margin: 2rem 0; }
.post-takeaways h2 { font-size: 1.25rem; margin: 0 0 .75rem; }