/* Blog Styles — extends main site styles */
.blog-hero { padding:140px 20px 60px; text-align:center; background:linear-gradient(180deg,#0a0a0a 0%,#111 100%) !important; color:#f0f0f0; }
.blog-hero h1 { font-size:clamp(1.8rem,4vw,2.8rem); font-weight:900; letter-spacing:-1px; max-width:700px; margin:0 auto 16px; line-height:1.2; }
.blog-hero .meta { color:#94a3b8; font-size:0.9rem; }
.blog-hero .meta span { margin:0 8px; }
.blog-hero .tag { display:inline-block; background:rgba(239,68,68,0.1); color:#ef4444; padding:4px 12px; border-radius:20px; font-size:0.75rem; font-weight:700; letter-spacing:0.5px; text-transform:uppercase; margin-bottom:16px; }

.blog-content { max-width:740px; margin:0 auto; padding:40px 20px 80px; background:#0a0a0a; color:#ececec; }
html, body { background:#0a0a0a !important; color:#f0f0f0 !important; }
html body h1, html body h2, html body h3, html body h4, html body h5, html body p, html body li, html body span, html body div { color: inherit; }
article.blog-content, article.blog-content * { color:#ececec; }
article.blog-content h2, article.blog-content h3 { color:#ffffff !important; }
article.blog-content strong { color:#ffffff !important; }
.blog-hero, .blog-hero * { color:#f0f0f0; }
.blog-hero h1 { color:#ffffff !important; }
.blog-content h2 { font-size:1.5rem; font-weight:800; margin:40px 0 16px; color:#ffffff !important; }
.blog-content h3 { font-size:1.2rem; font-weight:700; margin:30px 0 12px; color:#ffffff !important; }
.blog-content p { color:#ececec; font-size:1.05rem; line-height:1.85; margin-bottom:20px; }
.blog-content ul, .blog-content ol { color:#ececec; font-size:1.05rem; line-height:1.85; margin:0 0 20px 24px; }
.blog-content li { margin-bottom:8px; }
.blog-content strong { color:#ffffff; }
.blog-content blockquote { border-left:3px solid #ef4444; padding:16px 24px; margin:24px 0; background:rgba(239,68,68,0.05); border-radius:0 8px 8px 0; }
.blog-content blockquote p { color:#f0f0f0; margin:0; font-style:italic; }

.blog-cta { background:#111; border:1px solid #1e293b; border-radius:16px; padding:40px; text-align:center; margin:50px 0; }
.blog-cta h3 { font-size:1.3rem; font-weight:800; margin-bottom:8px; color:#f8fafc; }
.blog-cta p { color:#b0b8c4; margin-bottom:20px; }
.blog-cta .btn-red { display:inline-block; background:#dc2626; color:#fff; padding:14px 32px; border-radius:8px; font-weight:700; font-size:0.95rem; text-decoration:none; transition:all 0.3s; }
.blog-cta .btn-red:hover { background:#ef4444; transform:translateY(-2px); }
.blog-cta .phone { display:block; margin-top:12px; color:#dc2626; font-weight:700; font-size:1.1rem; }

/* Blog index */
.blog-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:24px; max-width:1000px; margin:0 auto; padding:0 20px; }
.blog-card { background:#111; border:1px solid #1e293b; border-radius:12px; padding:28px; transition:all 0.3s; text-decoration:none; display:block; }
.blog-card:hover { border-color:#ef4444; transform:translateY(-2px); box-shadow:0 8px 30px rgba(0,0,0,0.3); }
.blog-card .card-tag { font-size:0.7rem; font-weight:700; color:#ef4444; text-transform:uppercase; letter-spacing:1px; margin-bottom:10px; }
.blog-card h3 { font-size:1.1rem; font-weight:700; color:#f8fafc; margin-bottom:8px; line-height:1.4; }
.blog-card p { font-size:0.9rem; color:#b0b8c4; line-height:1.6; margin-bottom:12px; }
.blog-card .read-more { font-size:0.85rem; font-weight:600; color:#ef4444; }

.blog-index-hero { padding:140px 20px 40px; text-align:center; }
.blog-index-hero h1 { font-size:2.2rem; font-weight:900; margin-bottom:12px; }
.blog-index-hero p { color:#b0b8c4; font-size:1.05rem; max-width:500px; margin:0 auto; }

@media(max-width:768px) {
  .blog-grid { grid-template-columns:1fr; }
  .blog-content { padding:30px 16px 60px; }
}