/* Article Hero */
.article-hero-section { min-height: 60vh; padding: 60px 0; position: relative; display: flex; align-items: center; justify-content: center; text-align: center; background-size: cover; background-position: center; color: #fff; }
.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); }
.hero-text { position: relative; z-index: 5; text-shadow: 0 2px 10px rgba(0,0,0,0.7); }
.back-link { color: #fff; text-decoration: none; margin-bottom: 20px; display: inline-block; opacity: 0.8; transition: opacity 0.3s; }
.back-link:hover { opacity: 1; }
.hero-text h1 { font-size: 3.2rem; font-weight: bold; margin-bottom: 1rem; }
.article-meta { font-size: 1rem; opacity: 0.9; }

/* Article Body */
.article-body { padding: 60px 0; background: #fff; }
.content-container { max-width: 750px; /* Optimal width for reading */ margin: 0 auto; }
.article-body p, .article-body ul li { font-size: 1.2rem; line-height: 1.9; margin-bottom: 1.5rem; color: #333; }
.article-body .lead { font-size: 1.4rem; font-weight: 300; color: #000; margin-bottom: 2rem; }
.article-body h2 { font-size: 2.2rem; color: var(--primary-red); margin-top: 3rem; margin-bottom: 1.5rem; }
.article-body blockquote { border-left: 5px solid var(--primary-red); padding-left: 2rem; margin: 2rem 0; font-size: 1.4rem; font-style: italic; color: #555; }
.inline-image { width: 100%; height: auto; border-radius: 10px; margin: 2rem 0; box-shadow: 0 10px 25px rgba(0,0,0,0.1); }

/* Animation */
.animate-on-scroll { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
.animate-on-scroll.is-visible { opacity: 1; transform: translateY(0); }

/* Responsive */
@media (max-width: 768px) {
    .hero-text h1 { font-size: 2.2rem; }
    .article-body p, .article-body ul li, .article-body .lead { font-size: 1.1rem; }
}