/* ═══ wtq-v4-base.css — أساس لغة التصميم المشترك (مستخلَص من home-v4.css) ══════════
   بقرار المالك (٥ سبتمبر ٢٠٢٦): «الموقع كله بكل صفحاته ياخد تصميم الصفحة الجديدة».
   ⚠️ يُحمَّل من includes/header.php بعد main.css **للصفحات التي تعلن `$v4Base = true`**
      قبل استدعاء الترويسة — لا للرئيسية (لها home-v4.css) ولا لصفحات لم تُنقل بعد.
   ⚠️ الرموز والطباعة تُطبَّق على الصفحة كلها؛ المكوّنات ببادئة .v4- كي لا تصطدم بأصناف الصفحات.
   ⚠️ الأوزان على سلّم CLAUDE.md: 800 للعنوان الرئيسي فقط · 500 فرعي/زر/رابط · 400 متن · 300 lead.
   ⚠️ اتّجاهيًّا محايد (inset-inline / margin-inline) — لا نسخة -en له. */
:root{color-scheme:light;
  --ink:#0B0B0B; --paper:#FFFFFF;
  --line:#E4E4E1; --line-2:#D2D2CE; --muted:#6E6E6B; --faint:#9A9A96;
  --blue:#2563EB; --blue-700:#1D4ED8; --blue-50:#EEF3FD; --green:#16A34A; --green-50:#E7F6EC;
  /* ألوان الحالة — بقرار المالك (٨ سبتمبر ٢٠٢٦): العطل يجب أن يُقرأ عطلًا لا أزرق كبقية الموقع.
     تُستعمل للحالة الدلالية وحدها (تعطّل · تدهور · تحذير) — ممنوعة للزينة أو التمييز.
     التباين على الأبيض مقيس: الأحمر 4.83:1 · الكهرماني 5.02:1 (كلاهما ≥ 4.5:1). */
  --red:#DC2626; --red-50:#FEF2F2; --red-line:#F3C6C6;
  --amber:#B45309; --amber-50:#FDF6EC; --amber-line:#EFD9B4;
  --foot:#EEF3FD; --panel:#F3F3F1;
  --maxw:1240px; --r:7px;}
/* ⚠️ iOS Safari يضخّم الخطّ تلقائيًّا في أي كتلة تتجاوز عرض الشاشة فيخرج
   النصّ عن إطار المتصفّح (بلاغ المالك ٩ سبتمبر ٢٠٢٦ على صفحة التوقيع).
   وُضع هنا لا في ورقة واحدة كي يغطّي كل صفحة تعلن $v4Base. ١٠ سبتمبر ٢٠٢٦. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:"Alexandria",system-ui,sans-serif; color:var(--ink); background:var(--paper); line-height:1.75; -webkit-font-smoothing:antialiased}
/* الطباعة — ارتفاع 1.7 لكل عنوان عربي قد يُكسر على سطرين (الشدّة والتنوين يعلوان حدّ السطر) */
h1,h2,h3,h4{color:var(--ink); text-wrap:balance}
h1{font-size:clamp(34px,4.7vw,60px); font-weight:800; letter-spacing:-.03em; line-height:1.28; margin:0}
h2{font-size:clamp(28px,3.4vw,44px); font-weight:800; letter-spacing:-.03em; line-height:1.7; margin:0}
h3{font-size:clamp(20px,2vw,26px); font-weight:500; letter-spacing:-.01em; line-height:1.7; margin:0}
h4{font-size:15.5px; font-weight:500; line-height:1.7; margin:0}
p{margin:0} a{color:inherit}
/* main.css يجعل .btn بوزن 700 — السلّم يجعل الأزرار 500 */
.btn{font-weight:500}
.v4-ltr{direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums}
.v4-mono{font-family:ui-monospace,Menlo,Consolas,monospace; direction:ltr; unicode-bidi:isolate; font-variant-numeric:tabular-nums}
/* التخطيط والإيقاع */
.v4-wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px}
.v4-sec{position:relative; padding:96px 0; background:#fff; scroll-margin-top:96px}
.v4-sec.alt{background:var(--panel)}
/* رأس القسم: eyebrow ← h2 ← lead (في الرئيسية: .sec h2 / .sec .lead) */
.v4-hd{max-width:760px}
.v4-hd.c{margin-inline:auto; text-align:center}
.v4-hd h2 .dim{color:var(--faint); font-weight:inherit}
.v4-eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:500; color:var(--muted); margin:0 0 14px}
.v4-eyebrow::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--blue); box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.v4-eyebrow b{color:var(--blue); font-weight:500}
.v4-lead{margin:16px 0 0; font-size:clamp(13.5px,1.05vw,15.5px); color:var(--muted); font-weight:300; line-height:1.9; max-width:62ch}
.v4-hd.c .v4-lead{margin-inline:auto}
/* الأزرار: ممتلئ أزرق للفعل الأوّل · مخطَّط للثانوي */
.v4-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font:inherit; font-size:14.5px; font-weight:500; border:1px solid var(--blue);
  background:var(--blue); color:#fff; padding:12px 26px; border-radius:var(--r);
  cursor:pointer; text-decoration:none; transition:background .16s, transform .15s;}
