/* ══ المحتوى المرندر من السيرفر ══
 *
 * الكتلة دي موجودة عشان الزواحف اللي مابتنفّذش JavaScript (GPTBot،
 * ClaudeBot، PerplexityBot) تلاقي محتوى حقيقي بدل صفحة فاضية.
 *
 * المشكلة اللي بتحلها الأنماط دي: لما الجافاسكريبت يتأخر أو يتمنع
 * (حماية خصوصية في المتصفح، شبكة بطيئة)، الكتلة كانت بتظهر للمستخدم
 * نص خام بلا تنسيق — شكلها كإن الموقع مكسور.
 *
 * الحل: مخفية بصريًا بس **مقروءة للزواحف وقارئات الشاشة** (مش display:none
 * اللي بتشيلها من شجرة الوصول). والتطبيق بيستبدلها أول ما يشتغل.
 *
 * ولو الجافاسكريبت متوقف خالص، <noscript> بيرجّعها ظاهرة ومنسّقة —
 * أحسن من صفحة بيضا.
 */
.seo-ssr{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* من غير جافاسكريبت: اعرضها بشكل محترم بدل ما الصفحة تبقى فاضية */
.no-js .seo-ssr{
  position:static;width:auto;height:auto;margin:0;overflow:visible;
  clip:auto;clip-path:none;white-space:normal;
  max-width:1120px;margin-inline:auto;padding:24px 16px 40px;line-height:1.8;
}
.no-js .seo-ssr h1{font-size:24px;font-weight:800;margin:0 0 12px}
.no-js .seo-ssr h2{font-size:18px;font-weight:800;margin:28px 0 10px}
.no-js .seo-ssr p{margin:0 0 14px;color:#444d5a}
.no-js .seo-ssr ul{margin:0 0 18px;padding-inline-start:20px}
.no-js .seo-ssr li{margin-bottom:7px}
.no-js .seo-ssr a{color:#e0121a;text-decoration:none;font-weight:600}
.no-js .seo-ssr a:hover{text-decoration:underline}
.no-js .seo-ssr dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 18px}
.no-js .seo-ssr dt{font-weight:700;color:#111827}
.no-js .seo-ssr dd{margin:0;color:#444d5a}
.no-js .seo-ssr img{max-width:min(100%,420px);height:auto;border-radius:12px;margin:0 0 16px}