/* MaintainPro — الطبقة الأساسية (مشتركة بين كل الصفحات) */
*,*::before,*::after { box-sizing:border-box;margin:0;padding:0 }
:root { --p:#1A5FA8;--pd:#0E3F75;--pl:#2B7FD4;--pp:#EBF3FB;--s:#1E7A5C;--sl:#27A77D;--sp:#E7F5F0;--a:#E86920;--ap:#FEF0E7;--w:#D4920A;--wp:#FEF7E7;--n50:#F7F8FA;--n100:#EFF1F5;--n200:#DDE1EA;--n400:#9BA3B2;--n600:#5B6478;--n800:#2C3345;--n900:#151C2C;--white:#fff;--r-sm:6px;--r-md:10px;--r-lg:16px;--r-xl:24px;--sh-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);--sh-md:0 4px 14px rgba(0,0,0,.08),0 2px 4px rgba(0,0,0,.04);--sh-lg:0 12px 40px rgba(0,0,0,.10),0 4px 8px rgba(0,0,0,.04);--fh:'Cairo',sans-serif;--fb:'IBM Plex Sans Arabic','Cairo',sans-serif;--pad:clamp(20px,6vw,80px) }
html { scroll-behavior:smooth }
body { font-family:var(--fb);background:var(--white);color:var(--n800);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased }
a { text-decoration:none;color:var(--p) }
ul { list-style:none }
.btn { display:inline-flex;align-items:center;gap:8px;font-family:var(--fh);font-weight:600;font-size:14px;border-radius:var(--r-md);padding:10px 22px;cursor:pointer;transition:all .2s;border:none }
.btn-p { background:var(--p);color:#fff }
.btn-wh { background:#25D366;color:#fff }
.btn-lg { padding:13px 28px;font-size:15px;border-radius:var(--r-lg) }
.btn-p:hover { background:var(--pd);transform:translateY(-1px) }
.navbar { position:sticky;top:0;z-index:200;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border-bottom:1px solid var(--n200);height:66px;padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;gap:20px }
.btn-sm { padding:7px 16px;font-size:13px }
.nav-logo { display:flex;align-items:center;gap:10px }
.btn-gh { background:transparent;color:var(--n600);border:1.5px solid var(--n200) }
.nav-logo-icon { width:38px;height:38px;background:var(--p);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;flex-shrink:0 }
.btn-op { background:transparent;color:var(--p);border:1.5px solid var(--p) }
.btn-gh:hover { border-color:var(--p);color:var(--p) }
.nav-logo-name { font-family:var(--fh);font-weight:800;font-size:17px;color:var(--n900) }
.btn-op:hover { background:var(--pp) }
.nav-logo-sub { font-size:10px;color:var(--n400) }
.nav-links { display:flex;gap:2px;flex:1;justify-content:center;list-style:none;margin:0;padding:0 }
.nav-links a { font-family:var(--fh);font-size:14px;font-weight:500;color:var(--n600);padding:6px 13px;border-radius:var(--r-sm);transition:all .18s }
.tag { display:inline-flex;align-items:center;gap:6px;font-family:var(--fh);font-size:11px;font-weight:700;padding:4px 14px;border-radius:30px;margin-bottom:14px }
.nav-links a:hover { color:var(--p);background:var(--pp) }
.nav-actions { display:flex;gap:10px;align-items:center }
.sec-title { font-family:var(--fh);font-size:32px;font-weight:900;color:var(--n900);line-height:1.3;margin-bottom:14px }
.breadcrumb { background:var(--n50);padding:12px var(--pad);border-bottom:1px solid var(--n200) }
.sec-title span { color:var(--p) }
.bc-inner { max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--n400) }
.sec-sub { font-size:16px;color:var(--n600);line-height:1.75;max-width:640px }
.bc-inner a { color:var(--n600) }
section { padding:80px var(--pad) }
.bc-inner i { font-size:10px }
.sec-inner { max-width:1400px;margin:0 auto }
.bc-inner span { color:var(--ac);font-weight:600 }
.anim { opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease }
.nav-links a:hover,.nav-links a.act { color:var(--p);background:var(--pp) }
.anim.in { opacity:1;transform:translateY(0) }
.art-h1 { font-family:var(--fh);font-size:36px;font-weight:900;color:var(--n900);line-height:1.3;margin-bottom:16px }
.bc-inner a:hover { color:var(--p) }
.meta { display:flex;gap:20px;font-size:13px;color:var(--n400);padding-bottom:20px;border-bottom:1px solid var(--n200);margin-bottom:28px;flex-wrap:wrap }
.meta span { display:flex;align-items:center;gap:6px }
.ab { background:var(--n900);color:#fff;border-radius:var(--r-xl);padding:24px 28px;margin-bottom:36px }
.ab-lbl { font-size:10px;font-weight:700;font-family:var(--fh);color:rgba(255,255,255,.5);margin-bottom:8px;display:flex;align-items:center;gap:6px }
.ab-txt { font-size:16px;line-height:1.8;color:rgba(255,255,255,.9) }
.ab-txt strong { color:#fff }
.page-hero { padding:72px var(--pad) 60px;background:linear-gradient(148deg,var(--secp),#f8f9fb,var(--n50)) }
.ph-h1 { font-family:var(--fh);font-size:40px;font-weight:900;color:var(--n900);line-height:1.25;margin-bottom:18px }
/* نقاط القوائم داخل محتوى المقالات فقط.
   القاعدة الأصلية كانت غير مقيّدة في بعض ملفات المدونة، ورفعها كما هي
   كان يضع نقاطًا في شريط التنقّل والتذييل على كل صفحات الموقع. */
.content ul li, .prose ul li, .art-body ul li, .entry-content ul li { list-style:disc }
.content ol li, .prose ol li, .art-body ol li, .entry-content ol li { list-style:decimal }
.info-box { padding:20px 24px;border-radius:var(--r-lg);margin:28px 0;display:flex;gap:14px;align-items:flex-start }
.info-box i { font-size:20px;flex-shrink:0;margin-top:2px }
.ph-inner { max-width:1400px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center }
.steps { display:flex;flex-direction:column;gap:10px;margin:20px 0 }
.step { display:flex;gap:12px;padding:12px 16px;background:var(--n50);border-radius:var(--r-lg);border:1px solid var(--n200) }
.stat-item { background:var(--pp);border:1px solid rgba(26,95,168,.1);border-radius:var(--r-lg);padding:16px;text-align:center }
.stat-lbl { font-size:12px;color:var(--n600) }
.faq-item { border:1px solid var(--n200);border-radius:var(--r-lg);overflow:hidden;margin-bottom:10px }
.faq-q { padding:16px 20px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-family:var(--fh);font-size:14px;font-weight:700;color:var(--n900);background:var(--white);transition:background .2s;gap:12px }
.faq-q:hover,.faq-item.open .faq-q { background:#f0f8ff;color:var(--ac) }
.faq-q-ico { width:28px;height:28px;border-radius:50%;background:var(--n100);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s }
.faq-item.open .faq-q-ico { background:var(--ac);transform:rotate(180deg) }
.faq-q-ico i { font-size:11px;color:var(--n600) }
.cta { background:var(--n900);border-radius:var(--r-xl);padding:28px;color:#fff;margin:40px 0;text-align:center }
.faq-item.open .faq-q-ico i { color:#fff }
.cta h3 { font-family:var(--fh);font-size:20px;font-weight:800;margin-bottom:8px }
.faq-a { display:none;padding:0 14px 11px;font-size:12px;color:var(--n600);line-height:1.8;background:#f0f8ff }
.cta p { font-size:14px;color:rgba(255,255,255,.8);margin-bottom:20px }
.cta-btns { display:flex;gap:14px;justify-content:center;flex-wrap:wrap }
.faq-a.show { display:block }
.sb-card { background:var(--white);border-radius:var(--r-xl);border:1px solid var(--n200);overflow:hidden;box-shadow:var(--sh-sm) }
.sb-head { padding:14px 18px;font-family:var(--fh);font-size:13px;font-weight:700;color:#fff;display:flex;align-items:center;gap:8px }
.sb-body { padding:16px }
.sec-cta { background:var(--secp);text-align:center;padding:80px var(--pad) }
.toc-item { display:flex;align-items:flex-start;gap:8px;padding:7px 10px;border-radius:var(--r-md);font-size:13px;color:var(--n600);cursor:pointer;transition:all .2s }
.cta-wrap { max-width:700px;margin:0 auto }
.cta-wrap h2 { font-family:var(--fh);font-size:36px;font-weight:900;color:var(--n900);margin-bottom:16px;line-height:1.3 }
.toc-item i { font-size:11px;flex-shrink:0;margin-top:3px }
.cta-wrap p { font-size:16px;color:var(--n600);line-height:1.75;margin-bottom:36px }
.footer { background:var(--n900);color:rgba(255,255,255,.7);padding:52px var(--pad) 28px }
.ft { max-width:900px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px }
.ft-links { display:flex;gap:16px }
.ft-links a { color:rgba(255,255,255,.35);text-decoration:none }
.ft-links a:hover { color:rgba(255,255,255,.8) }
.toc-item:hover,.toc-item.active { background:var(--pp);color:var(--p) }
.ft-top { display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px }
.ft-desc { font-size:13px;line-height:1.75;margin-top:12px;color:rgba(255,255,255,.45);max-width:280px }
.ft-bottom { border-top:1px solid rgba(255,255,255,.08);padding-top:20px;display:flex;justify-content:space-between;align-items:center;font-size:12px;flex-wrap:wrap;gap:12px }
.ft-contact { display:flex;flex-direction:column;gap:10px;margin-top:20px }
.ft-ci { display:flex;align-items:center;gap:10px;text-decoration:none;color:rgba(255,255,255,.65);font-size:13px;transition:color .2s }
.ft-ci:hover { color:#fff }
.ft-ci-ico { width:32px;height:32px;background:rgba(255,255,255,.1);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0 }
.ft-col h4 { font-family:var(--fh);font-size:13px;font-weight:700;color:rgba(255,255,255,.9);margin-bottom:14px }
.ft-col ul { display:flex;flex-direction:column;gap:8px }
.ft-col ul li a { font-size:12px;color:rgba(255,255,255,.45);transition:color .2s;display:block }
.ft-col ul li a:hover { color:#7ab8f5 }

@media(max-width:768px) {
  .navbar { padding:0 20px }
  .nav-links { display:none }
  .art-h1 { font-size:26px }
  .page-hero { padding:56px 20px 48px }
  .ph-h1 { font-size:28px }
  .ft-top { grid-template-columns:1fr }
  .sec-title { font-size:24px }
  .ft-bottom { flex-direction:column;text-align:center }
  .cta-btns { flex-direction:column;align-items:center }
}

@media(max-width:1100px) {
  .ft-top { grid-template-columns:1fr 1fr }
}

/* قواعد مرفوعة من أوراق الصفحات — يحتاجها القالب في كل صفحات هذا النوع. */
.btn-a { background:var(--a);color:#fff }
.btn-a:hover { background:#c75a18;transform:translateY(-1px) }
.btn-s { background:var(--s);color:#fff }
.btn-s:hover { background:#165c45;transform:translateY(-1px) }
.cta-wrap h2 span { color:var(--p) }
.cta-foot { margin-top:20px;font-size:12px;color:var(--n400) }
.cta-foot i { color:var(--s);margin-left:4px }

/* ── طباعة محتوى المقالات ──
   هذه القواعد كانت عنصرية (h2 · p · li · table …) في ٢٢ ملف مدونة،
   ورفعها كما هي كان يطبّقها على عناوين الأقسام والتذييل في كل الموقع.
   هنا مقيَّدة بحاويات المحتوى وحدها. */
.content h2, .prose h2, .art-body h2, .entry-content h2 { font-family:var(--fh);font-size:26px;font-weight:800;color:var(--n900);margin:44px 0 16px;border-right:4px solid var(--ac);padding-right:14px }
.content p, .prose p, .art-body p, .entry-content p { margin-bottom:13px;color:var(--n800);line-height:1.85 }
.content ul, .content ol, .prose ul, .prose ol, .art-body ul, .art-body ol, .entry-content ul, .entry-content ol { margin-bottom:14px;padding-right:18px }
.content li, .prose li, .art-body li, .entry-content li { margin-bottom:8px;line-height:1.75 }
.content strong, .prose strong, .art-body strong, .entry-content strong { color:var(--n900);font-weight:700 }
.content table, .prose table, .art-body table, .entry-content table { width:100%;border-collapse:collapse;margin:28px 0;font-size:14px;overflow:hidden;border-radius:var(--r-lg);box-shadow:0 1px 3px rgba(0,0,0,.06) }
.content table th, .prose table th, .art-body table th, .entry-content table th { background:var(--ac);color:#fff;padding:13px 16px;text-align:right;font-family:var(--fh);font-size:13px;font-weight:700 }
.content table td, .prose table td, .art-body table td, .entry-content table td { padding:12px 16px;border-bottom:1px solid var(--n100);font-size:14px;vertical-align:top }
.content table tr:nth-child(even) td, .prose table tr:nth-child(even) td, .art-body table tr:nth-child(even) td, .entry-content table tr:nth-child(even) td { background:var(--n50) }
.content table tr:last-child td, .prose table tr:last-child td, .art-body table tr:last-child td, .entry-content table tr:last-child td { border-bottom:none }