/* Blog Styles - Ealison Maroc */
.blog-hero{padding:100px 0 60px;text-align:center}
.blog-hero h1{font-size:2.8rem;margin-bottom:16px}
.blog-hero p{color:var(--text-secondary);font-size:1.15rem;max-width:600px;margin:0 auto}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:32px;padding:40px 0 80px}
.blog-card{background:var(--card-bg,rgba(255,255,255,0.03));border:1px solid rgba(255,255,255,0.06);border-radius:16px;overflow:hidden;transition:transform .3s,border-color .3s}
.blog-card:hover{transform:translateY(-4px);border-color:var(--primary,#0A84FF)}
.blog-card-img{height:200px;background:linear-gradient(135deg,rgba(10,132,255,.15),rgba(10,132,255,.05));display:flex;align-items:center;justify-content:center;font-size:3rem;position:relative;overflow:hidden}
.blog-card-img::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,var(--bg-primary,#070B14))}
.blog-card-body{padding:24px}
.blog-card-tag{display:inline-block;font-size:.75rem;font-weight:600;color:var(--primary,#0A84FF);background:rgba(10,132,255,.1);padding:4px 12px;border-radius:20px;margin-bottom:12px;text-transform:uppercase;letter-spacing:.5px}
.blog-card-title{font-size:1.2rem;font-weight:700;margin-bottom:10px;line-height:1.4}
.blog-card-title a{color:var(--text-primary,#fff);text-decoration:none}
.blog-card-title a:hover{color:var(--primary,#0A84FF)}
.blog-card-excerpt{color:var(--text-secondary,#8892a4);font-size:.92rem;line-height:1.6;margin-bottom:16px}
.blog-card-meta{display:flex;justify-content:space-between;align-items:center;font-size:.82rem;color:var(--text-tertiary,#5a6272)}
.blog-card-meta time{opacity:.7}
.blog-card-link{color:var(--primary,#0A84FF);font-weight:600;text-decoration:none;font-size:.85rem}
.blog-card-link:hover{text-decoration:underline}

/* Article page */
.article-hero{padding:100px 0 40px;text-align:center;max-width:800px;margin:0 auto}
.article-hero .tag{display:inline-block;font-size:.8rem;font-weight:600;color:var(--primary,#0A84FF);background:rgba(10,132,255,.1);padding:6px 16px;border-radius:20px;margin-bottom:20px;text-transform:uppercase}
.article-hero h1{font-size:2.4rem;line-height:1.3;margin-bottom:16px}
.article-hero .meta{color:var(--text-secondary,#8892a4);font-size:.92rem}
.article-content{max-width:760px;margin:0 auto;padding:40px 20px 80px;line-height:1.85;color:var(--text-secondary,#c0c8d8);font-size:1.05rem}
.article-content h2{color:var(--text-primary,#fff);font-size:1.6rem;margin:48px 0 16px;padding-top:24px;border-top:1px solid rgba(255,255,255,0.06)}
.article-content h3{color:var(--text-primary,#fff);font-size:1.25rem;margin:32px 0 12px}
.article-content p{margin-bottom:20px}
.article-content ul,.article-content ol{margin:16px 0 24px 24px}
.article-content li{margin-bottom:10px}
.article-content strong{color:var(--text-primary,#fff)}
.article-content blockquote{border-left:3px solid var(--primary,#0A84FF);padding:16px 24px;margin:24px 0;background:rgba(10,132,255,.05);border-radius:0 12px 12px 0;font-style:italic}
.article-content a{color:var(--primary,#0A84FF);text-decoration:underline}
.article-content .callout{background:rgba(10,132,255,.08);border:1px solid rgba(10,132,255,.2);border-radius:12px;padding:20px 24px;margin:24px 0}
.article-content .callout-title{font-weight:700;color:var(--primary,#0A84FF);margin-bottom:8px;font-size:.95rem}
.article-cta{background:linear-gradient(135deg,rgba(10,132,255,.1),rgba(10,132,255,.03));border:1px solid rgba(10,132,255,.15);border-radius:16px;padding:40px;text-align:center;margin:48px 0}
.article-cta h3{font-size:1.4rem;margin-bottom:12px;color:var(--text-primary,#fff)}
.article-cta p{color:var(--text-secondary);margin-bottom:20px}
.article-cta .btn{display:inline-block;background:var(--primary,#0A84FF);color:#fff;padding:12px 28px;border-radius:8px;text-decoration:none;font-weight:600;transition:opacity .3s}
.article-cta .btn:hover{opacity:.85}
.breadcrumb{padding:80px 0 0;font-size:.85rem;color:var(--text-tertiary,#5a6272)}
.breadcrumb a{color:var(--primary,#0A84FF);text-decoration:none}
.related-articles{padding:40px 0 80px;border-top:1px solid rgba(255,255,255,0.06);margin-top:40px}
.related-articles h2{text-align:center;margin-bottom:32px;font-size:1.6rem}
