/* ======================================================================
   سطح الوثيقة — الطبقة المشتركة بين صفحات الأرقام (التقرير، التبرّع)
   ----------------------------------------------------------------------
   لماذا ملفٌ ثالث بين ‎public-rq.css‎ وملفّ الصفحة:

   · ‎public-rq.css‎ يُحمَّل على كل صفحات الزائر، وفيه اختبارٌ يحرس ألّا
     تُحمَّل صفحةٌ ما لا تستعمل. فوضع أدوات الوثيقة فيه يُثقل الصفحة
     الرئيسية وصفحة التواصل بما لا تستعملانه.
   · ونسخُ هذه القطع في كل ملف صفحة يجعل الشارة الواحدة تُعرَّف مرتين،
     فتنحرف واحدةٌ عن أختها عند أول تعديل — وهو بالضبط ما جعل صفحة
     التقرير وصفحة التبرّع تبدوان من نظامين مختلفين قبل هذا العمل.

   فما يستعمله أكثر من صفحةٍ واحدة يسكن هنا، وما تفرّدت به صفحة يبقى في
   ملفها. القواعد الحاكمة موروثة من ‎public-rq.css‎ ولا تُكسر:

   · الحالة النهائية هي الافتراضية؛ الإخفاء لا يقع إلا تحت ‎html.rq-anim‎،
     فلو سقط السكربت بقيت الصفحة وثيقةً مكتملة مقروءة.
   · الذهب ‎--rq-gold‎ نصاً على الداكن فقط؛ على الورق ‎--rq-gold-ink‎ وحده.
   · خصائص منطقية (inline-start/end) — لا left/right إلا لزاوية تدرّج.
   · الرقم هو البطل: في كل قسمٍ رقمٌ أكبر من جيرانه، لا شبكةٌ متساوية
     تُسطِّح الأهمية.
   ====================================================================== */

.rq-doc {
  /* ارتفاع الشريط العلوي الفعلي — الشريط الفرعي يلتصق تحته لا فوقه،
     وهامش القفز إلى الأقسام يُحسب منهما معاً وإلا اختفى عنوان القسم
     تحت الشريطين عند الضغط على فهرسه. */
  --doc-top:  73px;
  --doc-nav2: 54px;
  --doc-stick: calc(var(--doc-top) + var(--doc-nav2));

  --doc-r:    14px;
  --doc-r-sm: 10px;

  /* درجات الحالة على الورق — مقيسة على ‎--rq-paper/#FFF‎ لا مفترضة */
  --doc-ok:   #0A5B53;   /* 7٫97:1 */
  --doc-warn: #8A6A16;   /* ذهب الورق — 4٫57:1 */
  --doc-bad:  #B3261E;   /* 5٫9:1 */
  --doc-ok-wash:   #EFF7F5;
  --doc-warn-wash: #FBF5E6;
  --doc-bad-wash:  #FCF2F1;

  --doc-grid: clamp(1rem, 2.2vw, 1.5rem);
}

@media (max-width: 991.98px) {
  .rq-doc { --doc-top: 61px; --doc-nav2: 50px; }
}

/* ======================================================================
   ١ · العهد — ما تشترك فيه ترويسات هذه الصفحات
   ----------------------------------------------------------------------
   تُبنى على ‎.rq-hero‎ بالاسم عمداً: ‎public-rq.js‎ يمنحها ‎rq-in‎ عند
   الإقلاع، فترث تلاوة الأطروحة وسطورها الذهبية بلا سطر جافاسكربت واحد
   خاص بالصفحة. المتجاوَز هنا هو القياس فقط — شاشة كاملة لعهد الصفحة
   الرئيسية، وترويسةٌ محسوبة لصفحةٍ يبدأ محتواها فوراً بعدها.
   ====================================================================== */

