/* Blog Post Styles */
.blog-header { background: var(--navy); padding: 60px 5%; }
.blog-header .blog-content { background: transparent; }
.blog-content { max-width: 800px; margin: 0 auto; padding: 40px 5%; background: var(--white); min-height: 50vh; box-shadow: 0 0 40px rgba(0,0,0,0.05); opacity: 1 !important; }
.blog-content h1 { font-size: clamp(28px, 5vw, 42px); margin-bottom: 20px; color: var(--white); }
.blog-content h2 { font-size: clamp(22px, 4vw, 28px); margin: 40px 0 20px; color: var(--navy); }
.blog-content h3 { font-size: 20px; margin: 30px 0 15px; color: var(--navy); }
.blog-content p { font-size: 17px; line-height: 1.8; margin-bottom: 20px; color: var(--slate); }
.blog-content ul, .blog-content ol { margin: 20px 0; padding-left: 24px; }
.blog-content li { margin-bottom: 12px; font-size: 17px; line-height: 1.7; }
.blog-content strong { color: var(--navy); }
.blog-meta { color: rgba(255,255,255,0.7); font-size: 14px; margin-top: 16px; }
.blog-meta span { margin-right: 20px; }
.blog-hero-img { width: 100%; height: 400px; object-fit: cover; border-radius: 12px; margin: 30px 0; }
.share-bar { position: sticky; top: 90px; float: right; margin-left: 30px; display: flex; flex-direction: column; gap: 10px; }
.share-btn { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white; transition: transform 0.2s; cursor: pointer; border: none; }
.share-btn:hover { transform: scale(1.1); }
.share-btn svg { width: 20px; height: 20px; }
.share-linkedin { background: #0077b5; }
.share-twitter { background: #1da1f2; }
.share-facebook { background: #1877f2; }
.share-copy { background: #4a5568; }
.cta-box { background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%); color: white; padding: 40px; border-radius: 12px; margin: 40px 0; text-align: center; }
.cta-box h3 { color: white; margin-bottom: 16px; }
.cta-box p { color: rgba(255,255,255,0.85); margin-bottom: 24px; }
.internal-links { background: var(--off-white); padding: 30px; border-radius: 12px; margin: 30px 0; }
.internal-links h4 { margin-bottom: 16px; color: var(--navy); }
.internal-links a { display: block; color: var(--orange); margin-bottom: 8px; }
.internal-links a:hover { text-decoration: underline; }
.highlight-box { background: rgba(232,119,34,0.08); border-left: 4px solid var(--orange); padding: 20px 24px; margin: 24px 0; border-radius: 0 8px 8px 0; }
.stat-box { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 30px 0; }
.stat-item { background: var(--off-white); padding: 24px; border-radius: 8px; text-align: center; }
.stat-number { font-family: 'Syne', sans-serif; font-size: 36px; font-weight: 800; color: var(--orange); }
.stat-label { font-size: 14px; color: var(--slate); margin-top: 8px; }
.breadcrumb { padding: 20px 5%; background: var(--off-white); }
.breadcrumb-container { max-width: 1200px; margin: 0 auto; font-size: 14px; color: var(--slate); }
.breadcrumb a { color: var(--orange); }

/* Blog Index Styles */
.blog-list-header { background: var(--navy); padding: 80px 5%; text-align: center; }
.blog-list-header h1 { font-size: clamp(32px, 5vw, 48px); color: var(--white); margin-bottom: 16px; }
.blog-list-header p { color: rgba(255,255,255,0.8); font-size: 18px; max-width: 600px; margin: 0 auto; }
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 30px; padding: 60px 5%; max-width: 1400px; margin: 0 auto; }
.blog-card { background: white; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.08); transition: transform 0.3s, box-shadow 0.3s; }
.blog-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,0.12); }
.blog-card-img { width: 100%; height: 200px; object-fit: cover; }
.blog-card-content { padding: 24px; }
.blog-card-category { display: inline-block; background: rgba(232,119,34,0.1); color: var(--orange); font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 20px; margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.5px; }
.blog-card h3 { font-size: 20px; color: var(--navy); margin-bottom: 12px; line-height: 1.4; }
.blog-card p { font-size: 15px; color: var(--slate); line-height: 1.6; margin-bottom: 16px; }
.blog-card-meta { display: flex; align-items: center; gap: 16px; font-size: 13px; color: #718096; }
.blog-card-meta span { display: flex; align-items: center; gap: 4px; }
.blog-card-link { display: inline-block; color: var(--orange); font-weight: 600; font-size: 14px; }
.blog-card-link:hover { text-decoration: underline; }

/* Responsive */
@media (max-width: 768px) {
    .stat-box { grid-template-columns: 1fr; }
    .share-bar { position: static; float: none; flex-direction: row; justify-content: center; margin: 20px 0; }
    .blog-hero-img { height: 250px; }
    .blog-grid { grid-template-columns: 1fr; }
}