
.article-hero{position:relative;min-height:70vh;display:flex;align-items:flex-end;overflow:hidden}
.article-hero-bg{position:absolute;inset:0}
.article-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.article-hero-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.2) 50%,rgba(0,0,0,0.3) 100%)}
.article-hero-content{position:relative;z-index:2;max-width:700px;padding:0 24px 80px;margin:0 auto;color:#fff;text-align:center;width:100%}
.article-hero h1{font-size:clamp(2.2rem,4.5vw,3.4rem);margin-bottom:20px;text-shadow:0 2px 20px rgba(0,0,0,0.3)}
.article-meta{display:flex;align-items:center;justify-content:center;gap:16px;font-size:0.78rem;color:rgba(255,255,255,0.8)}
.article-meta-dot{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,0.4)}
.reading-time{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,0.12);backdrop-filter:blur(4px);padding:6px 14px;border-radius:20px;font-size:0.72rem;color:rgba(255,255,255,0.8);margin-bottom:16px}
.article-body{max-width:680px;margin:0 auto;padding:60px 24px 80px}
.article-body p{font-size:1rem;color:#3a3a3a;line-height:1.9;margin-bottom:24px}
.article-body h2{font-size:1.8rem;color:#111;margin:48px 0 20px}
.article-body h3{font-family:'Inter',sans-serif;font-size:1.1rem;font-weight:700;color:#111;margin:36px 0 12px}
.article-body ul,.article-body ol{margin:0 0 24px 0;padding-left:0;list-style:none}
.article-body li{padding:6px 0;font-size:0.95rem;color:#3a3a3a;display:flex;align-items:flex-start;gap:10px}
.article-body li::before{content:'';width:6px;height:6px;border-radius:50%;background:#cd6903;flex-shrink:0;margin-top:10px}
.article-body blockquote{border-left:3px solid #cd6903;padding:20px 24px;margin:32px 0;background:#faf8f5;border-radius:0 12px 12px 0;font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-style:italic;color:#111;line-height:1.5}
.article-body .highlight-box{background:linear-gradient(135deg,rgba(205,105,3,0.06),rgba(205,105,3,0.02));border:1px solid rgba(205,105,3,0.15);border-radius:14px;padding:28px;margin:32px 0}
.article-body .highlight-box h3{margin-top:0;color:#cd6903}
.article-body .checklist-box{background:#faf8f5;border:1px solid #e5e2dc;border-radius:14px;padding:28px;margin:32px 0}
.article-body .checklist-box h3{margin-top:0;font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:#111}
.article-body .checklist-box li::before{content:'';width:18px;height:18px;border:2px solid #cd6903;border-radius:4px;flex-shrink:0;margin-top:2px;background:none}
.article-body .red-flag-box{background:linear-gradient(135deg,rgba(220,38,38,0.04),rgba(220,38,38,0.01));border:1px solid rgba(220,38,38,0.15);border-radius:14px;padding:28px;margin:32px 0}
.article-body .red-flag-box h3{margin-top:0;color:#dc2626;font-family:'Cormorant Garamond',serif;font-size:1.3rem}
.article-body .red-flag-box li::before{background:#dc2626}
.share-bar{display:flex;align-items:center;gap:12px;padding:24px 0;border-top:1px solid #e5e2dc;margin-top:48px}
.share-bar span{font-size:0.72rem;color:#aaa;text-transform:uppercase;letter-spacing:1px}
.share-btn{width:36px;height:36px;border-radius:50%;background:#f4f4f4;display:flex;align-items:center;justify-content:center;font-size:0.85rem;transition:background 0.3s;border:none;cursor:pointer;color:#111}
.share-btn:hover{background:#e5e2dc}
.next-article{padding:60px 24px;background:#efe9df;text-align:center}
.next-article a{display:inline-block;max-width:500px}
.next-article h3{font-family:'Inter',sans-serif;font-size:0.72rem;text-transform:uppercase;letter-spacing:2px;color:#6b6b6b;margin-bottom:12px}
.next-article h2{font-size:1.4rem;color:#111;transition:color 0.3s}
.next-article a:hover h2{color:#cd6903}
.blog-cta{background:#111;padding:48px 24px;text-align:center;color:#fff}
.blog-cta h2{font-size:1.6rem;color:#fff;margin-bottom:12px}
.blog-cta p{font-size:0.88rem;color:rgba(255,255,255,0.6);margin-bottom:24px}
.blog-cta .btn{display:inline-flex;align-items:center;gap:6px;padding:14px 32px;border-radius:50px;font-size:0.92rem;font-weight:600;background:#cd6903;color:#fff;transition:all 0.3s;border:none;font-family:'Inter',sans-serif;cursor:pointer}
.blog-cta .btn:hover{background:#b85d02;transform:translateY(-2px)}
.blog-footer{background:#111;color:#fff;padding:48px 24px 32px}
.blog-footer-inner{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px}
.blog-footer a{font-size:0.82rem;color:rgba(255,255,255,0.5);transition:color 0.3s}
.blog-footer a:hover{color:#cd6903}
@media(max-width:768px){
 .article-hero{min-height:50vh}
 .article-hero h1{font-size:1.8rem}
 .article-body{padding:40px 20px 60px}
 .article-meta{flex-wrap:wrap;gap:8px}
}
body.dark{background:#111 !important;color:#e0e0e0 !important}
body.dark h1,body.dark h2,body.dark h3{color:#fff !important}
body.dark p{color:rgba(255,255,255,0.6) !important}
body.dark section{background:#111 !important}
body.dark [style*="background:#efe9df"]{background:#1a1a1a !important}
body.dark [style*="background:#faf8f5"]{background:#1a1a1a !important}
body.dark .article-body blockquote{background:#1a1a1a;color:#cd6903}
body.dark .article-body .highlight-box{background:rgba(205,105,3,0.08);border-color:rgba(205,105,3,0.2)}
body.dark .article-body .checklist-box{background:#1a1a1a;border-color:rgba(255,255,255,0.08)}
body.dark .article-body .red-flag-box{background:rgba(220,38,38,0.06);border-color:rgba(220,38,38,0.2)}
body.dark .share-bar{border-color:rgba(255,255,255,0.08)}
body.dark .share-btn{background:#222;color:#fff}
body.dark .blog-footer{background:#0a0a0a !important}
 