/* مقالات — ترويسة الرئيسية (نمط «مقالات» الفاتح). المتغيرات: --c لون الدولة و--c1/--c2/--c3 درجات فاتحة منه و--cd درجة أعمق. */
.mqh-hero{position:relative;overflow:hidden}
.mqh-bg{position:absolute;inset:0;pointer-events:none}
.mqh-bg i{position:absolute;width:300px;height:300px;background-size:contain;background-repeat:no-repeat;opacity:.09}
.mqh-bg i:nth-child(1){inset-inline-start:-40px;top:-50px;transform:rotate(-10deg)}
.mqh-bg i:nth-child(2){inset-inline-start:150px;bottom:-110px;width:230px;height:230px;transform:rotate(8deg)}
.mqh-bg i:nth-child(3){inset-inline-end:-30px;top:-40px;transform:rotate(9deg)}
.mqh-bg i:nth-child(4){inset-inline-end:170px;bottom:-100px;width:230px;height:230px;transform:rotate(-7deg)}
@media(max-width:900px){.mqh-bg i{width:190px;height:190px;opacity:.07}.mqh-bg i:nth-child(2),.mqh-bg i:nth-child(4){display:none}}
.mqh-hero .mqh-w{position:relative}
.mqh-w{width:100%;max-width:1176px;margin:0 auto;padding:0 20px;box-sizing:border-box;text-align:center}
.mqh-hero{background:
 repeating-linear-gradient(180deg,transparent 0,transparent 35px,rgba(255,255,255,.045) 35px,rgba(255,255,255,.045) 36px),
 linear-gradient(160deg,var(--cd) 0%,var(--c) 100%);
 padding:52px 0 60px;color:#fff}
.mqh-date{display:flex;align-items:center;justify-content:center;gap:16px;margin:0 auto 22px;max-width:560px;font-size:14.5px;font-weight:600;color:rgba(255,255,255,.78);letter-spacing:.2px}
.mqh-date i{flex:1;height:0;border-top:1px solid rgba(255,255,255,.35);position:relative}
.mqh-date i::after{content:"";position:absolute;left:0;right:0;top:3px;border-top:1px solid rgba(255,255,255,.18)}
.mqh-hero h1{margin:0 auto 16px;max-width:880px;font-family:"MqKufi","Noto Kufi Arabic",sans-serif;font-weight:900;font-size:44px;line-height:1.5;color:#fff;text-wrap:balance}
.mqh-hero h1 mark{background:linear-gradient(180deg,transparent 58%,rgba(255,255,255,.22) 58%,rgba(255,255,255,.22) 92%,transparent 92%);color:#fff;padding:0 6px;border-radius:2px}
.mqh-d{margin:0 auto 28px;max-width:700px;font-size:18px;line-height:1.95;color:rgba(255,255,255,.86);text-wrap:balance}
.mqh-sq{display:flex;align-items:center;gap:8px;max-width:700px;margin:0 auto;padding:8px;background:#fff;border:0;border-radius:20px;box-shadow:0 18px 40px -18px rgba(0,0,0,.5)}
.mqh-sq:focus-within{box-shadow:0 0 0 3px rgba(255,255,255,.35),0 18px 40px -18px rgba(0,0,0,.5)}
.mqh-sq input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:17px;padding:12px 18px;color:#14201A;box-shadow:none}
.mqh-sq button{display:inline-flex;align-items:center;gap:9px;border:0;cursor:pointer;background:var(--cd);color:#fff;font:inherit;font-weight:700;font-size:16px;padding:14px 30px;border-radius:14px;transition:background .15s}
.mqh-sq button:hover{background:#000}
.mqh-ex{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;max-width:820px;margin:22px auto 0}
.mqh-ex b{font-size:13.5px;font-weight:700;color:rgba(255,255,255,.75);margin-inline-start:4px}
.mqh-ex a{padding:7px 15px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);border-radius:999px;font-size:14px;font-weight:600;color:#fff;text-decoration:none;transition:border-color .15s,background .15s}
.mqh-ex a:hover{background:#fff;color:var(--cd)}
@media(max-width:700px){
.mqh-hero{padding:30px 0 40px}.mqh-date{font-size:12.5px;gap:10px;margin-bottom:16px}
.mqh-hero h1{font-size:28px}.mqh-d{font-size:15.5px;margin-bottom:22px}
.mqh-sq{padding:6px;border-radius:16px}.mqh-sq input{font-size:15px;padding:10px 12px}.mqh-sq button{padding:12px 18px}.mqh-sq button span{display:none}
.mqh-ex{margin-top:16px;gap:7px}.mqh-ex a{padding:6px 12px;font-size:13px}
}

/* خلفية النقاط الثابتة: نقاط بيضاء شفافة تتلاشى عند الأطراف */
.mqh-dots{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(255,255,255,.22) 1.6px,transparent 1.9px);background-size:30px 30px;-webkit-mask-image:radial-gradient(ellipse 80% 90% at 50% 45%,#000 25%,transparent 80%);mask-image:radial-gradient(ellipse 80% 90% at 50% 45%,#000 25%,transparent 80%)}

/* خلفية «العمق»: توهج علوي وتعتيم سفلي وشرائح مائلة بميل الهوية ونقاط خفيفة (شفافة فتناسب كل ألوان الدول) */
.mqh-depth{position:absolute;inset:0;overflow:hidden;pointer-events:none;background:
 radial-gradient(ellipse 70% 80% at 50% -8%,rgba(255,255,255,.24),transparent 60%),
 radial-gradient(ellipse 95% 70% at 50% 118%,rgba(0,0,0,.5),transparent 70%)}
.mqh-depth::before{content:"";position:absolute;inset:0 -25%;transform:skewX(-24deg);background:linear-gradient(90deg,transparent 0 6%,rgba(255,255,255,.06) 6% 19%,transparent 19% 27%,rgba(0,0,0,.13) 27% 42%,transparent 42% 57%,rgba(255,255,255,.05) 57% 64%,transparent 64% 79%,rgba(255,255,255,.08) 79% 90%,transparent 90%)}
.mqh-depth::after{content:"";position:absolute;inset:0;opacity:.4;background-image:radial-gradient(circle,rgba(255,255,255,.22) 1.6px,transparent 1.9px);background-size:30px 30px;-webkit-mask-image:radial-gradient(ellipse 80% 90% at 50% 45%,#000 25%,transparent 80%);mask-image:radial-gradient(ellipse 80% 90% at 50% 45%,#000 25%,transparent 80%)}
@media(max-width:700px){.mqh-depth::before{inset:0 -60%}}

/* خلفية «التوهج»: ضوء علوي وتعتيم سفلي ونقاط خفيفة، شفافة فتناسب كل ألوان الدول */
.mqh-glow{position:absolute;inset:0;pointer-events:none;background:
 radial-gradient(ellipse 75% 85% at 50% -5%,rgba(255,255,255,.26),transparent 62%),
 radial-gradient(ellipse 90% 70% at 50% 115%,rgba(0,0,0,.45),transparent 70%)}
.mqh-glow::after{content:"";position:absolute;inset:0;opacity:.55;background-image:radial-gradient(circle,rgba(255,255,255,.22) 1.6px,transparent 1.9px);background-size:30px 30px;-webkit-mask-image:radial-gradient(ellipse 80% 90% at 50% 45%,#000 25%,transparent 80%);mask-image:radial-gradient(ellipse 80% 90% at 50% 45%,#000 25%,transparent 80%)}

/* خلفية «لون واحد»: لون الدولة الصريح بلا تدرّج ولا خطوط ولا نقاط */
.mqh-hero.mqh-flat{background:var(--c)}

/* خلفية «النسيج الدقيق»: لون الدولة مع نسيج شبكي خافت وتعتيم خفيف عند الأطراف، بلا عناصر إضافية */
.mqh-hero.mqh-tex{background-color:var(--c);background-image:
 repeating-linear-gradient(45deg,rgba(255,255,255,.04) 0 1px,transparent 1px 7px),
 repeating-linear-gradient(-45deg,rgba(255,255,255,.04) 0 1px,transparent 1px 7px),
 radial-gradient(ellipse 90% 120% at 50% 40%,transparent 38%,rgba(0,0,0,.24) 100%)}