.rq-hero--doc {
  min-height: 0;
  padding-block: clamp(2.25rem, 5svh, 3.75rem) clamp(2.5rem, 5svh, 4rem);
  background-image:
    radial-gradient(560px at 18% 30%, rgba(233, 196, 106, .11), transparent 70%),
    repeating-linear-gradient(45deg,  rgba(213, 228, 223, .03) 0 1px, transparent 1px 96px),
    repeating-linear-gradient(-45deg, rgba(213, 228, 223, .03) 0 1px, transparent 1px 96px);
}
.rq-hero--doc .rq-thesis { margin-top: 1rem; }
.rq-hero--doc .rq-thesis span { font-size: clamp(1.5rem, 3vw, 2.3rem); }
.rq-hero--doc .rq-thesis .w { font-size: clamp(2.6rem, 5.6vw, 4.6rem); }

.doc-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
}

/* الشارة فوق العنوان */
.doc-badge {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .34rem .85rem;
  border: 1px solid rgba(233, 196, 106, .34);
  border-radius: 999px;
  background: rgba(233, 196, 106, .07);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--rq-gold);
}
.doc-badge .sep { opacity: .55; }
.doc-badge .yr { font-variant-numeric: tabular-nums; }

.doc-hero-lede {
  max-inline-size: 46rem;
  margin: 1.1rem 0 0;
  font-size: clamp(1rem, 1.5vw, 1.12rem);
  line-height: 2;
  color: var(--rq-onvoid-2);
}
/* تعليقٌ هامشي كما في المخطوطات — شعرة ذهبية تسبقه */
.doc-hero-note {
  max-inline-size: 44rem;
  margin: .9rem 0 0;
  padding-inline-start: 1rem;
  border-inline-start: 2px solid var(--rq-gold-2);
  font-size: 13.5px;
  line-height: 1.95;
  color: var(--rq-onvoid-3);
}

/* المؤشرات الثلاثة داخل العهد */
.doc-hero-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 1.6rem;
  padding-top: 1.3rem;
  border-top: 1px solid var(--rq-hair-gold);
}
.doc-hs {
  padding-inline: .75rem;
  border-inline-start: 1px solid var(--rq-hair-gold);
  text-align: center;
}
.doc-hs:first-child { border-inline-start: 0; }
.doc-hs b {
  display: block;
  font-size: clamp(1.5rem, 3.2vw, 2.1rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--rq-onvoid);
  font-variant-numeric: tabular-nums lining-nums;
}
.doc-hs b .u { font-size: .55em; color: var(--rq-gold); margin-inline-start: .1em; }
.doc-hs span {
  display: block;
  margin-top: .3rem;
  font-size: 12px;
  line-height: 1.65;
  color: var(--rq-onvoid-3);
}

/* ── أدوات الترويسة: قائمة وزرّ على سطح القبو ── */
.doc-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .7rem;
  margin-top: 1.7rem;
}
.doc-tools label { font-size: 12.5px; color: var(--rq-onvoid-3); }
.doc-select {
  height: 42px;
  padding-inline: .9rem 2.2rem;
  border: 1px solid rgba(233, 196, 106, .34);
  border-radius: var(--doc-r-sm);
  background: rgba(255, 255, 255, .05);
  color: var(--rq-onvoid);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  /* السهم مرسومٌ بالخلفية لا بحرف — يتبع جهة القراءة بلا حساب */
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--rq-gold) 50%),
    linear-gradient(135deg, var(--rq-gold) 50%, transparent 50%);
  background-position: left 1rem top 50%, left .65rem top 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
.doc-select option { background: var(--rq-void); color: var(--rq-onvoid); }
.doc-select:focus-visible { outline: 2px solid var(--rq-focus-onvoid); outline-offset: 2px; }

.doc-btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  height: 42px;
  padding-inline: 1.1rem;
  border: 1px solid rgba(213, 228, 223, .3);
  border-radius: var(--doc-r-sm);
  background: transparent;
  font: inherit;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--rq-onvoid-2);
  text-decoration: none;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.doc-btn:hover { background: rgba(255, 255, 255, .07); border-color: rgba(213, 228, 223, .5); color: var(--rq-onvoid); }
