/* عناصر عامة تظهر في كل الصفحات */
.wa-float{position:fixed;bottom:22px;left:22px;z-index:9999;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(37,211,102,.45);transition:transform .25s, box-shadow .25s;animation:wa-pulse 2.6s infinite}
.wa-float:hover{transform:scale(1.08);box-shadow:0 12px 30px rgba(37,211,102,.6);color:#fff}
.wa-float svg{width:32px;height:32px}
@keyframes wa-pulse{0%{box-shadow:0 8px 24px rgba(37,211,102,.45),0 0 0 0 rgba(37,211,102,.5)}70%{box-shadow:0 8px 24px rgba(37,211,102,.45),0 0 0 16px rgba(37,211,102,0)}100%{box-shadow:0 8px 24px rgba(37,211,102,.45),0 0 0 0 rgba(37,211,102,0)}}
@media(max-width:600px){.wa-float{width:52px;height:52px;bottom:16px;left:16px}.wa-float svg{width:28px;height:28px}}

/* CTA داخل المقالة + مقالات ذات صلة (تظهر في كل مقالة) */
.art-cta{background:linear-gradient(135deg,#0B4F6C,#0d5e80);color:#fff;border-radius:20px;padding:44px 32px;text-align:center;margin:56px auto;max-width:1200px;position:relative;overflow:hidden}
.art-cta::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 82% 18%,rgba(43,182,115,.28),transparent 45%),radial-gradient(circle at 15% 85%,rgba(43,182,115,.16),transparent 40%);pointer-events:none}
.art-cta > *{position:relative;z-index:2}
.art-cta h2{color:#fff;font-family:'Cairo',sans-serif;font-size:clamp(22px,3.4vw,32px);margin-bottom:12px}
.art-cta p{color:rgba(255,255,255,.9);font-size:17px;margin-bottom:26px;max-width:620px;margin-inline:auto}
.art-cta .cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.art-cta .btn{display:inline-flex;align-items:center;gap:9px;font-family:'Cairo',sans-serif;font-weight:700;font-size:16px;padding:14px 28px;border-radius:50px;border:none;cursor:pointer;transition:.28s}
.art-cta .btn svg{width:19px;height:19px}
.art-cta .btn-primary{background:#2BB673;color:#fff}
.art-cta .btn-primary:hover{background:#1f9960;transform:translateY(-2px)}
.art-cta .btn-ghost{background:rgba(255,255,255,.12);color:#fff;border:2px solid rgba(255,255,255,.5)}
.art-cta .btn-ghost:hover{background:rgba(255,255,255,.2)}

.related{max-width:1200px;margin:0 auto 70px;padding:0 24px}
.related > h2{font-family:'Cairo',sans-serif;font-size:clamp(22px,3vw,30px);color:#0B4F6C;text-align:center;margin-bottom:32px}
.related .posts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.related .pcard{background:#fff;border:1px solid #DDECEF;border-radius:18px;overflow:hidden;transition:.3s;display:flex;flex-direction:column;text-decoration:none}
.related .pcard:hover{box-shadow:0 18px 50px rgba(11,79,108,.12);transform:translateY(-6px)}
.related .pcard-top{height:120px;display:flex;align-items:center;justify-content:center}
.related .pcard-top.c-intro{background:linear-gradient(150deg,#0B4F6C,#10678c)}
.related .pcard-top.c-dept{background:linear-gradient(150deg,#1f9960,#2BB673)}
.related .pcard-top.c-compare{background:linear-gradient(150deg,#0d5e80,#16a085)}
.related .pcard-top .ic{width:56px;height:56px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);border-radius:14px;display:flex;align-items:center;justify-content:center}
.related .pcard-top .ic svg{width:28px;height:28px;stroke:#fff}
.related .pcard-body{padding:20px;display:flex;flex-direction:column;flex:1}
.related .tag{font-family:'Cairo',sans-serif;font-weight:700;font-size:11.5px;padding:4px 11px;border-radius:50px;margin-bottom:11px;width:fit-content}
.related .tag.t-intro{background:#EAF7FB;color:#0B4F6C}
.related .tag.t-dept{background:#e3f7ed;color:#1f9960}
.related .tag.t-compare{background:#e0f2f1;color:#16806f}
.related .pcard h3{font-family:'Cairo',sans-serif;font-size:16.5px;line-height:1.45;color:#0B4F6C;margin-bottom:9px}
.related .pcard p{font-size:13.5px;line-height:1.6;color:#4A5568;margin-bottom:14px}
.related .pcard-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:1px solid #F3F8FA}
.related .date{font-size:12px;color:#8195a5;display:flex;align-items:center;gap:6px}
.related .date svg{width:13px;height:13px;stroke:#8195a5}
.related .arrow{width:28px;height:28px;border-radius:50%;background:#EAF7FB;display:flex;align-items:center;justify-content:center}
.related .arrow svg{width:14px;height:14px;stroke:#0B4F6C}