.v4-btn:hover{background:var(--blue-700); border-color:var(--blue-700); transform:translateY(-1px)}
.v4-btn.line{background:#fff; color:var(--blue); border-color:#C7D7FB}
.v4-btn.line:hover{background:var(--blue-50); border-color:var(--blue)}
.v4-btn .ico{width:15px; height:15px; transition:transform .2s}
.v4-ico{width:1em; height:1em; display:inline-block; vertical-align:-.15em; flex:none}
/* بلاطة الأيقونة: أزرق افتراضًا؛ الصبغات الأخرى للتمييز بين بنود متجاورة فقط لا للزينة */
.v4-itile{width:40px; height:40px; border-radius:var(--r); display:grid; place-items:center; flex:none; background:var(--blue-50); color:var(--blue)}
.v4-itile .ico{width:19px; height:19px}
.v4-itile.gr{background:var(--green-50); color:var(--green)}
.v4-itile.lg{width:52px; height:52px}
.v4-num{width:26px; height:26px; border-radius:var(--r); background:var(--blue); color:#fff; font-weight:500; font-size:12.5px; display:grid; place-items:center; flex:none; font-variant-numeric:tabular-nums}
/* البطاقة: حدّ رفيع بلا ظلّ */
.v4-card{position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:22px 22px 20px}
.v4-card h4{margin:0 0 8px; font-size:15.5px; font-weight:500; letter-spacing:-.01em}
.v4-card p{font-size:13px; color:var(--muted); line-height:1.85; font-weight:300}
.v4-tag{display:inline-flex; align-items:center; gap:6px; font-size:10.5px; font-weight:500; border:1px solid var(--line); border-radius:var(--r); padding:3px 9px; color:#3A3A38; background:#fff}
.v4-tag.g{color:#15803D; background:var(--green-50); border-color:#CDEBD6}
.v4-tag.b{color:var(--blue); background:var(--blue-50); border-color:#D6E2FB}
.v4-sk{display:block; height:6px; border-radius:3px; background:#ECECE9}
/* ظلّ النافذة المحاكاة — الوحيد المسموح خارج البطاقات */
.v4-win{background:#fff; border:1px solid var(--line); border-radius:var(--r); box-shadow:0 2px 6px rgba(11,11,11,.05), 0 44px 84px -44px rgba(11,11,11,.45)}
/* الحركة معلومة لا زينة */
.v4-rv{opacity:0; transform:translateY(18px); transition:opacity .75s ease, transform .75s cubic-bezier(.2,.8,.25,1)} .v4-rv.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){ .v4-rv{opacity:1; transform:none; transition:none} }
@media (max-width:900px){ .v4-sec{padding:64px 0} .v4-wrap{padding:0 20px} }