.doc-btn:focus-visible { outline: 2px solid var(--rq-focus-onvoid); outline-offset: 2px; }
.doc-btn--gold {
  border-color: rgba(233, 196, 106, .5);
  background: var(--rq-gold);
  color: var(--rq-void);
}
.doc-btn--gold:hover { background: #F0D084; border-color: #F0D084; color: var(--rq-void); }

/* حبّات السنوات — بديل القائمة بلا جافاسكربت، وتتكرّر في خاتمة التقرير */
.doc-pills { display: flex; flex-wrap: wrap; gap: .4rem; }
.doc-pills a {
  padding: .3rem .75rem;
  border: 1px solid rgba(233, 196, 106, .3);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--rq-gold);
  text-decoration: none;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.doc-pills a:hover { background: rgba(233, 196, 106, .1); border-color: var(--rq-gold); }
.doc-pills a.is-on { background: var(--rq-gold); border-color: var(--rq-gold); color: var(--rq-void); }
.doc-pills a:focus-visible { outline: 2px solid var(--rq-focus-onvoid); outline-offset: 2px; }

/* ======================================================================
   ٢ · هيكل القسم — لكل قسمٍ شخصيته، وكلها من نظامٍ واحد
   ====================================================================== */

.doc-sec {
  /* الهامش يعوّض الشريطين اللاصقين عند القفز من فهرس أو رابطٍ خارجي */
  scroll-margin-top: calc(var(--doc-stick) + 14px);
  /*
   * أضيق من ‎--rq-gap‎ (٨rem) عمداً: إيقاع الصفحة الرئيسية بُني على خمسة
   * أقسامٍ يفصلها بياضٌ واسع، وهنا ثمانيةٌ كلٌّ منها كثيف. البياض نفسه
   * على ثمانيةٍ يصير مسافةً ميّتة تُطيل التمرير بلا أن تُنظّم، والفصل
   * هنا يقوم على تبدّل السطح (لوحٌ أبيض، شبكةٌ عارية، قبو) لا على
   * مقدار الفراغ وحده.
   */
  margin-top: clamp(3rem, 6vw, 5.5rem);
}

.doc-head { margin-bottom: var(--rq-gap-in); }
.doc-head-row { display: flex; align-items: baseline; gap: 1rem; }
.doc-head h2,
.doc-head h3 {
  flex: 0 1 auto;
  min-width: 0;
  margin: .5rem 0 0;
  font-weight: 700;
  line-height: 1.45;
  color: var(--rq-ink);
}
.doc-head h2 { font-size: var(--fs-h2); }
.doc-head h3 { font-size: 1.05rem; }
/* عنوانٌ طويل يلتفّ فيبتلع الشعرة — الشعرة زخرفة، والعنوان هو الحقّ */
.doc-head-row .rule {
  flex: 1 1 auto;
  min-width: 1.5rem;
  height: 1px;
  background: var(--rq-line);
  transform-origin: right center;
}
.doc-head .lede {
  max-inline-size: 62ch;
  margin: .8rem 0 0;
  font-size: 14.5px;
  line-height: 2;
  color: var(--rq-ink-2);
}
.doc-head .meta { flex: 0 0 auto; font-size: 12px; color: var(--rq-mute); }

/* اللوح الأبيض — سطح كل الأقسام الرقمية */
.doc-plate {
  background: var(--rq-card);
  border: 1px solid var(--rq-line);
  border-radius: var(--rq-r-lg);
  box-shadow: 0 20px 48px -34px rgba(6, 32, 30, .35);
}
.doc-plate + .doc-plate { margin-top: var(--doc-grid); }
.doc-pad { padding: clamp(1.15rem, 2.6vw, 1.75rem); }

/* حاشية تحت اللوح — التفسير الذي لا يجوز حذفه ولا يجوز أن يتصدّر */
.doc-foot {
  margin: 1rem 0 0;
  font-size: 12.5px;
  line-height: 2;
  color: var(--rq-mute);
}
.doc-foot a { color: var(--rq-teal-d); text-decoration: underline; text-underline-offset: 3px; }

/* الاقتباس — يُقرأ قبل القائمة، بحجمٍ يليق بدعوى الصفحة */
.doc-quote {
  position: relative;
  margin: 0 0 var(--rq-gap-in);
  padding-inline-start: 2.4rem;
  font-size: clamp(1.05rem, 1.9vw, 1.28rem);
  font-weight: 500;
  line-height: 2.05;
  color: var(--rq-ink);
  max-inline-size: 60ch;
}
/* المزدوجة العربية نفسها المستعملة في نصّ المنصة كلها — لا أيقونة
   لاتينية مستعارة: الحرف يُرسم بخطّ الصفحة فيطابق وزنها */
.doc-quote::before {
  content: "«";
  position: absolute;
  inset-inline-start: 0;
  top: -.12em;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1;
  color: var(--rq-gold-ink);
  opacity: .5;
}

/* ======================================================================
   ٣ · الإشارات والشارات — أربع حالات لا أكثر
   ====================================================================== */

.doc-flag {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  padding: .85rem 1rem;
  border-radius: var(--doc-r-sm);
  border: 1px solid var(--rq-line);
  border-inline-start: 3px solid var(--rq-mute);
  background: var(--rq-card-2);
  font-size: 13.5px;
  line-height: 1.95;
  color: var(--rq-ink-2);
}
.doc-flag + .doc-flag { margin-top: .6rem; }
.doc-flag > i { flex: 0 0 auto; font-size: 17px; line-height: 1.5; color: var(--rq-mute); }
.doc-flag b { color: var(--rq-ink); }
.doc-flag a { color: var(--rq-teal-d); text-decoration: underline; text-underline-offset: 3px; }
.doc-flag--bad  { border-inline-start-color: var(--doc-bad);  background: var(--doc-bad-wash);  border-color: #F0D5D2; }
.doc-flag--bad > i  { color: var(--doc-bad); }
.doc-flag--warn { border-inline-start-color: var(--doc-warn); background: var(--doc-warn-wash); border-color: #EADFC2; }
.doc-flag--warn > i { color: var(--doc-warn); }
.doc-flag--ok   { border-inline-start-color: var(--doc-ok);   background: var(--doc-ok-wash);   border-color: #CFE4E0; }
.doc-flag--ok > i   { color: var(--doc-ok); }

.doc-chip {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .18rem .6rem;
  border-radius: 999px;
  border: 1px solid;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.7;
  white-space: nowrap;
}
.doc-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.doc-chip--ok   { color: var(--doc-ok);   background: var(--doc-ok-wash);   border-color: #CFE4E0; }
.doc-chip--warn { color: var(--doc-warn); background: var(--doc-warn-wash); border-color: #EADFC2; }
.doc-chip--bad  { color: var(--doc-bad);  background: var(--doc-bad-wash);  border-color: #F0D5D2; }
.doc-chip--mute { color: var(--rq-mute);  background: var(--rq-card-2);     border-color: var(--rq-line); }

/* الأرقام — مصفوفةٌ عمودياً في كل الجداول والبطاقات */
.doc-n { font-variant-numeric: tabular-nums lining-nums; }
/* مبلغٌ برمز عملته: ‎isolate‎ يمنع الرمز من القفز إلى الطرف الآخر في RTL */
.doc-amt {
  display: inline-block;
  direction: ltr;
  unicode-bidi: isolate;
  font-variant-numeric: tabular-nums lining-nums;
  white-space: nowrap;
}
.doc-amt--neg { color: var(--doc-bad); font-weight: 700; }
/* مبلغٌ ليس محصَّلاً: المتعهَّد به والعيني التقديري — يُقرآن ولا يُقرآن كنقد */
.doc-amt--mute { color: var(--rq-mute); font-weight: 600; }
/* ‎.doc-kv b‎ يفرض ‎--rq-ink‎ فيبتلع الكتم أعلاه — والخصوصية هنا تُطابقه */
.doc-kv b.doc-amt--mute { color: var(--rq-mute); font-weight: 600; }

/* سطر مفتاح/قيمة */
.doc-kv {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  font-size: 13px;
  color: var(--rq-ink-2);
}
.doc-kv > span:first-child { color: var(--rq-mute); }
.doc-kv b { font-weight: 700; color: var(--rq-ink); }

.doc-empty {
  padding: 2.25rem 1rem;
  text-align: center;
  font-size: 13.5px;
  line-height: 2;
  color: var(--rq-mute);
}
.doc-empty i { display: block; margin-bottom: .5rem; font-size: 26px; color: var(--rq-line); }

/* ======================================================================
   ٤ · شبكة الأرقام — خلايا مفصولة بشعرة لا بطاقاتٌ متكرّرة
   ----------------------------------------------------------------------
   البطاقات المتكرّرة تُنتج «شبكة صناديق»؛ الشعرة تُنتج جدول حساباتٍ
   نظيفاً — وهذه صفحات حسابات.
   ====================================================================== */

.doc-stats { display: grid; grid-template-columns: repeat(4, 1fr); }
.doc-stat {
  position: relative;
  padding: clamp(1.1rem, 2.2vw, 1.5rem);
  border-inline-start: 1px solid var(--rq-line-2);
  border-top: 1px solid var(--rq-line-2);
}
/* الصفّ الأول بلا حدٍّ علوي، والعمود الأول (في RTL: الأيمن) بلا جانبي */
.doc-stats > .doc-stat:nth-child(-n+4) { border-top: 0; }
.doc-stats > .doc-stat:nth-child(4n+1) { border-inline-start: 0; }
/* شبكةٌ من ثلاثة — تُستعمل حين تكون الأرقام ثلاثة لا ثمانية */
.doc-stats--3 { grid-template-columns: repeat(3, 1fr); }
.doc-stats--3 > .doc-stat:nth-child(-n+3) { border-top: 0; }
.doc-stats--3 > .doc-stat:nth-child(4n+1) { border-inline-start: 1px solid var(--rq-line-2); }
.doc-stats--3 > .doc-stat:nth-child(3n+1) { border-inline-start: 0; }

.doc-stat-top {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .9rem;
  min-height: 22px;
}
.doc-stat-ic {
  display: grid;
  place-items: center;
  width: 30px; height: 30px;
  border-radius: 9px;
  background: var(--rq-teal-wash);
  color: var(--rq-teal-d);
  font-size: 16px;
  flex: 0 0 auto;
}
.doc-stat .doc-chip { margin-inline-start: auto; }
.doc-stat-num {
  display: block;
  font-size: clamp(2.1rem, 4.2vw, 3rem);
  font-weight: 700;
  line-height: 1.05;
  color: var(--rq-ink);
  font-variant-numeric: tabular-nums lining-nums;
}
.doc-stat-num .u { font-size: .45em; font-weight: 700; color: var(--rq-teal-d); margin-inline-start: .08em; }
/* وحدةٌ كلمة لا رمز («يوماً» لا «٪»): الرمز يلتصق بالرقم والكلمة لا
   تلتصق به — بلا هذا يخرج «8يوماً» ملتحمين */
.doc-stat-num .u--w { font-size: .34em; margin-inline-start: .3em; }
.doc-stat-lbl {
  display: block;
  margin-top: .55rem;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  color: var(--rq-ink);
}
.doc-stat-sub { margin: .35rem 0 0; font-size: 12.5px; line-height: 1.85; color: var(--rq-mute); }
.doc-stat .doc-bar { margin-top: .7rem; }
/* الخلية البطلة: رقمٌ واحد في القسم أكبر من إخوته */
.doc-stat--lead { background: var(--rq-card-2); }
.doc-stat--lead .doc-stat-num { color: var(--rq-teal-d); }

/* ======================================================================
   ٥ · الشريط الأفقي وصفوفه — القطعة المشتركة الأكثر استعمالاً
   ====================================================================== */

.doc-bar {
  position: relative;
  height: 8px;
  border-radius: 99px;
  background: var(--rq-line-2);
  overflow: hidden;
}
.doc-bar > i {
  display: block;
  height: 100%;
  width: var(--w, 0%);
  border-radius: 99px;
  background: var(--rq-teal);
  transition: width .9s var(--rq-ease);
}
.doc-bar > i.is-bad  { background: var(--doc-bad); }
.doc-bar > i.is-warn { background: var(--doc-warn); }
.doc-bar > i.is-gold { background: var(--rq-gold-ink); }
.doc-bar--tall { height: 12px; }

.doc-rows { display: grid; gap: .1rem; }
.doc-row {
  display: grid;
  grid-template-columns: minmax(7rem, 12rem) 1fr auto;
  align-items: center;
  gap: .5rem 1rem;
  padding: .7rem .25rem;
  border-bottom: 1px solid var(--rq-line-2);
  transition: background .15s ease;
}
.doc-row:last-child { border-bottom: 0; }
.doc-row:hover { background: var(--rq-card-2); }
.doc-row-name {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: 14px;
  font-weight: 600;
  color: var(--rq-ink);
}
.doc-row-name small { font-size: 11.5px; font-weight: 400; color: var(--rq-mute); }
.doc-row-val {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  justify-content: flex-end;
  min-width: 7.5rem;
}
.doc-row-val b { font-size: 16px; font-weight: 700; color: var(--rq-ink); font-variant-numeric: tabular-nums lining-nums; }
.doc-row-val span { font-size: 12.5px; color: var(--rq-mute); font-variant-numeric: tabular-nums; }
.doc-row--zero .doc-row-name { color: var(--doc-bad); }
.doc-row--zero .doc-row-val b { color: var(--doc-bad); }

/* ======================================================================
   ٦ · الخط الزمني — خطٌّ يُرسم مع النزول
   ----------------------------------------------------------------------
   نفس حساب «سلسلة العهدة»: عقدةٌ مركزها ٩px من الحافة، وخطٌّ ١٫٥px
   يبدأ عند ٩ ناقص نصف عرضه فيقع مركزه على مركزها تماماً.
   ====================================================================== */

.doc-time { position: relative; list-style: none; margin: 0; padding: 0; }
.doc-time-item { position: relative; padding-inline-start: 2rem; padding-bottom: 1.6rem; }
.doc-time-item:last-child { padding-bottom: 0; }
.doc-time-item::before,
.doc-time-item::after {
  content: "";
  position: absolute;
  inset-inline-start: 8.25px;
  top: 14px;
  width: 1.5px;
}
.doc-time-item::before { bottom: 0; background: var(--rq-line); }
.doc-time-item:last-child::before { display: none; }
.doc-time-item::after { height: calc(100% - 14px); background: var(--rq-gold-ink); }
.doc-time-node {
  position: absolute;
  inset-inline-start: 5.5px;
  top: 14px;
  transform: translateY(-50%);
  z-index: 1;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--rq-paper);
  box-shadow: 0 0 0 1.5px var(--rq-gold-ink);
}
/* داخل لوحٍ أبيض تجلس العقدة على الأبيض لا على الورق */
.doc-plate .doc-time-node { background: var(--rq-card); }
.doc-time-item h3 { margin: 0 0 .45rem; font-size: 1.02rem; font-weight: 700; line-height: 1.7; color: var(--rq-ink); }
.doc-time-item .body { font-size: 13.5px; line-height: 2.05; color: var(--rq-ink-2); white-space: pre-line; }
.doc-time-item .muted { font-size: 13px; line-height: 1.95; color: var(--rq-mute); }

/* ======================================================================
   ٧ · الحركة — «البيانات تظهر»، لا «العناصر تتحرك»
   ----------------------------------------------------------------------
   لا شيء هنا يقع إلا تحت ‎html.rq-anim‎، والكشف يرثه كل قسمٍ من
   ‎.rq-reveal.rq-in‎ الذي يضعه ‎public-rq.js‎ عند دخوله الشاشة.
   ====================================================================== */

.rq-anim .doc-head-row .rule { transform: scaleX(0); transition: transform .9s var(--rq-ease); }
.rq-anim .rq-in .doc-head-row .rule { transform: scaleX(1); }

.rq-anim .doc-hero-stats { opacity: 0; transform: translateY(12px); transition: opacity .7s var(--rq-ease) .8s, transform .7s var(--rq-ease) .8s; }
.rq-anim .rq-in .doc-hero-stats { opacity: 1; transform: none; }

/* التعاقب يقرأ ‎--doc-i‎ من القالب لا من ‎nth-child‎: الفهرس المكتوب لا
   يتكسّر حين يختفي عنصر في حالةٍ فارغة */
.rq-anim .doc-stat,
.rq-anim .doc-time-item,
.rq-anim .doc-row { opacity: 0; transform: translateY(14px); }
.rq-anim .rq-in .doc-stat,
.rq-anim .rq-in .doc-time-item,
.rq-anim .rq-in .doc-row {
  opacity: 1;
  transform: none;
  transition: opacity .55s var(--rq-ease), transform .55s var(--rq-ease);
  transition-delay: calc(var(--doc-i, 0) * .06s);
}

.rq-anim .doc-bar > i { width: 0; }
.rq-anim .rq-in .doc-bar > i { width: var(--w, 0%); }

.rq-anim .doc-time-item::after { height: 0; transition: height .55s var(--rq-ease); }
.rq-anim .rq-in .doc-time-item::after { height: calc(100% - 14px); }

/* من أطفأ الحركة يستلم الوثيقة مكتملة: أشرطة ممدودة وخطوط مرسومة */
@media (prefers-reduced-motion: reduce) {
  .doc-hero-stats, .doc-stat, .doc-time-item, .doc-row, .doc-head-row .rule {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .doc-bar > i { width: var(--w, 0%) !important; transition: none !important; }
  .doc-time-item::after { height: calc(100% - 14px) !important; transition: none !important; }
}

/* ======================================================================
   ٨ · الاستجابة — إعادة ترتيبٍ فعلي، لا تصغيرُ نسخة الحاسوب
   ====================================================================== */

@media (max-width: 991.98px) {
  .doc-hero-grid { grid-template-columns: 1fr; gap: 2rem; }
}

@media (max-width: 767.98px) {
  .doc-stats,
  .doc-stats--3 { grid-template-columns: repeat(2, 1fr); }
  .doc-stats > .doc-stat,
  .doc-stats--3 > .doc-stat { border-top: 1px solid var(--rq-line-2); }
  .doc-stats > .doc-stat:nth-child(-n+2),
  .doc-stats--3 > .doc-stat:nth-child(-n+2) { border-top: 0; }
  .doc-stats > .doc-stat:nth-child(4n+1),
  .doc-stats--3 > .doc-stat:nth-child(3n+1) { border-inline-start: 1px solid var(--rq-line-2); }
  .doc-stats > .doc-stat:nth-child(odd),
  .doc-stats--3 > .doc-stat:nth-child(odd) { border-inline-start: 0; }

  .doc-row { grid-template-columns: 1fr auto; }
  .doc-row .doc-bar { grid-column: 1 / -1; }
}

@media (max-width: 575.98px) {
  .doc-stats,
  .doc-stats--3 { grid-template-columns: 1fr; }
  .doc-stats > .doc-stat,
  .doc-stats--3 > .doc-stat { border-inline-start: 0 !important; border-top: 1px solid var(--rq-line-2) !important; }
  .doc-stats > .doc-stat:first-child,
  .doc-stats--3 > .doc-stat:first-child { border-top: 0 !important; }

  .doc-hero-stats { grid-template-columns: 1fr; gap: .9rem; }
  .doc-hs { border-inline-start: 0; padding-inline: 0; text-align: start; display: flex; align-items: baseline; gap: .7rem; }
  .doc-hs + .doc-hs { padding-top: .9rem; border-top: 1px solid var(--rq-hair-gold); }
  .doc-hs span { margin-top: 0; }
  .doc-tools { gap: .5rem; }
  .doc-tools .doc-select, .doc-tools .doc-btn { flex: 1 1 auto; }
  .doc-row { grid-template-columns: 1fr; }
  .doc-row-val { justify-content: flex-start; }
  .doc-quote { padding-inline-start: 1.8rem; }
}

/* ======================================================================
   ٩ · الطباعة — وثيقةٌ تُطبع فتبقى مقروءة بلا لونٍ ولا حركة
   ====================================================================== */

@media print {
  .pub-nav, .pub-foot, .doc-tools, .no-print { display: none !important; }
  .pub-wrap { max-width: none !important; padding: 0 !important; }
  .rq-hero--doc {
    background: #fff !important;
    color: #000 !important;
    border: 1px solid #999;
    padding: 1rem !important;
    margin: 0 0 1rem !important;
  }
  .rq-hero--doc * { color: #000 !important; }
  .doc-badge { border-color: #999; background: none; }
  .doc-plate, .doc-stat { box-shadow: none !important; break-inside: avoid; }
  .doc-sec { break-inside: auto; margin-top: 1.25rem; }
  a { text-decoration: none !important; color: #000 !important; }
  .doc-bar > i { width: var(--w, 0%) !important; }
}