/* ===== BLOG ARTICLES (site-wide, W3C recommendations) ===== */
/* Font: 16px base, line-height 1.7, max-width 75ch for readability */
.article-hero{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);color:#fff;padding:100px 0 70px;}
.article-hero-inner{max-width:820px;margin:0 auto;padding:0 24px;}
.article-breadcrumb{font-size:.85rem;margin-bottom:20px;opacity:.8;}
.article-breadcrumb a{color:#fff;text-decoration:underline;opacity:.8;}
.article-breadcrumb a:hover{opacity:1;}
.article-category{display:inline-block;background:rgba(255,255,255,.2);padding:4px 14px;border-radius:20px;font-size:.8rem;font-weight:600;margin-bottom:16px;}
.article-hero h1{color:#fff;font-size:clamp(1.8rem,3.5vw,2.8rem);line-height:1.2;margin-bottom:16px;}
.article-meta{font-size:.85rem;opacity:.75;display:flex;align-items:center;gap:8px;}
.article-meta i{margin-right:4px;}
.article-body-wrap{max-width:780px;margin:0 auto;padding:48px 24px 64px;}
.article-toc{background:#f8fafc;border:1px solid #e2e8f0;border-left:4px solid #6366f1;border-radius:12px;padding:28px;margin-bottom:40px;}
.article-toc h3{margin:0 0 14px;font-size:1rem;color:#0f172a;display:flex;align-items:center;gap:8px;}
.article-toc ol{margin:0;padding-left:20px;list-style:decimal;}
.article-toc li{margin-bottom:8px;font-size:.9rem;line-height:1.5;}
.article-toc a{color:#6366f1;text-decoration:none;}
.article-toc a:hover{text-decoration:underline;}
.article-content h2{margin:48px 0 16px;font-size:1.5rem;color:#0f172a;padding-bottom:10px;border-bottom:2px solid #e2e8f0;}
.article-content h2:first-of-type{margin-top:0;}
.article-content h3{margin:28px 0 12px;font-size:1.1rem;color:#334155;}
.article-content p{margin-bottom:20px;font-size:1rem;color:#475569;line-height:1.75;}
.article-content ul,.article-content ol{margin-bottom:20px;padding-left:24px;}
.article-content li{margin-bottom:10px;font-size:1rem;color:#475569;line-height:1.7;}
.article-content strong{color:#1e293b;}
.info-box{background:#eef2ff;border:1px solid #c7d2fe;border-left:4px solid #6366f1;border-radius:12px;padding:24px;margin:32px 0;font-size:.95rem;color:#4338ca;line-height:1.7;}
.info-box strong{display:block;margin-bottom:8px;font-size:1rem;}
.info-box.warning{background:#fef3c7;border-color:#fde68a;border-left-color:#f59e0b;color:#92400e;}
.info-box.warning strong{color:#92400e;}
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:28px 0;border-radius:12px;border:1px solid #e2e8f0;}
table{width:100%;border-collapse:collapse;font-size:.9rem;}
th{background:#6366f1;color:#fff;padding:14px 18px;text-align:left;font-weight:600;}
td{padding:12px 18px;border-bottom:1px solid #e2e8f0;color:#475569;}
tr:nth-child(even){background:#f8fafc;}
.article-cta{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);border-radius:16px;padding:48px;text-align:center;color:#fff;margin:48px 0;}
.article-cta h3{color:#fff;margin-bottom:12px;font-size:1.3rem;}
.article-cta p{color:#fff;opacity:.9;margin-bottom:24px;font-size:1rem;line-height:1.6;max-width:540px;margin-left:auto;margin-right:auto;}
.related-articles{padding:60px 0;background:#f8fafc;}
.related-articles .container{max-width:820px;}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:24px;margin-top:28px;}
.related-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 1px 3px rgb(0 0 0/.08);}
.related-card a{color:#1e293b;text-decoration:none;font-weight:600;font-size:.95rem;display:block;margin-bottom:8px;line-height:1.4;}
.related-card a:hover{color:#6366f1;}
.related-card p{color:#64748b;font-size:.85rem;margin:0;line-height:1.5;}
.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0;}
@media(max-width:640px){.feature-list{grid-template-columns:1fr;}}
.feature-item{background:#f8fafc;border-radius:12px;padding:20px;border:1px solid #e2e8f0;}
.feature-item h3{margin:0 0 10px;font-size:.95rem;color:#0f172a;}
.feature-item p{margin:0;font-size:.88rem;color:#64748b;line-height:1.6;}

/* Article-specific hero colors (override .article-hero background) */
.article-hero.green{background:linear-gradient(135deg,#059669 0%,#10b981 100%);}
.article-hero.amber{background:linear-gradient(135deg,#d97706 0%,#f59e0b 100%);}
.article-hero.blue{background:linear-gradient(135deg,#1d4ed8 0%,#3b82f6 100%);}
.article-toc.green{border-left-color:#059669;}
.article-toc.amber{border-left-color:#d97706;}
.article-toc.blue{border-left-color:#1d4ed8;}
.article-cta.green{background:linear-gradient(135deg,#059669 0%,#10b981 100%);}
.article-cta.amber{background:linear-gradient(135deg,#d97706 0%,#f59e0b 100%);}
.article-cta.blue{background:linear-gradient(135deg,#1d4ed8 0%,#3b82f6 100%);}