/* هوية أثر — نفس توكنز الميني اب بالظبط، متكيّفة لموقع عام ريسبونسِف */
:root{
  --beige:#FAF7F0;--white:#FFFFFF;--navy:#071426;--navy2:#0c2036;--gold:#C8A96B;--goldSoft:#E2CFA6;
  --cream:#EFE6D6;--border:#E8EDF2;--red:#D62839;--amber:#9a6b00;--green:#0a7d4d;
  --n70:rgba(7,20,38,.70);--n55:rgba(7,20,38,.55);--n35:rgba(7,20,38,.35);
  --cream70:rgba(239,230,214,.72);--cream45:rgba(239,230,214,.45);
}
/* 🌓 (ثيمات ٢٠٢٦-١٠-١١) توكنز دلالية — قيمها النهاري **مطابقة بالحرف** للقيم اللي كانت مكتوبة
   مباشرة في القواعد، فالوضع النهاري ما اتغيّرش ولا بكسل. قيمها الليلي في آخر الملف (بلوك واحد
   بمحدّدين: الاختيار اليدوي + إعداد الجهاز — حارس check-theme-tokens بيتأكد إنهم متطابقين).
   • `-k` = ثابت في الوضعين: الأقسام الكحلية للهوية (الهيرو/الأرقام/المواسم…) ونص الأزرار الذهبية. */
:root{
  color-scheme:light;
  --navy-k:#071426;--navy2-k:#0c2036;--beige-k:#FAF7F0;--cream-k:#EFE6D6;--white-k:#FFFFFF;
  --soft:var(--cream45);--soft2:var(--cream70);
  --warn-bg:#fdf3f4;--warn-bg2:#fdecea;--warn-tx:#7a1f29;--warn-tx2:#9c4a53;--warn-tx3:#8c4049;
  --tip-bg:#f3f7f4;--tip-tx:#1c5238;--gold-tx:#8a6d2f;--gold-tx2:#6b4d16;
  --border-warm:#e5ded2;--hover-warm:#f3ead9;--ok-tx:#0a6b42;--ok-tx2:#0a7;
  --note-bg:#fff7ed;--note-bd:#fed7aa;--note-tx:#b45309;--cr-warn-bg:#fffaf0;--del-tx:#c0392b;
  --n66:rgba(7,20,38,.66);--n72:rgba(7,20,38,.72);
  --glass-bg:rgba(255,255,255,.93);--glass-bd:rgba(255,255,255,.6);--glass-hover:rgba(255,255,255,.55);
  --wa-tx:#128C46;--tg-tx:#1785BC;
  --red-solid:#D62839;--green-solid:#0a7d4d;--band-ring:transparent;
  /* أدوار الهوية الكحلية — `initial` = القاعدة بتاخد قيمتها الأصلية بالحرف (fallback) */
  --feature-bg:initial;--feature-band:initial;--frame-bd:initial;--band-edge:transparent;
  --ov-rgb:7,20,38;--hero-hairline:initial;
  /* 🐞 `--line` كان مستخدَم ومش متعرّف ⇒ الحد كله بيتلغي (فواصل جدول الأعمار + صندوق المواعيد المؤجلة).
     قصد القاعدة فاصل خفيف = نفس `--border` (وبيتبعه في الليل تلقائيًا). */
  --line:var(--border);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
/* تحصين ضد الهيدر الـ sticky (79px): أي قفزة لعنصر داخلي تسيب مسافة أمان فوقه */
h2,.sec-k,details.acc,.deadline{scroll-margin-top:calc(var(--hdr-h,112px) - 24px)}
/* ⚖️ (P3-06) توزيع أسطر العناوين — يمنع يُتْم الكلمات: «الدراسة في روسيا — ما /
   بوعدكش» كانت بتتقطع و«ما» تتيتّم في آخر السطر بعيد عن «بوعدكش».
   بتشتغل في المتصفحات الداعمة وبتتتجاهل بأمان في غيرها. */
h1,h2,h3{text-wrap:balance}
/* 🇷🇺 `Inter` احتياطي **للسيريلي بس** — الشرح الكامل في `src/layout.mjs`
   عند وسم الخطوط. الترتيب هو الضمانة: المتصفح بيختار الخط **لكل حرف**
   بالترتيب، وIBM Plex Sans Arabic بتغطّي العربي واللاتيني كاملين، فـInter
   مابتوصلش لحرف عربي ولا لاتيني أبدًا — بس بتمسك الحروف الروسية بدل ما
   تروح لخط النظام العشوائي.
   ✅ اتأكّد بالقياس: عرض «فرص الدراسة» و«Opportunities study» **ما اتغيّرش
      ولا بكسر عشري** قبل وبعد. */
body{font-family:'IBM Plex Sans Arabic','Inter',sans-serif;background:var(--beige);color:var(--navy);line-height:1.8;overflow-x:clip}
@media (prefers-reduced-motion: reduce){
  .hdr,.hdr .brand img{transition:none}
  body.hdr-off .hdr{transform:none}*{animation-duration:.001ms!important;transition-duration:.001ms!important}}
img{max-width:100%}
a{color:inherit}
/* 🔒 `overflow-x:clip` على الحاوية — مش على body.
   حركة رؤوس الأقسام بتزحلق أفقيًا 30px (motion.js)، وفي RTL دي بتخرج بره
   الإطار على الشاشات الضيّقة ⇒ تمرير أفقي 13px عند 360px. (P2-08)
   الكود كان مفترض إن `body{overflow-x:clip}` بتكفي، لكن الفائض بيوصل
   لـ`html` (اللي overflow-x بتاعه visible) فمابيتقصّش.
   و`clip` مش `hidden`: مابيعملش حاوية تمرير ومابيكسرش `position:sticky`. */
.wrap{max-width:820px;margin:0 auto;padding:0 18px;overflow-x:clip}


/* ⌨️ رابط التخطّي — مخفي بصريًا لحد ما ياخد التركيز بالتاب.
   مش `display:none` عشان يفضل في ترتيب التاب. (P2-14) */
/* ⛔️ `fixed` مش `absolute`: مع `absolute` الرابط بيتثبّت على أول المستند،
   فلو الطالب نزل بالصفحة والتاب وصله بيظهر **فوق الشاشة** ومايتشافش.
   (اتكشف بالقياس: مع top:0 كان الـrect لسه -100 لأن الصفحة منزّلة.) */
.skip-link{position:fixed;inset-inline-start:12px;top:-100px;z-index:100;
  background:var(--navy);color:var(--beige);font-weight:600;font-size:14px;
  padding:12px 20px;border-radius:0 0 12px 12px;text-decoration:none}
/* بلا transition عن قصد: رابط التخطّي لازم يظهر فورًا أول ما ياخد
   التركيز. أي تأخير بيخلّي مستخدم لوحة المفاتيح يفتكر إنه مش موجود. */
.skip-link:focus{top:0}


/* 🧭 خطوتك الجاية — روابط سياقية في آخر صفحة الفرصة (Phase 14).
   هادية بقصد: كروت خفيفة، مش بانرات. */
.nextsteps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-bottom:8px}
.nextstep{display:flex;gap:12px;align-items:flex-start;background:var(--white);
  border:1px solid var(--border);border-radius:12px;padding:14px 16px;text-decoration:none;
  color:var(--navy);transition:border-color .16s,background .16s}
.nextstep:hover{border-color:var(--gold);background:var(--cream)}
.nextstep .ic{font-size:21px;line-height:1.35;flex:none}
.nextstep .tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.nextstep .tx b{font-size:14px;font-weight:600;line-height:1.5}
.nextstep .tx .d{font-size:12.5px;color:var(--n62);line-height:1.7}


/* 🗂️ ملف التقديم (P2-21 مرحلة ١) — تجميع عرض بس، الطلبات نفسها مستقلة. */
.tr-case{border:1px solid var(--border);border-radius:18px;padding:12px 14px 6px;margin-bottom:14px;background:var(--beige)}
.tr-case-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:2px 4px 10px;font-size:13px}
.tr-case-hd b{font-weight:600;color:var(--navy)}
.tr-case-hd .lt{font-size:12px;color:var(--n62)}
.tr-case .tr-card{margin-bottom:8px}
.tr-addcase{display:inline-block;margin:6px 0 2px;font-size:13px}
.tr-case-badge{background:var(--cream);color:var(--goldText);border:1px solid var(--border)}

/* 📏 (P2-13) أرضية حجم الخط — ٢ سبتمبر ٢٠٢٦:
   ربع نص الموبايل كان تحت 12px (منه ١٢ عنصرًا عند 10px) — والعربي تحت
   12px على شاشة هاتف بيتلخبط نقطه وحركاته فعلًا.
   القاعدة: محتوى مقروء ≥ 12px · شارات دقيقة ≥ 11px · نقط الزينة
   (::before bullets عند 8px) متسابة لأنها مش نصًّا يُقرأ. */

/* 👆 (P2-15) أهداف اللمس — التوسيع بمساحة الضغط مش بحجم العنصر:
   padding بيكبّر منطقة اللمس وmargin سالب بيرجّع التخطيط مكانه، فالشكل
   ثابت والإصبع لاقي ≥44px. القياس الحي عند 360px: 108 هدف تحت 40px في
   صفحة الفرص — أغلبها «الموقع الرسمي ↗» (25px). */
/* (الصقل Premium) القياس الحي قال إن النتيجة كانت **37px** لسه — تحت
   الـ44 المطلوبة. `padding-block:16` بيدّي 45px فعليًا على 12.5px/1.6. */
/* 🔗 (الصقل Premium) **الروابط المستقلة** — اللي هي كل محتوى سطرها
   (مش رابط جوّه جملة). القياس الحي على `/opportunities/open-doors/`
   لقى ٦ منها بارتفاع ١٩–٢٢px: «الملف الرسمي (PDF) ↗»، «المصدر الرسمي ↗»،
   «اعرف إذا كنت مؤهلًا ←». دي أهداف أساسية مش كلمات في فقرة، فمالهاش
   استثناء الروابط داخل النص.
   ⚠️ الهامش السالب بيرجّع التخطيط مكانه ⇒ الشكل ما بيتغيّرش، منطقة
      الضغط بس هي اللي بتكبر. */
p > a:only-child,.elig-src > a,.minlist a{
  display:inline-flex;align-items:center;min-height:44px;
  padding-block:12px;margin-block:-12px;padding-inline:6px;margin-inline:-6px;border-radius:8px}

/* (الصقل Premium) القياس الحي بعد الحشو لوحده قال 41px — لسه تحت 44.
   `min-height` صريح + `inline-flex` بيضمن الرقم مهما كان line-height. */
.ometa-i.olink,.wmore,.ssoon-cta,.crumbs a,.tool-signup a,footer .fine a{
  display:inline-flex;align-items:center;min-height:44px;
  padding-block:12px;margin-block:-12px;
  padding-inline:8px;margin-inline:-8px;
  border-radius:8px;position:relative;z-index:1}


/* 🗂️ البطاقة المرجعية المختصرة (خطة الإغلاق — قسم ٤) */
.state.ref{color:var(--goldText);font-weight:600}
.ocard.soon.linked{cursor:pointer}
.ocard.soon.linked:hover{border-color:var(--gold)}
.light-dates{margin:16px 0 4px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.light-elig{margin:10px 0 0}
.light-facts{margin:14px 0;display:grid;gap:6px;max-width:68ch}
.light-facts .accrow{display:flex;justify-content:space-between;gap:14px;padding:9px 13px;
  background:var(--white);border:1px solid var(--border);border-radius:8px;font-size:13px}
.light-facts .accrow b{font-weight:600;color:var(--n70);flex:none}
.light-official{display:inline-block;margin:4px 0 18px}
/* 🧪 Pilot — «فرص مرتبطة» في البطاقات المرجعية: نفس ألوان/حدود .light-facts */
.light-rel-h{font-size:15px;margin:14px 0 6px}
.light-rel{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:6px;max-width:68ch}
.light-rel li{padding:9px 13px;background:var(--white);border:1px solid var(--border);border-radius:8px;font-size:14px}
.light-rel li .d{display:block;margin-top:2px;font-size:12.5px;color:var(--n55)}
.save-opp[aria-pressed="true"]{background:var(--green-solid);border-color:var(--green-solid)}


/* 💳 ملخّص الطلب الحي + تاريخ الدفعات (قسمي ١٢–١٣) */
.tr-summary{border:1px solid var(--border);border-radius:12px;background:var(--white);
  padding:12px 14px;display:grid;gap:7px;max-width:68ch}
.tr-sum-row{display:flex;justify-content:space-between;gap:12px;font-size:13px}
.tr-sum-row>span:first-child{color:var(--n62);flex:none}
.tr-sum-mode{font-size:12.5px;font-weight:600;padding:7px 11px;border-radius:8px;margin-top:2px}
.tr-sum-mode.fixed{background:var(--cream);color:var(--green)}
.tr-sum-mode.range{background:var(--cream);color:var(--goldText)}
.tr-sum-mode.manual{background:var(--beige);color:var(--n70);border:1px dashed var(--border)}
.tr-payhistory{margin-bottom:14px}
.tr-payhistory .tr-ph-k{display:block;font-size:13px;font-weight:600;margin-bottom:8px}
.tr-ph-reason{margin-top:6px;font-size:12.5px;color:var(--red);line-height:1.8}
/* 🧭 كارت «إيه اللي حاصل» (قسم ١٢) */
.tr-nextaction{border:1px solid var(--border);border-inline-start:3px solid var(--gold);
  border-radius:12px;background:var(--white);padding:13px 15px;margin:12px 0 16px;
  display:grid;gap:7px;max-width:68ch}
.tr-na-row{display:flex;gap:10px;font-size:13px;line-height:1.8}
.tr-na-k{flex:none;min-width:92px;color:var(--n62);font-size:12.5px;padding-top:1px}
.tr-nextaction.s-needs_student,.tr-nextaction.s-quoted,.tr-nextaction.s-awaiting_payment,
.tr-nextaction.s-submitted{border-inline-start-color:var(--red)}
.tr-nextaction.s-delivered,.tr-nextaction.s-paid{border-inline-start-color:var(--green)}


/* 🧭 مساحة عمل الحساب + موعد المحفوظات (قسمي ٢١–٢٢) */
.acct-next{display:grid;gap:8px;margin-bottom:6px}
.saved-dl{font-size:13px;color:var(--n70);margin:4px 0 8px;line-height:1.7}
.saved-dl.urgent{color:var(--red);font-weight:600}
.saved-dl.late{color:var(--red)}
.saved-dl.dim{color:var(--n62)}


/* 🧵 القصة المطوية (قسم ٦) — الصوت كامل، والمساحة محترمة */
.story-fold{margin-top:var(--sec-gap)}
/* هدف اللمس: كان ٢٥px — أقصر عنصر قابل للضغط في الرئيسية. */
.story-fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;flex-wrap:wrap;min-height:44px;border-radius:10px;transition:background var(--t-base)}
.story-fold>summary:hover{background:var(--soft2)}
.story-fold>summary::-webkit-details-marker{display:none}
.story-cta{font-size:14px;font-weight:600;color:var(--goldText)}
.story-fold[open] .story-cta{opacity:.55}

/* 🖋️ إيقاع الفقرات (جولة الصقل): فقرة ← فقرة أقرب من قسم ← قسم بوضوح،
   والعريض جوّه النص الجاري 600 مش 700 — تمييز مش صياح. */
.mdp p{margin:0}
.mdp p+p{margin-top:9px}
.prose.mdp p+p{margin-top:11px}
.prose b,.note b,.mdp b,.acc .in b,.card .li b,.cr .crtx p b,.step p b,.elig p b,.deadline p b,.minlist p b,.seasonpast p b{font-weight:600}
.note.mdp{line-height:1.9}

/* صندوق «تقدر تقدّم أصلًا؟» — كان متصادمًا مع .elig (flex) فاتعصر عمودين */
.ehl{padding:15px 17px}
.ehl-t{display:block;font-size:14px;color:var(--navy);margin-bottom:8px}
.eligtx{font-size:14.5px;line-height:1.85;color:var(--n70);max-width:var(--measure)}


/* 🎯 جلسات حية على الرئيسية (قسم ١٢) — كروت صفحة الجلسات نفسها جوّه قسم البقاء */
.home-ses{margin-top:14px;text-align:start}
.home-ses .ses-card{box-shadow:var(--sh-1)}
/* 🏠 خطوة المسجّل (قسم ١٣) — سطر واحد هادي بعد الهيرو */
.home-next-wrap{margin-top:14px}
.home-next{max-width:560px}

/* ===== header ===== */
.hdr{background:var(--beige);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20;
     transition:transform .3s cubic-bezier(.4,0,.2,1)}
/* 🔒 الإخفاء **تحسين**: من غير الكلاس دي الهيدر ظاهر دايمًا. */
body.hdr-off .hdr{transform:translateY(-100%)}
.hdr .in{max-width:820px;margin:0 auto;padding:8px 18px;transition:padding .28s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:space-between;gap:10px}
/* 🚫 (الصقل Premium) تمرير أفقي على 320px — مقاس حي على `/en/` و`/ru/`:
   البراند (١٨٨px) + الأكشنز (١٢٤px) = ٣٢٢ جوّه ٢٩٢ متاحة ⇒ فايض ٣٠px.
   السبب إن عنصر الـflex افتراضيًا `min-width:auto` فمابيضيقش أبدًا، والاسم
   الإنجليزي/الروسي أطول من العربي. `min-width:0` بيخلّي الاسم **يلفّ**
   بدل ما يدفع الصفحة — صفر حرف بيتقص وصفر تمرير أفقي. */
.hdr .brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.hdr .brand .tx{min-width:0}
.hdr-actions{flex:none}
/* 🎯 اللوجو بيفرض نفسه في الانطباع الأول، وبيصغر لما القارئ ينزل.
   الحركة على width/height بس — **مفيش أي تأثير على تدفّق المحتوى**
   لأن الهيدر sticky وارتفاعه بيتغيّر فوق المحتوى مش جوّاه (صفر CLS). */
/* 🔒 القيمة دي هي **الآمنة** — بتطبّق لو الجافاسكربت فشل أو اتأخر.
   at-top بيكبّر فوق · scrolled بيصغّر بعد النزول. الاتنين تحسين بس. */
.hdr .brand img{width:96px;height:96px;object-fit:contain;flex:none;
                transition:width .3s cubic-bezier(.4,0,.2,1),
                           height .3s cubic-bezier(.4,0,.2,1)}
/* 🔒 الافتراضي بقى **نفس** مقاس at-top: كده ارتفاع الهيدر معروف (112px)
   حتى لو الجافاسكربت اتأخر، والهيرو الكامل بيلزق فوق من غير شريط بيج.
   (قبل كده الافتراضي 80 وat-top 96 ⇒ ارتفاعين مختلفين لنفس اللحظة.) */
body.at-top   .hdr .brand img{width:96px;height:96px}
/* 📉 (الصقل Premium) بعد النزول: 72 ⇐ 60. الهيدر الثابت كان بياخد 88px
   من الشاشة طول القراءة. المقاس الأول (الانطباع) ما اتغيّرش ولا بكسل. */
body.scrolled .hdr .brand img{width:60px;height:60px}
.hdr .brand .w{font-weight:600;font-size:16px;color:var(--navy);line-height:1.25;letter-spacing:-.005em}
.hdr .brand .s{font-size:12px;color:var(--goldText);font-weight:600;letter-spacing:.04em}
/* 🏷️ (هوية ٢٠٢٦-١٠-١١) شعار أثر + اسم المشروع بس — من غير سطر تاني.
   «أثر» أكبر وأتقل عشان تتقري جنب الشعار؛ ATHAR/АСАР كابيتال بتباعد حروف هادي.
   نسخة الكحلي من الشعار للهيرو الكحلي بس — قبل النزول (من غير JS الهيدر فاضل شفاف فوق الهيرو فبتظهر برضه). */
.hdr .brand .w{font-weight:700;font-size:20px;line-height:1.1;letter-spacing:.09em}
.hdr .brand .w:lang(ar){font-size:28px;letter-spacing:0;line-height:1.15}
.hdr .brand .mk-d{display:none}
body.has-fullhero:not(.scrolled) .hdr .brand .mk-l{display:none}
body.has-fullhero:not(.scrolled) .hdr .brand .mk-d{display:block}
.hdr .tg{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:12.5px;color:var(--navy-k);background:var(--gold);padding:9px 16px;border-radius:999px;text-decoration:none;box-shadow:0 10px 22px -14px rgba(200,169,107,.95);transition:transform var(--t-fast) var(--ease-out),box-shadow var(--t-base),filter var(--t-base)}
.hdr .tg:hover{filter:brightness(1.04);box-shadow:0 12px 24px -13px rgba(200,169,107,1)}
.hdr .tg:active{transform:scale(.97)}
.hdr-actions{display:flex;align-items:center;gap:8px;flex:none}
/* (P2-15) 44px هو هدف اللمس المعتمد — كانت 42 */
.hdr-actions>*{min-height:44px;box-sizing:border-box;align-items:center}
/* 🎚️ (الصقل Premium) ترتيب الأصوات في الهيدر:
   كان فيه **تلات عناصر ذهبية** جنب بعض — كبسولة لغة بحد ذهبي 1.5px
   وظلّ، وكبسولة حساب زيّها، وزر تيليجرام ذهبي مصمت. تلاتة بنفس
   الجاذبية = ولا واحد فيهم أساسي.
   دلوقتي: التيليجرام هو الذهبي الوحيد (الفعل الأساسي)، ومبدّل اللغة
   وحسابي بقوا كبسولات محايدة بحدّ شعري — بيوصلوا الذهبي في hover بس.
   صفر تغيير في الترتيب أو الوظيفة أو عدد الضغطات. */
.lang-switch{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:12.5px;color:var(--n70);background:var(--white);border:1px solid var(--border);padding:10px 15px;border-radius:999px;text-decoration:none;transition:border-color var(--t-base),color var(--t-base),background var(--t-base)}
.lang-switch .glb{width:16px;height:16px;color:var(--n62);display:inline-flex;flex:none;transition:color var(--t-base)}
.lang-switch .glb svg{width:16px;height:16px;display:block}
.lang-switch:hover{background:var(--cream);color:var(--goldText);border-color:var(--gold)}
.lang-switch:hover .glb{color:var(--goldText)}
.lang-switch:active{transform:scale(.97)}
/* الصفحة الحالية بلغتها: الكبسولة بتاعة اللغة النشطة مش موجودة أصلًا في
   الماركب (بيتعرض البدائل بس) — فمفيش حالة selected تتعرّف هنا. */
/* زر «حسابي» في الهيدر — يظهر بعد الدخول بس (nav.js). نفس كبسولة مبدّل اللغة. */
.hdr-account{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:12.5px;color:var(--n70);background:var(--white);border:1px solid var(--border);padding:10px 14px;border-radius:999px;text-decoration:none;transition:background var(--t-base),color var(--t-base),border-color var(--t-base)}
.hdr-account:hover{background:var(--cream);color:var(--goldText);border-color:var(--gold)}
.hdr-account:active{transform:scale(.97)}
/* نسخة الفوتر — نفس الكبسولة، متمركزة */
.lang-switch.foot{margin:18px auto 0;min-height:44px}
/* الموبايل: الهيدر فيه براند + مبدّل لغة + تيليجرام — بيزحم تحت 430px.
   الحل: نص زر التيليجرام يختفي وتفضل الأيقونة بس (الزر لسه واضح وقابل للضغط). */
/* 📱 ≤360px — أضيق جهاز في القايمة (320/360). كل قيمة هنا مقاسة مش مخمّنة. */
@media(max-width:360px){
  :root{--hdr-h:76px}
  .hdr .brand img,body.at-top .hdr .brand img{width:64px;height:64px}
  body.scrolled .hdr .brand img{width:48px}
  .hdr .brand{gap:9px}
  .hdr .brand .w{font-size:14.5px}
  .hdr .brand .w:lang(ar){font-size:21px}   /* 🏷️ «أثر» فاضلة أوضح من الكلمة اللاتيني */
  .hdr-actions{gap:5px}
  .lang-switch{padding:9px 8px;font-size:11.5px}
}
@media(max-width:430px){
  .hdr .brand .s{display:none}
  /* السطر التاني بيتخفي مع `.s` — بس الـ`<br>` بتاعه بيفضل بيحجز سطر
     فاضي جوّه البراند (٥٨px ارتفاع لسطر واحد نص). بيتشال معاه. */
  .hdr .brand .tx br{display:none}
  .hdr .brand .w{font-size:16px;line-height:1.3}
  .hdr .brand .w:lang(ar){font-size:23px;line-height:1.2}
  .hdr .brand img{width:76px;height:76px}      /* الآمن — هيدر ~88px */
  body.at-top   .hdr .brand img{width:76px;height:76px}
  body.scrolled .hdr .brand img{width:52px;height:52px}
  .hdr .in{padding:6px 14px}   /* 76+12 = هيدر 88px = --hdr-h */
  .lang-switch{padding:9px 9px;font-size:12px}
  /* 🇷🇺 مع اللغة التالتة بقى في الهيدر زرّين لغة بدل واحد. على 360px ده
     كان بيخلّي الهيدر الروسي 390px ⇒ سكرول أفقي للصفحة كلها. الأيقونة
     الكروية زخرفية والرمز (AR/EN/RU) بيقول كل حاجة، فبتتخفي في الضيّق
     وحدها — التصميم على الديسكتوب زي ما هو. */
  .hdr-actions{gap:6px}
  .lang-switch .glb{display:none}
  /* موبايل: زرّين بس (🌐 + ☰) — القناة وحسابي جوّه القايمة، الهيدر يبقى نضيف */
  .hdr .tg{display:none !important}
  .hdr-account{display:none !important}
}

/* ===== breadcrumb ===== */
.crumbs{font-size:12px;color:var(--n62);padding:14px 0 0}
.crumbs a{color:var(--n62);text-decoration:none}
.crumbs a:hover{color:var(--goldText)}
.crumbs .sep{margin:0 6px;color:var(--n35)}
/* 🔁 فاصل فتات الخبز **اتجاهي** — المحرف في الـHTML واحد (`‹`) في كل
   اللغات، وهو الصح على العربي (RTL: القراءة من اليمين لليسار). على
   الصفحات LTR (إنجليزي وروسي) كان بيشاور للخلف — فبينعكس بصريًا هنا.
   إصلاح واحد مشترك بدل ٢٧ تعديل في الـHTML، ومخرَج العربي ما بيتغيّرش. */
html[dir="ltr"] .crumbs .sep{display:inline-block;transform:scaleX(-1)}
.crumbs .cur{color:var(--goldText);font-weight:600}

/* ===== hero (نفس هوية hero الميني اب) ===== */
.hero{position:relative;outline:1px solid var(--band-ring);outline-offset:-1px;background:var(--feature-bg, var(--navy-k));color:var(--beige-k);border-radius:24px;overflow:hidden;margin-top:14px;padding:34px 26px 30px}
/* ═══ طبقة الغلاف الموحّدة — نفس التدرّج على كل صفحة فيها صورة ═══
   🔴 كانت `rgba(7,20,38,.78)` **مسطّحة**، فالصورة الغامقة بتبقى شبه سودا والفاتحة
      بتبان — يعني كل صفحة شكلها مختلف رغم إن الطبقة واحدة. التدرّج بيوحّد الإحساس:
      أغمق فوق (تحت العنوان) وأفتح تحت (بيسيب الصورة تتنفّس).
   ⚠️ **وأرضية التباين محفوظة:** أفتح نقطة في التدرّج **.74**، وده على صورة بيضا
      بالكامل بيدّي خلفية فعلية ≈ #47515E، والنص البيچ (#FAF7F0) فوقها ≈ **7.2:1** —
      فوق AA بكتير. أي تفتيح تحت .74 لازم يتحسب من الأول.
   📐 والإطار موحّد كمان: `background-position` ثابت و`min-height` بحد أدنى، عشان
      الصور المختلفة النِسَب (١٥٠٠×٣٥٧ لحد ١٥٠٠×١١٢٥) تدّي نفس الشريط البصري. */
.hero .bgimg{position:absolute;inset:0;background-size:cover;background-position:center 42%;z-index:0}
.hero .ov{position:absolute;inset:0;z-index:1;
  background:linear-gradient(178deg,rgba(var(--ov-rgb),.90) 0%,rgba(var(--ov-rgb),.82) 46%,rgba(var(--ov-rgb),.74) 100%)}
/* ⚠️ `:not(.hero-v2)` مقصودة: `.hero:has(.bgimg)` نوعيّتها (0,2,0) أعلى من
   `.hero-v2` (0,1,0)، فمن غيرها الـmin-height ده كان **بيدهس** الـ100vh بتاعة
   هيرو الرئيسية ويرجّعها ٢٦٠px. (اتمسكت في المتصفح — الرئيسية اتراجعت فعلًا.) */
.hero:has(.bgimg):not(.hero-v2){min-height:260px;display:flex;flex-direction:column;justify-content:flex-start}
@media(max-width:600px){.hero:has(.bgimg):not(.hero-v2){min-height:220px}}
/* هالة ثابتة (من غير أنيميشن blur — أخف على الأداء/CWV من نسخة الميني اب) */
.hero .glow{position:absolute;top:-12%;right:-12%;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(200,169,107,.26),transparent 66%)}
.hero>*{position:relative;z-index:2}
.hero .eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--goldText);border:1px solid rgba(200,169,107,.3);padding:6px 13px;border-radius:999px;margin-bottom:16px;background:rgba(255,255,255,.04)}
.hero .eyebrow .p{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 var(--green);animation:dot 2s infinite}
@keyframes dot{0%{box-shadow:0 0 0 0 rgba(10,125,77,.6)}70%,100%{box-shadow:0 0 0 7px rgba(10,125,77,0)}}
.hero h1{font-weight:700;font-size:clamp(26px,5vw,38px);line-height:1.35;margin-bottom:12px}
.hero h1 .g{color:var(--goldText);position:relative}
.hero h1 .g::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:9px;background:var(--gold);opacity:.22;border-radius:4px;z-index:-1}
/* الاسم الكامل تحت العنوان المختصر — ظاهر للطالب، مش مخبّي */
.hero .fullname{font-size:12.5px;line-height:1.7;color:var(--cream70);margin:-4px 0 8px;max-width:56ch}
.hero .org{font-size:13px;color:var(--goldSoft);margin-bottom:10px}
.hero p.lead{font-size:14px;color:var(--cream70);line-height:1.9;max-width:60ch}
.hero .btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
/* .cta عام (كان محصور جوه .hero بس — صفحات الحساب محتاجاه برّه كمان) */
/* 🎛️ (الصقل Premium) الأزرار: `.cta` كان 14px/47px ارتفاع و`.ghost`
   13px/45px — وهما بيقفوا جنب بعض في نفس الصفّ في الهيرو وفي كل
   صفحة حساب. اختلاف ٢px في الارتفاع وحرف في الحجم = الصفّ باين
   «مش مظبوط» من غير ما العين تعرف ليه. دلوقتي `min-height:48px`
   واحد للتلاتة، ونفس مقاس النص.
   واللمسة على الضغط بقت فورية (`--t-fast`) — الإحساس بالسرعة جزء
   من الفخامة: الزر بيرد قبل ما الصفحة تتحرك. */
.cta,.ghost,.hero .ghosty{min-height:48px;box-sizing:border-box}
.cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--gold);color:var(--navy-k);border:0;border-radius:12px;padding:12px 24px;font-family:inherit;font-weight:600;font-size:14.5px;cursor:pointer;text-decoration:none;box-shadow:0 14px 32px -16px rgba(200,169,107,.95);transition:transform var(--t-fast) var(--ease-out),box-shadow var(--t-base) var(--ease-out),filter var(--t-base)}
.cta:hover{box-shadow:0 16px 34px -14px rgba(200,169,107,1);filter:brightness(1.03)}
.cta:active{transform:scale(.985);box-shadow:0 8px 18px -12px rgba(200,169,107,.9)}
.cta[disabled],.cta:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;filter:none}
/* زر ثانوي (خروج/إجراءات أقل أهمية) — كان مستخدم في الماركب من غير تعريف */
.ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--white);color:var(--navy);border:1.5px solid var(--border);border-radius:12px;padding:12px 22px;font-family:inherit;font-weight:600;font-size:14.5px;cursor:pointer;text-decoration:none;transition:border-color var(--t-base),color var(--t-base),background var(--t-base),transform var(--t-fast) var(--ease-out)}
.ghost:hover{border-color:var(--goldText);color:var(--goldText);background:var(--cream)}
.ghost:active{transform:scale(.985)}
.ghost[disabled],.ghost:disabled{opacity:.45;cursor:not-allowed}
.hero .ghosty{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1.5px solid rgba(200,169,107,.45);color:var(--goldSoft);border-radius:12px;padding:12px 24px;font-weight:600;font-size:14.5px;text-decoration:none;transition:transform var(--t-fast) var(--ease-out),border-color var(--t-base),background var(--t-base),color var(--t-base)}
.hero .ghosty:hover{border-color:var(--gold);background:rgba(200,169,107,.12);color:var(--white-k)}
.hero .ghosty:active{transform:scale(.985)}

/* ===== الشريط الأحمر — مواعيد/تحذيرات بس ===== */
.deadline{display:flex;gap:13px;align-items:flex-start;background:var(--warn-bg);border:1px solid rgba(214,40,57,.18);border-inline-start:4px solid var(--red);border-radius:18px;padding:16px 18px;margin:16px 0 0}
.deadline .ic{font-size:18px;line-height:1.35;flex:none}
.deadline>div>b{color:var(--warn-tx);font-size:15px;display:block;margin-bottom:3px;line-height:1.55}
.deadline p{color:var(--warn-tx);font-size:13.5px;line-height:1.8;max-width:var(--measure)}

/* ===== شريط الإحصائيات (نفس .strip بتاعة الميني اب) ===== */
.strip{display:grid;grid-template-columns:repeat(4,1fr);margin:20px 0 0;border-radius:18px;background:var(--white);box-shadow:var(--sh-1);overflow:hidden;border:1px solid var(--border)}
.strip .s{padding:18px 10px;text-align:center;position:relative}
/* 🔁 الفاصل كان `right:0` ثابت ⇒ في LTR بيقع على الجانب الغلط من الخانة. */
.strip .s+.s::before{content:"";position:absolute;inset-inline-start:0;top:24%;height:52%;width:1px;background:var(--border)}
.strip .s b{font-weight:700;font-size:21px;color:var(--navy);display:block;line-height:1.35}
.strip .s small{font-size:12.5px;color:var(--n62);margin-top:6px;display:block;line-height:1.65}
/* الطبقة العليا «at a glance»: رقم Inter كبير أو أيقونة line-art — نفس الارتفاع (40px) للأربعة */
.strip .s .num{font-family:'Inter','IBM Plex Sans Arabic',sans-serif;font-weight:700;font-size:26px;color:var(--navy);display:block;height:32px;line-height:32px;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.strip .s .ico{display:flex;align-items:center;justify-content:center;height:32px}
.strip .s .ico svg{width:30px;height:30px;stroke:var(--navy);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
/* الطبقة الوسطى (الكلمة) والسفلى (الليبل) — إيقاع موحّد تحت الرقم أو الأيقونة */
.strip .s .num+b,.strip .s .ico+b{font-size:13.5px;margin-top:4px;color:var(--n70);line-height:1.5}
@media(max-width:560px){.strip{grid-template-columns:repeat(2,1fr)}.strip .s:nth-child(3)::before{display:none}.strip .s:nth-child(-n+2){border-bottom:1px solid var(--border)}}
/* سطر تحت الشريط — فئة الشريط ما بيلخّصهاش (مسار البوست-دوك). هامشي بالتصميم:
   الشريط هو الرسالة، وده حاشية عشان ماحدش يفتكر إن مفيش حاجة ليه. */
.stripnote{margin:8px 2px 0;font-size:12.5px;line-height:1.7;color:var(--n62)}
.stripnote a{color:var(--goldText,var(--goldText));font-weight:700;text-decoration:none}
.stripnote a:hover{text-decoration:underline}

/* ===== أقسام المقال ===== */
main{padding-bottom:30px}
/* 📐 (الصقل Premium) الإيقاع: العنوان الفرعي (eyebrow) تابع للـ`h2` مش
   مستقل عنه — فالمسافة اللي بينهم صغيرة (٨px) والمسافة اللي **قبلهم**
   هي اللي بتفصل الأقسام (`--sec-gap`). قبل كده كانت 34/14 ⇒ الفاصل بين
   قسمين أقرب من الفاصل بين العنوان ومحتواه في بعض الأماكن. */
.sec-k{font-weight:600;font-size:13.5px;letter-spacing:.01em;color:var(--goldText);margin:var(--sec-gap) 0 8px;display:flex;align-items:center;gap:10px}
.sec-k::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}
/* سطر وصف قصير تحت عنوان القسم (مستويات المدربين: بكالوريوس / ماستر ودكتوراه) */
.sec-p{margin:-4px 0 18px;font-size:15px;line-height:1.8;color:var(--navy);opacity:.75;max-width:var(--measure)}
/* تبويبات صفحة المدربين — نفس شكل .opptab، بس واقفة لوحدها مش تحت خانة بحث.
   .opptabs أصلًا flex-wrap:wrap ⇒ بتلفّ على الموبايل من غير سكرول أفقي. */
.tuttabs{margin:22px 0 4px}
.tsec.is-hidden{display:none}
.tsec .sec-k{margin-top:24px}
/* 🪜 (الصقل Premium) العناوين: `h2` كان 21px والنص الجاري 16px — فرق
   ضعيف جدًا لعنوان قسم. 24px بيدّي درجة واضحة من غير ما يبقى صياح،
   و`line-height` أقرب بيخلّي العنوان اللي بيلفّ سطرين كتلة واحدة. */
h2{font-weight:700;font-size:24px;line-height:1.45;margin-bottom:14px;letter-spacing:-.005em}
@media(max-width:560px){h2{font-size:21px}}
/* 📏 قياس القراءة — أهم إصلاح مقروئية في الموقع. (P2-10)
   `.prose` كانت بلا `max-width` خالص فبتاخد عرض الحاوية كامل (٧٨٤px)
   ⇒ ٨٢ حرف في السطر على الديسكتوب، و٩١ في صفحة الترجمة، و١١٩ في
   Open Doors. المدى المريح للعربي ٤٥–٧٥.
   ⚠️ والقياس على **النص المتدفّق بس** — الجداول والشبكات والنماذج
      والكروت محتاجة عرضها كامل، فمالهاش الكلاس ده. */
.prose{font-size:16px;color:var(--n70);line-height:1.9;max-width:68ch}
.prose b{color:var(--navy)}

/* كارت أبيض بنفس روح .opp */
/* 🃏 (الصقل Premium) الكارت الساكن: ظلّ ملامسة بدل ظلّ ارتفاع — صفحة
   فيها ٦ كروت بظلّ مرتفع بتبقى «تقيلة». والشريط الذهبي فوق بقى
   `inset-inline` (كان `right` ثابت) وأرفع — لمسة هوية مش خط تقسيم. */
.card{position:relative;border:1px solid var(--border);border-radius:18px;padding:20px 22px;background:var(--white);overflow:hidden;box-shadow:var(--sh-1);margin-bottom:14px}
.card::before{content:"";position:absolute;top:0;inset-inline:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent)}
.card h3{font-weight:600;font-size:16px;line-height:1.55;margin-bottom:10px}
/* 📏 (الصقل Premium) نص الكارت كان 13px بعرض ٧٨٤px ⇒ ≈١٠٠ حرف/سطر،
   والفقرة الجارية جنبه (`.prose`) 16px بسقف 68ch. نفس المحتوى بحجمين
   مختلفين. 14.5px + سقف القياس بيوحّدهم من غير ما يكبر الكارت. */
.card .li{display:flex;gap:10px;margin-bottom:11px;font-size:14.5px;color:var(--n70);line-height:1.85}
.card .li:last-child{margin-bottom:0}
.card .li::before{content:"\25C6";color:var(--goldText);font-size:8px;margin-top:9px;flex:none;opacity:.75}
/* 🐞 اتكشف ٧ سبتمبر ٢٠٢٦ على صفحة [69] «Физтех»: الصفّ `flex` والـ`span` جوّاه
   `flex:0 1 auto`، فأي محتوى بلا min-content عريض (زي `.od-tbl` اللي بيبقى
   كروت على الموبايل) بيخلّي الـspan **يتقلّص** — الجدول طلع 169px جوّه صفّ
   286px. `flex:1;min-width:0` بيخلّي الـspan ياخد باقي الصفّ زي ما هو مفروض.
   للنصّ العادي مفيش أي فرق مرئي: النصّ الطويل كان بيملا السطر أصلًا. */
.card .li>span{flex:1;min-width:0;max-width:var(--measure)}

/* خطوات المراحل */
/* (جولة الصقل) المراحل: كانت كروت منفصلة — بقت مسارًا واحدًا متّصلًا:
   صندوق واحد وخط رأسي بيربط أرقام المراحل، فالتسلسل باين بالنظر. */
.steps{display:grid;background:var(--white);border:1px solid var(--border);border-radius:14px;box-shadow:var(--sh-1);overflow:hidden}
.step{display:flex;gap:14px;padding:16px 18px;border-top:1px solid var(--border);position:relative}
.step:first-child{border-top:0}
.step::before{content:"";position:absolute;inset-inline-start:32px;top:0;bottom:0;width:2px;background:var(--border)}
.step:first-child::before{top:22px}
.step:last-child::before{bottom:auto;height:22px}
.step .n{width:32px;height:32px;border-radius:50%;background:var(--navy);color:var(--goldText);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;flex:none;position:relative;z-index:1}
.step>div>b{font-size:15px;display:block;margin-bottom:3px;line-height:1.55}
.step p{font-size:14px;color:var(--n62);line-height:1.8;max-width:var(--measure)}

/* الرئيسية: شبكة أبرز الفرص + زر كل الفرص */
.opps-home{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(max-width:700px){.opps-home{grid-template-columns:1fr}}
.opps-home .opp{display:flex;flex-direction:column}
.opps-home .opp .ft{margin-top:auto}
/* زر «شوف كل الفرص» — كحلي فخم بحدود ذهبية ورقم Inter ذهبي */
.all-opps-wrap{display:flex;justify-content:center;margin-top:24px}
.all-opps{display:inline-flex;align-items:center;gap:10px;min-height:52px;background:var(--feature-bg, linear-gradient(135deg,#10243d,var(--navy-k)));color:var(--beige-k);border:1.5px solid rgba(200,169,107,.45);border-radius:12px;padding:13px 24px;font-weight:600;font-size:14.5px;text-decoration:none;box-shadow:var(--sh-2);transition:transform var(--t-base) var(--ease-out),box-shadow var(--t-base),border-color var(--t-base)}
.all-opps .ic{width:30px;height:30px;border-radius:50%;background:rgba(200,169,107,.16);color:var(--goldText);display:flex;align-items:center;justify-content:center;flex:none}
.all-opps .ic svg{width:15px;height:15px}
.all-opps .n{font-family:'Inter','IBM Plex Sans Arabic',sans-serif;font-weight:800;font-size:18px;color:var(--goldText);line-height:1;margin-inline-start:2px}
.all-opps .sub{font-size:12.5px;font-weight:600;color:var(--cream70)}
.all-opps:hover{transform:translateY(-2px);border-color:var(--gold);box-shadow:0 20px 40px -20px rgba(200,169,107,.55)}
.all-opps:active{transform:scale(.98)}

/* ===== كارت فرصة (نفس .opp بتاعة الميني اب — كلينك) ===== */
.opp{position:relative;display:block;border:1px solid var(--border);border-radius:18px;padding:18px;background:var(--white);overflow:hidden;cursor:pointer;text-decoration:none;color:var(--navy);box-shadow:var(--sh-2)}
.opp::before{content:"";position:absolute;top:0;inset-inline:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent);opacity:.75}
.opp .badge{display:inline-block;font-size:11.5px;font-weight:600;color:var(--goldText);border:1px solid rgba(200,169,107,.35);padding:5px 11px;border-radius:999px;margin-bottom:11px}
/* 🪜 (الصقل Premium) اسم الفرصة بيكبر درجة، والميتا بتفضل مكانها —
   المسافة بين المستويين هي اللي بتعمل الهرمية، مش لون تاني ولا وزن تالت. */
.opp h3{font-weight:600;font-size:16.5px;line-height:1.5;margin-bottom:8px;letter-spacing:-.004em}
.opp .meta{font-size:12.5px;color:var(--n62);margin-bottom:12px;line-height:1.6}
.opp .ft{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:13px;border-top:1px solid var(--border)}
.opp .ft .fund{font-size:12.5px;font-weight:600;color:var(--green);display:block;line-height:1.6}
.opp .ft .st{font-size:12.5px;color:var(--n62);display:block;margin-top:3px;line-height:1.6}
/* هدف اللمس: الشريحة كانت ٢٧px ارتفاعًا جوّه كارت كله رابط.
   الحشو بيوسّع منطقة الضغط والهامش السالب بيرجّع الشكل مكانه. */
.opp .ft .more{font-size:12.5px;font-weight:600;color:var(--goldText);flex:none;border:1.5px solid rgba(200,169,107,.4);border-radius:999px;padding:9px 15px;transition:background var(--t-base),border-color var(--t-base),color var(--t-base)}
.opp:hover .ft .more{background:var(--gold);border-color:var(--gold);color:var(--navy-k)}

/* ===== صفحة الفرص: هيرو أنحف + كروت القوايم ===== */
.hero-slim{padding:26px 24px 24px}
h2 .cnt{font-size:14px;color:var(--n62);font-weight:600}
.ocards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:8px}
@media(max-width:640px){.ocards{grid-template-columns:1fr;gap:12px}}
/* 🃏 (الصقل Premium) كارت القائمة — **اسم الفرصة هو البطل**.
   المقاس قبل: الاسم 13px/600 جنب كبسولة عدّاد ممتلئة بحد ورقم Inter 800.
   العين كانت بتروح للتاريخ الأول. دلوقتي: الاسم 15.5px وله مساحة تنفّس،
   والعدّاد هدى (تحت). صفر تغيير في المحتوى أو الترتيب أو عدد الضغطات. */
.ocard{position:relative;display:flex;flex-direction:column;gap:5px;background:var(--white);border:1px solid var(--border);border-radius:14px;padding:16px 18px;overflow:hidden;text-decoration:none;color:var(--navy)}
.ocard::before{content:"";position:absolute;top:0;inset-inline:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent);opacity:.75}
.ocard b{font-weight:600;font-size:15.5px;line-height:1.55;letter-spacing:-.004em}
.ocard .en{font-size:12.5px;color:var(--n62);direction:ltr;text-align:right;line-height:1.55;margin-top:1px}
[dir="ltr"] .ocard .en{text-align:left}
.ocard .state{font-size:12.5px;font-weight:600;color:var(--n62);margin-top:auto;padding-top:11px;border-top:1px solid var(--border)}
.ocard.open .state.ok{color:var(--green)}
.ocard.open{border-color:rgba(200,169,107,.45)}
.ocard.soon::before{background:linear-gradient(90deg,var(--n35),transparent)}
.ocard.soon b{color:var(--n70)}

/* طيّ كروت «قريبًا» — الكروت في الـ HTML (SEO)، الإخفاء بصري بس عبر details */
details.more-opps{margin:4px 0 8px}
details.more-opps summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;list-style:none;background:var(--white);border:1.5px solid var(--border);border-radius:999px;padding:10px 18px;font-weight:600;font-size:13px;color:var(--n70);transition:border-color .15s}
details.more-opps summary::-webkit-details-marker{display:none}
details.more-opps summary:hover{border-color:var(--goldText)}
details.more-opps summary .ar{color:var(--goldText);font-size:12px;transition:transform .25s}
details.more-opps[open] summary .ar{transform:rotate(180deg)}
details.more-opps[open] summary{margin-bottom:10px}
/* ===== المدربون الأذكياء — كروت بهوية الموقع (equal-height، أيقونة فوق، زر ذهبي تحت) ===== */
.tutors{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:900px){.tutors{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.tutors{grid-template-columns:1fr}}
.tutor{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;background:var(--white);border:1px solid var(--border);border-radius:18px;padding:20px 16px 18px;position:relative;overflow:hidden;box-shadow:var(--sh-2)}
.tutor::before{content:"";position:absolute;top:0;right:0;width:100%;height:3px;background:linear-gradient(90deg,var(--gold),transparent)}
.tutor .tic{width:56px;height:56px;border-radius:18px;background:var(--cream);display:flex;align-items:center;justify-content:center;flex:none}
.tutor .tic svg{width:32px;height:32px;stroke:var(--navy);stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tutor b{font-weight:600;font-size:14px;line-height:1.7;color:var(--navy)}
.tutor .ten{font-size:12px;color:var(--n62);line-height:1.5;font-variant-numeric:tabular-nums}
/* ليبل المستوى — بيميّز مدرّب البكالوريوس عن مدرّب الماجستير/الدكتوراه لما
   الكارتين يبانوا في نفس القايمة بنفس الاسم (الصفحة الأم). */
.tutor .tlv{font-size:12px;font-weight:600;line-height:1;color:var(--navy);background:var(--cream);border:1px solid var(--border);border-radius:999px;padding:5px 10px}
.tutor .d{font-size:12px;color:var(--n62);line-height:1.7}
.tutor .tgo{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-family:inherit;font-weight:600;font-size:13px;color:var(--navy-k);background:var(--gold);border-radius:12px;padding:10px 20px;text-decoration:none;box-shadow:0 10px 24px -14px rgba(200,169,107,.95);transition:transform .14s}
.tutor .tgo:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
  .tutor{transition:transform .25s ease,box-shadow .25s ease}
  .tutor:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
}

/* ===== كروت الأدلة (PDF) ===== */
.guides{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(max-width:640px){.guides{grid-template-columns:1fr}}
/* equal-height: الجريد بيمدّد الصف، والـ flex-column بيثبّت زر التحميل تحت في الأربعة */
.guide{display:flex;gap:13px;align-items:stretch;background:var(--white);border:1px solid var(--border);border-radius:18px;padding:15px;text-decoration:none;color:var(--navy);box-shadow:var(--sh-2);position:relative;overflow:hidden}
.guide::before{content:"";position:absolute;top:0;right:0;width:100%;height:3px;background:linear-gradient(90deg,var(--gold),transparent)}
.guide .ic{width:40px;height:40px;border-radius:12px;background:var(--cream);display:flex;align-items:center;justify-content:center;flex:none;font-size:18px}
.guide .tx{display:flex;flex-direction:column;flex:1;min-width:0}
.guide .tx b{font-weight:600;font-size:13px;display:block;line-height:1.7;margin-bottom:3px}
.guide .tx .d{font-size:12px;color:var(--n62);display:block;line-height:1.7;margin-bottom:10px}
.guide .tx .dl{font-size:12.5px;font-weight:600;color:var(--goldText);display:block;margin-top:auto}

/* 📘 كارت دليل PDF بغلاف مصغّر (صفحة الفرصة) — نفس كارت `.guide` بالظبط،
   الفرق الوحيد إن مكان الأيقونة فيه صورة الغلاف. الأبعاد ثابتة في الـHTML
   (width/height) عشان مافيش layout shift وقت تحميل الصورة. */
.guide-pdf{margin-bottom:12px}
.guide-pdf .cv{width:72px;height:102px;flex:none;border-radius:8px;object-fit:cover;background:var(--cream);border:1px solid var(--border)}
.guide-pdf .tx .mt{font-size:12px;color:var(--n62);display:block;margin-bottom:9px}
.guide-pdf .tx .mt bdi + bdi::before{content:" · ";color:var(--n35)}

/* checklist في صفحات الأدلة — علامة صح خضرا بدل المعيّن الذهبي */
.card.checklist .li.ok::before{content:"✓";color:var(--green);font-size:13px;font-weight:600;margin-top:2px}

/* صفحات الأدلة الغنية: محتويات + عناوين فرعية + أقسام مطوية */
/* «محتويات الدليل» — شبكة كروت مرقمة بهوية الموقع */
.toc{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}
@media(max-width:900px){.toc{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.toc{grid-template-columns:1fr}}
.toc a{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;font-weight:600;color:var(--navy);text-decoration:none;background:var(--white);border:1px solid var(--border);border-radius:12px;padding:12px 14px;line-height:1.7;position:relative;overflow:hidden;transition:transform .18s ease,border-color .18s,box-shadow .18s}
.toc a::before{content:"";position:absolute;top:0;right:0;width:100%;height:2px;background:linear-gradient(90deg,var(--gold),transparent)}
.toc a .num{font-family:'Inter','IBM Plex Sans Arabic',sans-serif;font-weight:800;font-size:15px;color:var(--goldText);flex:none;line-height:1.5}
.toc a:hover{transform:translateY(-2px);border-color:var(--goldText);box-shadow:var(--sh-2)}

.g-h3{font-weight:600;font-size:16px;margin:20px 0 8px;color:var(--navy)}
.g-h3::before{content:"\25C6";color:var(--goldText);font-size:9px;margin-left:8px;vertical-align:2px}
[dir="ltr"] .g-h3::before{margin-left:0;margin-right:8px}
section[id^="s"]{scroll-margin-top:92px}

/* الطي: كارت كريمي واضح إنه تفاعلي — أيقونة + بتلف لـ ×، ونص اعرض/اخفِ بيتبدل */
details.sec-fold{margin:6px 0 12px}
details.sec-fold summary{display:flex;align-items:center;gap:11px;cursor:pointer;list-style:none;background:var(--cream);border:1.5px solid var(--border);border-radius:12px;padding:13px 16px;font-weight:600;font-size:13px;color:var(--navy);transition:border-color .18s,background .18s,box-shadow .18s}
details.sec-fold summary::-webkit-details-marker{display:none}
details.sec-fold summary:hover{border-color:var(--goldText);background:var(--hover-warm);box-shadow:0 12px 26px -22px rgba(200,169,107,.9)}
details.sec-fold summary .pl{width:26px;height:26px;border-radius:50%;background:var(--navy);color:var(--goldText);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;flex:none;transition:transform .25s ease;line-height:1}
details.sec-fold[open] summary .pl{transform:rotate(45deg)}
details.sec-fold summary .lbl-hide{display:none}
details.sec-fold[open] summary .lbl-show{display:none}
details.sec-fold[open] summary .lbl-hide{display:inline}
details.sec-fold[open] summary{margin-bottom:12px}
/* فتح سلس (transform/opacity بس — reduced-motion بيقتله عبر القاعدة العامة) */
.sec-fold-in{animation:foldIn .3s ease}
@keyframes foldIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* سطر «قريبًا» في الـ CTA */
.season .soon{font-size:12.5px;color:var(--cream45);margin:14px 0 0;border-top:1px solid rgba(200,169,107,.18);padding-top:12px}
/* 🎙️ سطر ثانوي تحت أزرار الـCTA (الجلسات المباشرة) — مقصود إنه سطر خافت
   مش زرار تالت، عشان مايزاحمش الأولوية. */
.season .seclink{font-size:12.5px;margin:13px 0 0;border-top:1px solid rgba(200,169,107,.18);padding-top:12px}
.season .seclink a{color:var(--cream70);text-decoration:underline;text-underline-offset:3px}

/* صورة وسطية اختيارية بتكسر النص (slot — بيظهر لو midImage موجودة في المحتوى) */
.midimg{margin:22px 0 0;border-radius:18px;overflow:hidden;border:1px solid var(--frame-bd, var(--border));box-shadow:var(--sh-2);background:var(--white)}
.midimg img{display:block;width:100%;height:auto}
.midimg figcaption{font-size:12.5px;color:var(--n62);padding:9px 14px;border-top:1px solid var(--border)}

/* chips المسارات (نفس .chip) */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:var(--white);border:1.5px solid var(--border);border-radius:12px;padding:10px 15px;font-size:13.5px;font-weight:500;color:var(--navy);min-height:40px;display:inline-flex;align-items:center;box-sizing:border-box}

/* ملاحظات (نفس .note/.warn بتوع الميني اب) */
/* 🔁 (الصقل Premium) حدود منطقية بدل `border-right` + نسخة `[dir=ltr]`:
   قاعدة واحدة بتشتغل صح في الاتجاهين، وثمان قواعد بقت أربعة. */
.note{background:var(--white);border:1px solid var(--border);border-inline-start:3px solid var(--gold);border-radius:12px;padding:15px 17px;font-size:14.5px;line-height:1.85;color:var(--n70);margin:14px 0;max-width:var(--measure)}
.note.warn{background:var(--warn-bg);border-inline-start-color:var(--red);color:var(--warn-tx)}
.note.tip{background:var(--tip-bg);border-inline-start-color:var(--green);color:var(--tip-tx)}

/* 🔗 «فرص مشابهة» — شبكة الروابط الداخلية (حل مشكلة الفهرسة، ٢٨ يوليو ٢٠٢٦) */
.relgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:10px;margin:14px 0 6px}
.relcard{display:block;padding:14px 16px;border:1px solid var(--border);border-radius:12px;background:var(--white);text-decoration:none;transition:border-color .2s,transform .2s}
.relcard:hover{border-color:var(--goldText);transform:translateY(-2px)}
.relcard b{display:block;font-size:13px;color:var(--navy);line-height:1.7}
.relcard .rel-k{display:block;margin-top:4px;font-size:12.5px;color:var(--n62)}

/* 📋 أقسام «اللائحة بتقول إيه» — القاعدة ٢١
   السبب: كل اللي بنستخرجه من اللوائح كان بيتكوّم في فقرة واحدة طويلة،
   والطالب مابيقراهاش. دلوقتي كل موضوع قسم بعنوان + سطر مصدر واحد. */
.dblock{margin:0 0 22px}
.dblock-h{font-size:15px;font-weight:700;color:var(--n90);margin:0 0 9px;display:flex;align-items:center;gap:8px;line-height:1.5}
.dblock-ic{font-size:18px;line-height:1;flex:0 0 auto}
.dblock-src{font-size:12px;color:var(--n50);margin:7px 2px 0;line-height:1.7}

/* details (أكورديون native بدون JS) */
details.acc{background:var(--white);border:1px solid var(--border);border-radius:12px;margin-bottom:10px;overflow:hidden}
details.acc summary{display:flex;align-items:center;gap:12px;padding:16px 17px;cursor:pointer;font-weight:600;font-size:15px;line-height:1.55;list-style:none;min-height:56px;box-sizing:border-box;transition:background var(--t-base)}
details.acc summary:hover{background:var(--soft2)}
details.acc summary::-webkit-details-marker{display:none}
details.acc summary .ic{width:34px;height:34px;border-radius:8px;background:var(--cream);display:flex;align-items:center;justify-content:center;flex:none;font-size:16px}
details.acc summary .ar{margin-right:auto;color:var(--goldText);font-size:13px;transition:transform .25s}
details.acc[open] summary .ar{transform:rotate(180deg)}
details.acc .in{padding:0 15px 16px;font-size:14.5px;line-height:1.85;color:var(--n70);max-width:var(--measure)}

/* قصة عبدالرحمن — نص كامل + slot صورة اختياري (شغال من غيرها) */
.about{margin-bottom:6px}
.about.has-photo{display:grid;grid-template-columns:340px 1fr;gap:26px;align-items:start}
.about .ph{width:100%;height:auto;aspect-ratio:5/6;object-fit:cover;align-self:start;border-radius:18px;border:1px solid var(--border);outline:1.5px solid rgba(200,169,107,.4);outline-offset:5px;box-shadow:var(--sh-2);margin-top:4px}
@media(max-width:760px){
  .about.has-photo{grid-template-columns:1fr}
  .about .ph{max-width:290px;margin:2px auto 6px;display:block}
}
.about .story .prose{margin-bottom:12px}
.about .story .prose:first-child{font-weight:600;color:var(--navy);font-size:15px}
.about .motto{font-weight:700;font-size:18px;color:var(--goldText);margin-top:16px;position:relative;padding-right:16px}
.about .motto::before{content:"\25C6";position:absolute;right:0;top:9px;font-size:8px;color:var(--goldText)}
[dir="ltr"] .about .motto{padding-right:0;padding-left:16px}
[dir="ltr"] .about .motto::before{right:auto;left:0}

/* كارت بوت التيليجرام — أداة الطالب */
.botcard{position:relative;display:flex;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid var(--border);border-radius:18px;padding:18px;background:var(--white);overflow:hidden;text-decoration:none;color:var(--navy);cursor:pointer;box-shadow:var(--sh-2)}
.botcard::before{content:"";position:absolute;top:0;right:0;width:100%;height:3px;background:linear-gradient(90deg,var(--gold),transparent)}
.botcard .bic{width:54px;height:54px;border-radius:50%;background:var(--navy);color:var(--goldText);display:flex;align-items:center;justify-content:center;flex:none}
.botcard .bic svg{width:26px;height:26px}
.botcard .btx{flex:1;min-width:230px;display:flex;flex-direction:column;gap:7px}
.botcard .btx b{font-size:15px;font-weight:600}
.botcard .btx .hnd{font-size:12px;font-weight:700;color:var(--goldText);margin-inline-start:4px}
.botcard .btx .d{font-size:12.5px;color:var(--n70);line-height:1.9}
.botcard .chips{display:flex;gap:7px;flex-wrap:wrap}
.botcard .chips span{font-size:12px;font-weight:600;color:var(--navy);background:var(--cream);border-radius:999px;padding:5px 11px}
.botcard .bgo{flex:none;display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:13px;color:var(--navy-k);background:var(--gold);padding:11px 17px;border-radius:12px}
@media(max-width:600px){.botcard .bgo{width:100%;justify-content:center}}

/* ===== لوحة البث (إدارة) ===== */
.fld textarea{width:100%;font-family:inherit;font-size:16px;color:var(--navy);background:var(--white);border:1px solid var(--border);border-radius:12px;padding:12px 14px;resize:vertical;line-height:1.8;transition:border-color var(--t-base),box-shadow var(--t-base)}
.fld textarea:hover:not(:focus){border-color:rgba(200,169,107,.55)}
.fld textarea:focus{outline:0;border-color:var(--goldText);box-shadow:0 0 0 3px rgba(200,169,107,.18)}
@media(min-width:700px){.fld textarea{font-size:15px}}
.targetbox{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
.targetbox>span{font-size:12.5px;font-weight:600;color:var(--navy)}
.targetbox b{font-size:27px;font-weight:800;color:var(--goldText);line-height:1}
.targetbox .ghost{margin-inline-start:auto;padding:9px 16px;font-size:12.5px}
.prevtabs{display:flex;gap:6px;background:var(--cream);padding:4px;border-radius:999px;margin-bottom:12px;max-width:230px}
.prevtab{flex:1;font-family:inherit;font-weight:600;font-size:12px;color:var(--n62);background:0;border:0;padding:8px 10px;border-radius:999px;cursor:pointer}
.prevtab.on{background:var(--white);color:var(--navy)}
.msgprev{outline:1px solid var(--band-ring);outline-offset:-1px;background:var(--feature-bg, var(--navy-k));color:var(--beige-k);border-radius:12px;padding:16px;font-family:inherit;font-size:13px;line-height:1.9;white-space:pre-wrap;word-break:break-word;margin:0;max-height:340px;overflow:auto}
.camp-st{font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;background:var(--cream);color:var(--n70)}
.camp-st.approved{background:rgba(200,169,107,.22);color:var(--gold-tx)}
.camp-st.sent{background:rgba(10,125,77,.12);color:var(--green)}
.camp-st.canceled{background:rgba(214,40,57,.1);color:var(--red)}
/* أرقام الحملة الأربعة: مستهدَف · وصل · فشل · متبقّي */
.lt.ok{color:var(--green)}
.lt.bad{color:var(--red)}
.lt.warn{color:var(--goldText)}

/* كارت الأداة في الرئيسية */
.toolcard{position:relative;display:flex;align-items:center;gap:18px;flex-wrap:wrap;border:1px solid var(--border);border-radius:18px;padding:20px 22px;background:var(--white);overflow:hidden;text-decoration:none;color:var(--navy);box-shadow:var(--sh-1)}
.toolcard::before{content:"";position:absolute;top:0;inset-inline:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent);opacity:.75}
.toolcard:hover{border-color:rgba(200,169,107,.55)}
.toolcard .tic{width:52px;height:52px;border-radius:12px;background:var(--cream);color:var(--goldText);display:flex;align-items:center;justify-content:center;flex:none}
.toolcard .ttx{flex:1;min-width:230px;display:flex;flex-direction:column;gap:6px}
.toolcard .tbadge{align-self:flex-start;font-size:11px;font-weight:600;color:var(--green);background:rgba(10,125,77,.1);border-radius:999px;padding:4px 10px}
.toolcard .ttx b,.toolcard .toolcard-t{font-size:16.5px;font-weight:600;margin:0;line-height:1.5;letter-spacing:-.004em}
.toolcard .ttx .d{font-size:14px;color:var(--n70);line-height:1.8;max-width:var(--measure)}
.toolcard .tgo{flex:none;display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-size:13.5px;color:var(--navy-k);background:var(--gold);padding:11px 20px;border-radius:12px;transition:filter var(--t-base)}
.toolcard:hover .tgo{filter:brightness(1.04)}
@media(max-width:600px){.toolcard .tgo{width:100%;justify-content:center}}

/* ===== أداة تحويل الصور إلى PDF ===== */
/* صندوق الطمأنة — أول حاجة تحت الهيرو */
.safebox{display:block;background:linear-gradient(135deg,rgba(10,125,77,.09),rgba(10,125,77,.03));border:1px solid rgba(10,125,77,.28);border-radius:18px;padding:15px 17px;margin-bottom:18px}
.safebox b{display:block;font-size:14px;color:var(--green);margin-bottom:6px}
.safebox span{display:block;font-size:12.5px;color:var(--n70);line-height:1.9}
.iptool{border:1px solid var(--border);border-radius:18px;padding:18px;background:var(--white);box-shadow:var(--sh-2);margin-bottom:26px}
/* منطقة الرفع */
.ip-drop{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;border:2px dashed rgba(200,169,107,.55);border-radius:18px;padding:26px 18px;background:var(--beige);cursor:pointer;transition:border-color .16s,background .16s,transform .16s}
.ip-drop:hover,.ip-drop:focus-visible{border-color:var(--goldText);background:var(--cream);outline:0}
.ip-drop.over{border-color:var(--goldText);background:var(--cream);transform:scale(1.01)}
.ip-drop .ic{color:var(--goldText)}
.ip-drop b{font-size:14px;color:var(--navy)}
.ip-drop small{font-size:12.5px;color:var(--n62)}
.ip-empty{text-align:center;font-size:12.5px;color:var(--n62);padding:16px 0 4px}
/* شبكة الصور */
.ip-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:14px}
.ip-item{position:relative;border:1px solid var(--border);border-radius:12px;padding:8px;background:var(--white);display:flex;flex-direction:column;gap:6px;cursor:grab}
.ip-item.dragging{opacity:.5}
.ip-num{position:absolute;top:10px;inset-inline-start:10px;width:22px;height:22px;border-radius:50%;background:var(--navy);color:var(--goldText);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;z-index:1}
.ip-thumb{width:100%;height:110px;object-fit:cover;border-radius:8px;background:var(--cream)}
.ip-name{font-size:12px;color:var(--n62);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:center}
.ip-ctrls{display:flex;gap:5px;justify-content:center}
.ip-mini{width:30px;height:30px;font-family:inherit;font-size:13px;font-weight:600;color:var(--navy);background:var(--cream);border:0;border-radius:8px;cursor:pointer;transition:background .14s,color .14s}
.ip-mini:hover{background:var(--gold)}
.ip-mini.del:hover{background:var(--red-solid);color:#fff}
/* الإجراءات */
.ip-actions{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
.ip-opt{display:flex;flex-direction:column;gap:5px}
.ip-opt>span{font-size:12.5px;font-weight:600;color:var(--navy)}
.ip-opt select{font-family:inherit;font-size:16px;color:var(--navy);background:var(--white);border:1px solid var(--border);border-radius:8px;padding:9px 11px}
.ip-opt select:focus{outline:0;border-color:var(--goldText)}
@media(min-width:700px){.ip-opt select{font-size:13px}}
.ip-count{font-size:12px;font-weight:600;color:var(--goldText);margin-inline-start:auto;padding-bottom:10px}
.ip-btns{display:flex;gap:8px;flex-wrap:wrap}
.ip-msg{font-size:12.5px;line-height:1.8;border-radius:12px;padding:10px 13px;margin-top:12px;background:var(--cream);color:var(--navy);white-space:pre-line}
.ip-msg.ok{background:rgba(10,125,77,.1);color:var(--green)}
.ip-msg.warn{background:rgba(214,40,57,.08);color:var(--red)}
@media(max-width:600px){
  .ip-list{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
  .ip-count{margin-inline-start:0;padding-bottom:0}
  .ip-btns{width:100%}
  .ip-btns .cta,.ip-btns .ghost{flex:1;justify-content:center}
}

/* ===== حسابات الطلاب — نماذج الدخول والحساب ===== */
/* مسرح الدخول: صورة دافئة تحت overlay كحلي موحّد + كارت زجاجي متداخل فوقها */
.authstage{position:relative;overflow:hidden;padding:46px 18px 96px;text-align:center;isolation:isolate}
.authstage .bgimg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:-2}
.authstage .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--ov-rgb),.80),rgba(var(--ov-rgb),.90));z-index:-1}
.authstage .glow{position:absolute;top:-30%;left:50%;width:520px;height:520px;transform:translateX(-50%);background:radial-gradient(circle,rgba(200,169,107,.22),transparent 62%);pointer-events:none;z-index:-1}
.authstage-in{max-width:600px;margin:0 auto}
.authstage h1{font-weight:700;font-size:27px;line-height:1.35;color:var(--beige-k);margin:12px 0 10px}
.authstage h1 .g{color:var(--goldText)}
.authstage .lead{font-size:13px;line-height:1.9;color:var(--cream70);max-width:480px;margin:0 auto}
.authstage .eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--goldSoft);border:1px solid rgba(200,169,107,.35);padding:6px 13px;border-radius:999px}
.authstage .eyebrow .p{width:6px;height:6px;border-radius:50%;background:var(--gold)}
@media(max-width:600px){.authstage{padding:34px 16px 88px}.authstage h1{font-size:21px}}

/* الكارت الزجاجي — بيطلع فوق المسرح */
.authcard{max-width:430px;margin:-70px auto 0;position:relative;z-index:2;border:1px solid var(--glass-bd);border-radius:18px;padding:22px;background:var(--glass-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--sh-2)}
.authcard::before{content:"";position:absolute;top:0;right:0;left:0;height:3px;border-radius:20px 20px 0 0;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
/* دخول ناعم — هادي لأن الصفحة وظيفية (والحركة بتتوقف مع reduced-motion) */
@keyframes authRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.authcard{animation:authRise .5s cubic-bezier(.22,.9,.3,1) both}
.authstage-in{animation:authRise .45s cubic-bezier(.22,.9,.3,1) both}
/* التوقيع تحت الكارت */
.auth-sig{text-align:center;margin:22px auto 6px}
.auth-sig .dv{width:38px;height:2px;background:var(--gold);margin:0 auto 8px;border-radius:4px}
.auth-sig .mt{font-weight:600;font-size:12.5px;color:var(--goldText)}
.auth-tabs{display:flex;gap:6px;background:var(--cream);padding:4px;border-radius:999px;margin-bottom:18px}
/* هدف اللمس: كانت ٣٨px — وهي أول قرار في صفحة الدخول (دخول/حساب جديد). */
.auth-tab{flex:1;min-height:44px;font-family:inherit;font-weight:600;font-size:14px;color:var(--n62);background:transparent;border:0;padding:11px 14px;border-radius:999px;cursor:pointer;transition:background var(--t-base),color var(--t-base)}
.auth-tab:hover:not(.on){color:var(--navy);background:var(--glass-hover)}
.auth-tab.on{background:var(--white);color:var(--navy);box-shadow:var(--sh-1)}
/* 📝 (الصقل Premium) الفورم: الليبل والمساعدة كانوا 12.5 و12 — فرق
   نص بكسل مابيتشافش. دلوقتي ليبل 13.5 وحقل 15/16 ومساعدة 12.5،
   والمسافة بين الحقول اتوسّعت شوية عشان الفورم يتنفّس.
   ⛔️ من غير floating labels — الليبل فوق زي ما هو (قرار قائم). */
.fld{display:block;margin-bottom:18px}
.fld>span{display:block;font-weight:600;font-size:13.5px;color:var(--navy);margin-bottom:7px;line-height:1.5}
/* 16px على الموبايل إلزامي — أقل من كده iOS Safari بيعمل zoom تلقائي على الحقل */
.fld input,.fld select{width:100%;font-family:inherit;font-size:16px;min-height:48px;color:var(--navy);background:var(--white);border:1px solid var(--border);border-radius:12px;padding:12px 14px;transition:border-color var(--t-base),box-shadow var(--t-base),background var(--t-base)}
@media(min-width:700px){.fld input,.fld select{font-size:15px}}
.fld input::placeholder{color:var(--n55)}
.fld input:hover:not(:focus),.fld select:hover:not(:focus){border-color:rgba(200,169,107,.55)}
.fld input:focus,.fld select:focus{outline:0;border-color:var(--goldText);box-shadow:0 0 0 3px rgba(200,169,107,.18)}
/* حالات الخطأ والنجاح — الحد واضح والهالة بتاكّد، بلا أيقونات جديدة */
.fld input[aria-invalid="true"],.fld select[aria-invalid="true"],.fld textarea[aria-invalid="true"]{border-color:var(--red);box-shadow:0 0 0 3px rgba(214,40,57,.14)}
.fld input:disabled,.fld select:disabled,.fld textarea:disabled{background:var(--beige);color:var(--n55);cursor:not-allowed}
.fld small{display:block;font-size:12.5px;color:var(--n62);margin-top:6px;line-height:1.7}
.authbtn{width:100%;justify-content:center;margin-top:4px}
.authbtn[data-busy="1"]{opacity:.6;pointer-events:none}
.auth-msg{font-size:13.5px;line-height:1.8;border-radius:12px;padding:12px 15px;margin:14px 0;background:var(--cream);color:var(--navy);white-space:pre-line}
.auth-msg.ok{background:rgba(10,125,77,.1);color:var(--green)}
.auth-msg.warn{background:rgba(214,40,57,.08);color:var(--red)}
.cancel-btn{background:transparent;color:var(--red);border:1.5px solid var(--red);margin-top:10px;display:block;width:100%}
.cancel-btn:hover{background:rgba(214,40,57,.06)}
.forgot-wrap{text-align:center;margin-top:10px}
/* هدف لمس: كان 26px ارتفاعًا — الحشو بيوسّعه لـ44 من غير ما يزحزح التخطيط */
.linkbtn{font-family:inherit;font-size:13px;font-weight:600;color:var(--n62);background:0;border:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:12px 8px;margin:-12px -8px;border-radius:8px;min-height:44px}
.linkbtn:hover{color:var(--goldText)}
/* (ثيمات ٢٠٢٦-١٠-١١) «أو» كلمة بتتقري مش زخرفة ⇒ n62 (≈4.8:1) بدل n35 (≈2.3:1) */
.auth-or{display:flex;align-items:center;gap:10px;margin:16px 0;color:var(--n62);font-size:12.5px}
.auth-or::before,.auth-or::after{content:"";flex:1;height:1px;background:var(--border)}
.gbtn{width:100%;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:inherit;font-weight:600;font-size:14.5px;color:var(--navy);background:var(--white);border:1.5px solid var(--border);border-radius:12px;padding:12px 18px;cursor:pointer;transition:border-color var(--t-base),background var(--t-base),transform var(--t-fast)}
.gbtn:hover{border-color:var(--goldText);background:var(--cream)}
.gbtn:active{transform:scale(.985)}
.gbtn .gic{display:inline-flex;flex:none}
.auth-terms{font-size:12px;color:var(--n62);line-height:1.9;margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
/* صفحة الحساب */
.gate{max-width:460px;margin:24px auto;text-align:center}
.accrow{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--border)}
.accrow b{font-size:12.5px}
.chk{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--navy);cursor:pointer;padding:10px 0;min-height:44px;box-sizing:border-box;line-height:1.6}
.chk.big{font-weight:600;font-size:14px}
.chk input{width:19px;height:19px;accent-color:var(--goldText);cursor:pointer;flex:none}
.chks{display:flex;flex-wrap:wrap;gap:6px 18px}
.chk-k{font-weight:600;font-size:12.5px;color:var(--goldText);margin-bottom:4px}
/* زر حفظ الفرصة (في هيرو صفحة الفرصة) — بيظهر للمسجّلين بس */
.savebtn{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-weight:600;font-size:13px;color:var(--goldSoft);background:rgba(255,255,255,.06);border:1.5px solid rgba(200,169,107,.45);border-radius:12px;padding:12px 18px;cursor:pointer;transition:background .16s,border-color .16s,color .16s,transform .16s}
.savebtn:hover{border-color:var(--goldText);background:rgba(200,169,107,.14);transform:translateY(-1px)}
.savebtn.on{background:var(--gold);border-color:var(--goldText);color:var(--navy-k)}
.savebtn.err{border-color:var(--red);color:var(--red)}
.savebtn:disabled{opacity:.6;cursor:default}
.savebtn .ic{display:inline-flex;flex:none}
/* لينك المحفوظات في صفحة الحساب */
.savedlink{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:18px;padding:14px 16px;background:var(--white);text-decoration:none;color:var(--navy);margin-bottom:6px;transition:border-color .16s,transform .16s}
.savedlink:hover{border-color:var(--goldText);transform:translateY(-2px)}
.savedlink .ic{width:34px;height:34px;border-radius:50%;background:var(--cream);color:var(--goldText);display:flex;align-items:center;justify-content:center;flex:none}
.savedlink b{font-size:13px}
/* كارت في صفحة المحفوظات */
.saved-card .ft{display:flex;align-items:center;justify-content:space-between;gap:10px}
.unsavebtn{font-family:inherit;font-size:12.5px;font-weight:600;color:var(--n62);background:0;border:1px solid var(--border);border-radius:999px;padding:6px 12px;cursor:pointer;transition:color .16s,border-color .16s}
.unsavebtn:hover{color:var(--red);border-color:var(--red)}
.unsavebtn:disabled{opacity:.5}

/* دعوة إكمال البيانات — لطيفة مش إلزامية */
.nudge{display:block;background:linear-gradient(135deg,rgba(200,169,107,.13),rgba(200,169,107,.05));border:1px solid rgba(200,169,107,.4);border-radius:12px;padding:13px 15px;margin-bottom:12px}
.nudge b{display:block;font-size:13px;color:var(--navy);margin-bottom:5px}
.nudge span{display:block;font-size:12px;color:var(--n70);line-height:1.9}
.privacy-note{font-size:12.5px;color:var(--n62);line-height:1.9;margin-top:12px;padding-top:11px;border-top:1px solid var(--border)}
.conf-state{font-size:12.5px;font-weight:600;margin-top:8px}
.conf-state.ok{color:var(--green)}
.conf-state.pending{color:var(--amber)}
.acc-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.acc-actions .cta,.acc-actions .ghost{flex:1;min-width:150px;justify-content:center;margin:0}

/* ===== المشاركة (صفحة الفرصة) ===== */
.sharebox{display:flex;gap:10px;flex-wrap:wrap}
.shbtn{display:inline-flex;align-items:center;justify-content:center;gap:9px;flex:1;min-width:150px;min-height:50px;padding:13px 18px;line-height:1.2;border-radius:12px;border:1.5px solid var(--border);background:var(--white);color:var(--navy);font-family:inherit;font-weight:700;font-size:13px;cursor:pointer;text-decoration:none;transition:border-color .16s,color .16s,transform .16s,background .16s}
.shbtn:hover{transform:translateY(-1px)}
.shbtn:active{transform:scale(.985)}
.shbtn .ic{flex:none;display:grid;place-items:center;color:var(--n62);transition:color .16s}
.shbtn:hover .ic{color:inherit}
.shbtn.wa:hover{border-color:#25D366;color:var(--wa-tx)}
.shbtn.tg:hover{border-color:#2AABEE;color:var(--tg-tx)}
.shbtn.copy:hover,.shbtn.native:hover{border-color:var(--goldText);color:var(--goldText)}
.shbtn.copy.ok{border-color:var(--green);color:var(--green);background:color-mix(in srgb,var(--green) 7%,transparent)}
.shbtn.copy.ok .ic{color:var(--green)}

/* ===== واجهة فيديو يوتيوب — محلية بالكامل قبل التشغيل ===== */
.ytbox{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--border);background:var(--feature-bg, var(--navy-k));outline:1px solid var(--band-ring);outline-offset:-1px;aspect-ratio:16/9}
.ytfacade{position:absolute;inset:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border:0;cursor:pointer;font-family:inherit;background:var(--feature-bg, radial-gradient(120% 90% at 50% 0%,#123055 0%,var(--navy-k) 62%))}
.ytglow{position:absolute;inset:auto 50% -34% auto;transform:translateX(50%);width:min(76%,520px);height:190px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--gold) 30%,transparent),transparent);filter:blur(30px);pointer-events:none}
.ytplay{position:relative;width:66px;height:66px;display:grid;place-items:center;border-radius:50%;background:var(--gold);color:var(--navy-k);padding-inline-start:4px;box-shadow:0 12px 34px rgba(0,0,0,.34);transition:transform .18s}
.ytfacade:hover .ytplay{transform:scale(1.07)}
.ytfacade:active .ytplay{transform:scale(.97)}
.ytfacade:focus-visible{outline:2px solid var(--gold);outline-offset:-3px}
.ytlbl{position:relative;color:var(--cream-k);font-weight:700;font-size:13px;letter-spacing:.2px}
.ytbox.on{aspect-ratio:16/9;background:#000}
.ytbox iframe{display:block;width:100%;height:100%;border:0}
@media (prefers-reduced-motion:reduce){.ytfacade:hover .ytplay{transform:none}}

/* ربط تيليجرام (المرحلة ٤) */
.tgstate{font-size:12.5px;font-weight:700;padding:4px 11px;border-radius:999px;border:1px solid var(--border)}
.tgstate.on{color:var(--green);border-color:color-mix(in srgb,var(--green) 34%,transparent);background:color-mix(in srgb,var(--green) 8%,transparent)}
.tgstate.off{color:var(--n62)}
.tgcard .tgbtn{width:100%;justify-content:center;margin-top:14px}
.tgwait{display:flex;align-items:center;gap:11px;margin-top:14px;padding:13px 15px;border:1px dashed var(--gold);border-radius:12px;background:color-mix(in srgb,var(--gold) 6%,transparent);font-size:12.5px;line-height:1.8;color:rgba(7,20,38,.70)}
.tgwait .spin{flex:none;width:16px;height:16px;border:2px solid color-mix(in srgb,var(--gold) 30%,transparent);border-top-color:var(--goldText);border-radius:50%;animation:tgspin .8s linear infinite}
@keyframes tgspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.tgwait .spin{animation-duration:2.4s}}
.tgok{display:flex;align-items:center;gap:10px;margin-top:14px;padding:13px 15px;border:1px solid color-mix(in srgb,var(--green) 30%,transparent);border-radius:12px;background:color-mix(in srgb,var(--green) 7%,transparent);font-size:13px}
.tgok .ic{flex:none;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:var(--green-solid);color:#fff;font-size:12px;font-weight:700}
.tgacts{display:flex;gap:10px;flex-wrap:wrap}
.tgacts .ghost{flex:1;min-width:140px}
.ghost.danger:hover{border-color:var(--red);color:var(--red)}

/* CTA ختامي (نفس .season) */
.season{outline:1px solid var(--band-ring);outline-offset:-1px;background:var(--feature-bg, linear-gradient(135deg,#10243d,var(--navy-k)));border:1px solid rgba(200,169,107,.3);border-radius:18px;padding:22px;margin-top:30px;position:relative;overflow:hidden}
.season .k{font-weight:600;font-size:12.5px;color:var(--goldText);margin-bottom:6px}
.season h3{font-weight:600;font-size:18px;color:var(--beige-k);margin-bottom:6px}
.season p{font-size:13px;color:var(--cream70);line-height:1.8;margin-bottom:14px}
.season .btns{display:flex;gap:10px;flex-wrap:wrap}
.season .go{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:13px;color:var(--navy-k);background:var(--gold);padding:11px 18px;border-radius:12px;text-decoration:none}
.season .alt{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:13px;color:var(--goldSoft);border:1.5px solid rgba(200,169,107,.45);padding:11px 18px;border-radius:12px;text-decoration:none}

/* ===== طبقة الحركة (بتشتغل بس مع html.motion — بدون JS مفيش أي أثر) ===== */
/* شريط التقدّم الذهبي */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--goldSoft));transform:scaleX(0);transform-origin:right;z-index:60;pointer-events:none}
[dir="ltr"] .scroll-progress{transform-origin:left}
/* رسم خط عناوين الأقسام (transform بس) */
html.motion .sec-k::after{transform:scaleX(0);transform-origin:right;transition:transform .9s cubic-bezier(.2,.8,.2,1) .15s}
html.motion[dir="ltr"] .sec-k::after{transform-origin:left}
html.motion .sec-k.drawn::after{transform:scaleX(1)}
/* طبقات الضوء والجسيمات في الهيرو (بتتضاف بالـ JS) */
.hero-light{position:absolute;inset:-25%;z-index:1;pointer-events:none;background:radial-gradient(38% 30% at 72% 20%,rgba(200,169,107,.20),transparent 70%),radial-gradient(30% 26% at 18% 78%,rgba(226,207,166,.10),transparent 70%)}
.hero-dust{position:absolute;width:5px;height:5px;border-radius:50%;background:rgba(226,207,166,.85);box-shadow:0 0 9px 2px rgba(200,169,107,.45);z-index:1;pointer-events:none}
/* تلميحات أداء للطبقات المتحركة باستمرار */
html.motion-full .hero .bgimg,html.motion-full .hero-light{will-change:transform}
/* micro-interactions: رفع + ظل + لمعة ذهبية على hover (أجهزة hover بس، من غير JS) */
/* 🖱️ (الصقل Premium) micro-interactions — **الاستجابة للي بيتضغط بس**.
   قبل كده: `.card` و`.step` و`details.acc` و`.midimg` كانوا بيطلعوا 4px
   مع hover رغم إنهم **مش روابط** ⇒ وعد بضغطة مش موجودة (false affordance)،
   و«لمعة» ذهبية بتعدّي عرض كل كارت في 0.8s ⇒ استعراض بيشتّت عن المحتوى.
   دلوقتي: العناصر القابلة للضغط بس، رفعة 2px، وظلّ بيتغيّر فعلًا من
   `sh-1` لـ`sh-2` (قبل كده كان `sh-2` ⇐ `sh-2` = صفر feedback). */
@media (hover:hover) and (pointer:fine){
  .opp,.guide,.botcard,.toolcard,.ocard{transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out),border-color var(--t-base)}
  .opp:hover,.guide:hover,.botcard:hover,.toolcard:hover{transform:translateY(-2px);box-shadow:var(--sh-3);border-color:rgba(200,169,107,.55)}
  .ocard:hover{border-color:rgba(200,169,107,.55);box-shadow:var(--sh-2)}
  /* الكروت غير القابلة للضغط: تغيّر حدّ خفيف بس — تلميح إنها سطح، مش زر */
  .card,.step,details.acc,.midimg{transition:border-color var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out)}
  .chip{transition:transform var(--t-fast) var(--ease-out),border-color var(--t-fast),background var(--t-fast)}
  .chip:hover{border-color:var(--goldText);background:var(--cream)}
}

/* ===== انعكاسات LTR للنسخة الإنجليزية (الخصائص الفيزيائية بس) =====
   ✅ (الصقل Premium) انعكاسات `.deadline` و`.note` اتشالت من هنا — بقت
   `border-inline-start` في قاعدتها الأصلية، فبتشتغل في الاتجاهين بلا نسخة. */
[dir="ltr"] details.acc summary .ar{margin-right:0;margin-left:auto}

/* ===== الفوتر والتوقيع (نفس .sig) ===== */
footer{border-top:1px solid var(--border);margin-top:var(--sec-gap);padding:36px 0 40px;text-align:center}
.sig .nm{font-weight:600;font-size:15px;color:var(--navy)}
.sig .ath{font-weight:600;font-size:12.5px;color:var(--goldText);letter-spacing:1px;margin-top:2px}
.sig .dv{width:42px;height:2px;background:var(--gold);margin:8px auto;border-radius:4px;position:relative}
.sig .dv::after{content:"\25C6";position:absolute;top:-8px;left:50%;transform:translateX(-50%);color:var(--goldText);font-size:8px}
.sig .mt{font-weight:600;font-size:12.5px;color:var(--goldText)}
footer .socials{display:flex;justify-content:center;gap:12px;margin-top:20px}
footer .socials a{width:44px;height:44px;/* (P2-15) كانت 38 — تحت هدف اللمس */border:1.5px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--navy);transition:color .18s,border-color .18s,transform .18s ease}
footer .socials a svg{width:17px;height:17px}
footer .socials a:hover{color:var(--goldText);border-color:var(--goldText);transform:translateY(-2px)}
/* أصغر خط في الموقع كان بأطول سطر (١٠٨ حرف) — أسوأ تركيبة ممكنة.
   والحجم اترفع لـ١٢px والتباين لـn70: n55 على البيج = 4.04 (المطلوب 4.5). */
footer .fine{font-size:12.5px;color:var(--n70);margin-top:16px;line-height:1.85;max-width:60ch;margin-inline:auto}
footer .fine a{color:var(--n62)}
footer .fine.credits{font-size:11px;color:var(--n35);margin-top:6px}
footer .fine.credits a{color:var(--n35)}

/* ═══ ✉️ لوحة «تواصل مع أثر» — أول الفوتر (src/contact.mjs) ═══
   كارت أبيض بنفس لغة .card (حدود/radius/ظل --sh-1)، مقسوم لمسارين:
   التواصل (أبيض) ⟂ مساعدة الطالب (كريمي + فاصل ذهبي) — الفصل بيتشاف قبل ما يتقرا. */
footer .cpanel{text-align:start;background:var(--white);border:1px solid var(--border);border-radius:18px;box-shadow:var(--sh-2);overflow:hidden;margin:0 0 36px}
.cpanel-in{display:grid;grid-template-columns:1fr}
.cp-contact,.cp-help{padding:24px 20px;min-width:0}
.cp-title{font-size:21px;font-weight:700;line-height:1.45;color:var(--navy);display:flex;align-items:center;gap:10px}
.cp-title::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--gold);flex:none}
.cp-lead{font-size:14.5px;color:var(--n70);line-height:1.85;margin-top:6px;max-width:46ch}
.cp-mail{margin-top:14px;font-size:13.5px;color:var(--n62);line-height:1.7;display:flex;flex-wrap:wrap;align-items:center;column-gap:8px}
.cp-mail-a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-size:15.5px;color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:1.5px;text-underline-offset:5px;unicode-bidi:isolate;overflow-wrap:anywhere;transition:color var(--t-base)}
.cp-mail-a:hover{color:var(--goldText)}
.cp-open{margin-top:10px}
.cp-open[aria-expanded="true"]{display:none}
.cp-form{margin-top:16px}
.cp-form .fld{margin-bottom:14px}
.cp-form textarea{min-height:132px}
.cp-send{width:100%}
.cp-send[disabled]{opacity:.7;cursor:progress}
.cp-msg{margin:0 0 14px}
.cp-hp{position:absolute;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}
.cp-help{background:var(--cream);border-top:1px solid rgba(200,169,107,.45)}
.cp-help-title{font-size:16px;font-weight:700;line-height:1.55;color:var(--navy)}
.cp-help p{font-size:14px;color:var(--n70);line-height:1.85;margin-top:6px}
.cp-help-cta{margin-top:16px}
@media(min-width:760px){
  .cpanel-in{grid-template-columns:1.35fr 1fr}
  .cp-contact,.cp-help{padding:30px 32px}
  .cp-help{border-top:0;border-inline-start:1px solid rgba(200,169,107,.45);display:flex;flex-direction:column;justify-content:flex-start}
  .cp-help-cta{align-self:flex-start}
}

/* ═══════════════════════════════════════════════════════════════
   الرئيسية الجديدة (HOME_V2)
   ═══════════════════════════════════════════════════════════════ */

/* الهيرو: نسختا العنوان — الطويلة للشاشات، القصيرة للموبايل */
/* 🅰️ الجزء اللي بيختفي على الموبايل — العنوان نفسه واحد. (P1-02) */
.h1-drop{display:inline}
.hero-v2 .hero-note{margin-top:12px;font-size:12.5px;line-height:1.9;color:var(--n62);border-inline-start:2px solid var(--gold);padding-inline-start:11px;max-width:60ch}
/* عدّادات الهيرو + سطر «من غير رفع» + باب التسجيل تحت الأدوات */
.herostats{display:flex;gap:26px;flex-wrap:wrap;margin:18px 0 4px}
.herostats .hs{display:flex;flex-direction:column;line-height:1.05}
.herostats .hs b{font-size:32px;font-weight:800;color:var(--goldText)}
.herostats .hs span{font-size:12.5px;color:var(--cream-k);opacity:.9;margin-top:5px}
.hero-noupload{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);padding:9px 15px;border-radius:999px;margin:10px 0 2px}
.tool-signup{margin-top:14px;font-size:13px;color:var(--navy);opacity:.92}
.tool-signup a{color:var(--goldText);font-weight:700}
/* إجمالي الفرص الموثّق (من قاعدة البيانات) + سطر توضيح الازدواج */
.opps-total{display:flex;align-items:baseline;gap:9px;margin:10px 0 2px}
.opps-total b{font-size:38px;font-weight:800;color:var(--goldText);line-height:1}
.opps-total span{font-size:15px;font-weight:600;color:var(--navy)}
.opps-note{font-size:12.5px;line-height:1.8;color:var(--n62);margin:0 0 16px;max-width:62ch}
/* شارة تاريخ صغيرة داخل كارت القايمة */
/* 🏷️ (الصقل Premium) سطر الحالة: كان **كبسولة ملوّنة** فوق كبسولة
   العدّاد مباشرةً — شريحتين بنفس الشكل ونفس التاريخ واحدة تحت التانية.
   دلوقتي سطر نصّي بنقطة حالة ملوّنة: الحالة بتتقري كسطر، والعدّاد
   هو الكبسولة الوحيدة في الكارت. صفر كلمة اتشالت.
   (النقطة `currentColor` فبتاخد لون الحالة من غير توكن جديد.) */
.ocard-dt{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;margin-top:8px;color:var(--n62);align-self:flex-start;line-height:1.6}
.ocard-dt::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none;opacity:.85}
.ocard-dt.dt-closed{color:var(--red)}
.ocard-dt.dt-open{color:var(--green)}
.ocard-dt.dt-soon{color:var(--red)}
.ocard-dt.dt-soonopen{color:var(--gold-tx)}
/* 🗓️ مواعيد الموسم المنظَّمة (src/season.mjs) — إغلاق لكل مسار + سطر ملاحظة تحت الشارة */
.strk{list-style:none;margin:6px 0 0;padding:0;font-size:12.5px;line-height:1.7;color:var(--n70)}
.strk li b{color:var(--navy);font-weight:700}
.strk-note{display:block;font-size:12px;line-height:1.6;color:var(--n62);margin-top:4px}
.season-tbl caption{caption-side:top;text-align:start;font-weight:700;color:var(--navy);font-size:13px;padding:0 2px 6px}
.season-tbl small{color:var(--n62)}
[dir=ltr] .season-tbl .od-tbl th{text-align:left}
.season-src{font-size:12.5px;line-height:1.8;color:var(--n62);margin:8px 0 0}
.season-src a{white-space:nowrap}
/* ═══ 🔁 إزالة التكرار الحرفي في كروت الفرص (الصقل Premium) ═══
   القياس على الرئيسية وصفحة القوايم: كل كارت بيعرض نفس المعلومة مرتين.

     ● باقي ٦ أيام                              ← سطر الحالة
     [ باقي ٦ أيام على القفل │ ٢١ سبتمبر ٢٠٢٦ ]  ← كبسولة العدّاد

   دي مش «معلومة زيادة» — دي نفس الجملة مكتوبة مرتين فوق بعض، وبتخلّي
   العين تقراها مرتين قبل ما توصل للي بعدها.

   القاعدة هنا بتشيل **التكرار بس**، ومابتشيلش ولا كلمة فريدة:
     ١. سطر حالة فيه كلمة حالة («مفتوحة · يقفل ١ أكتوبر») + كبسولة
        ⇒ الكبسولة بتسيب **التاريخ** للسطر وتحتفظ بـ«باقي كام يوم».
     ٢. سطر الحالة نفسه هو عدّاد (`dt-soon` = «باقي ٦ أيام») + كبسولة
        ⇒ **السطر** هو اللي يختفي، لأن الكبسولة نصّها أطول وفيه التاريخ
           كمان — يعني مجموعة أكبر، مش أصغر.
   ⚠️ في الحالتين المحصّلة النهائية **نفس عدد المعلومات** أو أكتر.
   ولو المتصفح ما بيدعمش `:has()` بيرجع للسلوك القديم — تحسين بس. */
.ocard:has(.ocard-dt:not(.dt-soon)) .cd .sep,
.ocard:has(.ocard-dt:not(.dt-soon)) .cd .dt{display:none}
.ocard .ocard-dt.dt-soon:has(+ .cd){display:none}

.opp:has(> .dt:not(.dt-soon)) > .cd .sep,
.opp:has(> .dt:not(.dt-soon)) > .cd .dt{display:none}
.opp > .dt.dt-soon:has(+ .cd){display:none}
/* بلوك «الموسم اللي فات» في الصفحة التفصيلية */
.seasonpast{display:flex;gap:12px;align-items:flex-start;background:var(--cream);border:1px solid var(--border);border-inline-start:3px solid var(--gold);border-radius:12px;padding:14px 16px;margin:16px 0}
.seasonpast .ic{font-size:21px;line-height:1.35;flex:none}
.seasonpast>div>b{display:block;font-size:14px;margin-bottom:5px;color:var(--navy)}
.seasonpast p{font-size:13px;line-height:1.9;color:var(--n62);margin:0 0 11px}
.seasonpast .cta{display:inline-block;font-size:13px;padding:9px 18px}
/* شاشة مراجعة التواريخ (لوحة الأدمن) */
.dtbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin:10px 0 12px}
.dtrow{display:block}
.dt-h{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:5px}
.dt-tag{font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;background:var(--cream);color:var(--n62)}
.dt-tag.page{background:rgba(200,169,107,.2);color:var(--gold-tx)}
.dt-tag.c-high{background:rgba(10,125,77,.12);color:var(--green)}
.dt-tag.c-medium{background:rgba(200,169,107,.18);color:var(--gold-tx)}
.dt-tag.c-low{background:rgba(214,40,57,.09);color:var(--red)}
.dt-tag.conflict{background:var(--red-solid);color:#fff}
.dt-conflict{font-size:12.5px;line-height:1.9;background:rgba(214,40,57,.08);border:1px solid rgba(214,40,57,.3);border-radius:8px;padding:8px 11px;margin:6px 0;color:var(--red)}
.dt-conflict b{color:var(--navy)}
.tutorfold{margin:6px 0 4px}
/* هدف اللمس: كان ٣٢px. */
.tutorfold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:44px;border-radius:10px;transition:background var(--t-base)}
.tutorfold>summary:hover{background:var(--soft2)}
.tutorfold>summary::-webkit-details-marker{display:none}
.tutorfold>summary h2{margin:0}
.tutorfold>summary .ar{margin-inline-start:auto;color:var(--goldText);font-size:18px;transition:transform .2s}
.tutorfold[open]>summary .ar{transform:rotate(180deg)}
.agegate{width:100%;border-collapse:collapse;margin:10px 0 12px;font-size:13px}
.agegate th{text-align:right;font-size:12.5px;color:var(--n62);font-weight:600;padding:5px 8px;border-bottom:1px solid var(--line)}
.agegate td{padding:7px 8px;border-bottom:1px solid var(--line);line-height:1.7;vertical-align:top}
.agegate td:nth-child(2){white-space:nowrap;color:var(--green);font-size:14px}
.agegate tr:last-child td{border-bottom:0}
@media(max-width:560px){.agegate{font-size:12px}.agegate th:last-child,.agegate td:last-child{font-size:12.5px}}
.minlist{display:flex;gap:11px;align-items:flex-start;margin:16px 0 4px;padding:13px 16px;border-radius:12px;
  background:linear-gradient(135deg,rgba(10,125,77,.10),rgba(200,169,107,.13));border:1px solid rgba(10,125,77,.32)}
.minlist .ic{font-size:18px;line-height:1.35;flex:0 0 auto}
.minlist>div>b{display:block;font-size:15px;color:var(--green);line-height:1.6}
.minlist p{font-size:14px;color:var(--n62);line-height:1.8;margin:4px 0 6px;max-width:var(--measure)}
.minlist a{font-size:12.5px;font-weight:600;color:var(--navy);text-decoration:underline;text-underline-offset:3px}
@media(max-width:520px){.minlist{padding:11px 13px}.minlist b{font-size:13px}}

/* ===== 🌍 أهلية الطلاب الدوليين (المرحلة E1) =====================================
 * ⚠️ الأحمر محجوز للتحذيرات والمواعيد — ممنوع هنا. ومفيش ألوان هوية جديدة:
 *    الأخضر للمؤكَّد الحالي، والذهبي/العنبري للتاريخي وغير المحسوم، والرمادي للباقي.
 * المؤشّر على الكارت سطر واحد صغير تحت الشارة — مايزاحمش الموعد ولا الحالة. */
/* ⚠️ ألوان المؤشّر **أغمق** من التوكنات العامة عمدًا: الخط 10.5px = «نص عادي» في
 *    WCAG، فيحتاج تباينًا ≥4.5. قياس alpha-composited أعطى: amber 4.24 · n55 4.01
 *    (تحت الحدّ)، فثُبّت هنا محليًّا #8a5f00 (5.10) وnavy .66 (5.78) — بلا مساس
 *    بـ--amber/--n55 العامَّين المستعملَين في مكوّنات أخرى.
 * 🎯 الأساس = **سطر وصفي هادئ** (بلا خلفية ولا إطار): 119 من 122 كارتًا تقول
 *    «ليست مؤكّدة حاليًّا»، فإعطاؤها شكل شارة يبتلع الإشارة. الحبّة البارزة
 *    محجوزة لـ`oelig-cur` وحده — ٣ كروت فقط. */
.oelig{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;max-width:100%;
  font-size:12px;line-height:1.7;font-weight:600;color:var(--n66);
  background:none;border:0;border-radius:0;padding:1px 0}
.oelig .d{width:5px;height:5px;border-radius:50%;background:currentColor;flex:0 0 auto;opacity:.55}
/* الحالة الحاضرة المؤكَّدة — الوحيدة التي تبقى حبّة */
.oelig.oelig-cur{font-weight:700;color:var(--green);background:rgba(10,125,77,.09);
  border:1px solid rgba(10,125,77,.30);border-radius:999px;padding:2px 9px}
.oelig.oelig-cur .d{opacity:1}
/* تمييز خفيف داخل السطر الهادئ: نقطة عنبرية لِما له دليل، ورمادية لِما لا دليل له */
.oelig-meta.e-confirmed-historical .d,
.oelig-meta.e-evidence-found-scope-unclear .d{background:#8a5f00;opacity:.7}
/* 🏛️ محسومة بقائمة الوزارة — إيجابية، بس سطر هادئ لا حبّة: دي حالة **الأغلبية**
   (١٢٤ من ١٣٣)، ولو أخدت شكل الشارة هتبلع إشارة «أكّدها المنظِّم للنسخة الحالية».
   نقطة خضراء بتفرّقها عن العنبري (تاريخي/غير محسوم) من غير ما تنافسه بصريًّا. */
.oelig-meta.e-confirmed-by-ministry-list{color:var(--n72)}
.oelig-meta.e-confirmed-by-ministry-list .d{background:var(--green);opacity:.8}
.ocard.soon .oelig{opacity:.92}

/* قسم صفحة الفرصة — بنفس نمط .minlist/.deadline */
.elig{display:flex;gap:11px;align-items:flex-start;margin:14px 0 4px;padding:13px 16px;border-radius:12px;
  background:var(--soft);border:1px solid var(--border)}
.elig .ic{font-size:18px;line-height:1.35;flex:0 0 auto}
.elig>div>b{display:block;font-size:15px;color:var(--navy);line-height:1.6}
.elig p{font-size:14px;color:var(--n70);line-height:1.85;margin:4px 0 0;max-width:var(--measure)}
.elig.e-confirmed-current{background:rgba(10,125,77,.07);border-color:rgba(10,125,77,.28)}
.elig.e-confirmed-current b{color:var(--green)}
.elig.e-confirmed-historical{background:rgba(154,107,0,.06);border-color:rgba(154,107,0,.26)}
.elig.e-confirmed-historical b{color:var(--amber)}
.elig.e-confirmed-by-ministry-list{background:rgba(10,125,77,.045);border-color:rgba(10,125,77,.22)}
.elig.e-confirmed-by-ministry-list b{color:var(--green)}
.elig.e-evidence-found-scope-unclear{border-color:rgba(154,107,0,.22)}
.elig.e-track-specific{border-color:rgba(200,169,107,.42)}
.elig-src{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:6px;font-size:12px;color:var(--n62)}
.elig-src a{font-weight:700;color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.elig-tr{margin-top:9px;padding-top:8px;border-top:1px dashed var(--border)}
.elig-trk{display:block;font-size:12.5px;color:var(--n70);line-height:1.7;word-break:break-word}
@media(max-width:520px){.elig{padding:11px 13px}.elig b{font-size:13px}.oelig{font-size:11px;padding:2px 8px}}
.dt-tag.stale{background:#6b4d16;color:#fff}
.dt-tag.generic{background:rgba(107,77,22,.16);color:var(--gold-tx2)}
.dt-stale{font-size:12.5px;line-height:1.9;background:rgba(107,77,22,.09);border:1px solid rgba(107,77,22,.32);border-radius:8px;padding:8px 11px;margin:6px 0;color:var(--gold-tx2)}
.dt-generic{font-size:12.5px;line-height:1.9;background:var(--cream);border:1px dashed rgba(107,77,22,.4);border-radius:8px;padding:8px 11px;margin:6px 0;color:var(--gold-tx2)}
.dtparked{margin-top:18px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--cream)}
.dtparked>summary{cursor:pointer;font-weight:600;font-size:13px;color:var(--n62)}
.dtparked>.note{margin:8px 0}
.dt-v{font-size:13px;margin:3px 0}
.dt-cur{font-size:12px;color:var(--n62)}
.dt-ev{font-size:12.5px;line-height:1.9;color:var(--navy);background:var(--cream);border-radius:8px;padding:7px 10px;margin:6px 0}
.dt-src{font-size:12px;color:var(--n62);display:flex;gap:10px;flex-wrap:wrap}
.dt-src a{color:var(--goldText);font-weight:700}
.dt-warn{color:var(--red);font-weight:700}
.dt-acts{display:flex;gap:8px;margin-top:9px}
.dt-acts .hb.ok{border-color:var(--green);color:var(--green)}
.dt-acts .hb[disabled]{opacity:.45;cursor:not-allowed}
/* بلوك الأهلية البارز في صفحة الفرصة */
.note.tip.elig{border-inline-start-width:4px;padding:15px 17px}
.note.tip.elig>b{display:block;font-size:14px;margin-bottom:8px;color:var(--navy)}
.eligtx a{color:var(--goldText);font-weight:700}
.note.tip.hintbox>b{display:block;font-size:14px;margin-bottom:6px;color:var(--navy)}
.hintline{font-size:13px;line-height:1.9;color:var(--n62)}
.hintline b{color:var(--navy)}
/* مستكشف الفرص — بحث فوري + تبويبات مرحلة */
.oppsearch{position:relative;margin:0 0 18px}
/* 🔎 (الصقل Premium) الأيقونة كانت `top:13px` ثابتة — أي تغيير في ارتفاع
   الحقل بيفكّها عن المنتصف. توسيط حقيقي بدل رقم سحري. */
.oppsearch-ic{position:absolute;inset-inline-start:15px;top:50%;transform:translateY(-50%);color:var(--n62);pointer-events:none;display:inline-flex;transition:color var(--t-base)}
.oppsearch:focus-within .oppsearch-ic{color:var(--goldText)}
.oppsearch input,.opps-search-home input{width:100%;font:inherit;font-size:15px;min-height:50px;padding:13px 16px;padding-inline-start:46px;border:1.5px solid var(--line,var(--border-warm));border-radius:14px;background:var(--cream);color:var(--navy);transition:border-color var(--t-base),box-shadow var(--t-base),background var(--t-base)}
.oppsearch input::placeholder,.opps-search-home input::placeholder{color:var(--n55)}
.oppsearch input:hover,.opps-search-home input:hover{border-color:rgba(200,169,107,.55)}
.oppsearch input:focus,.opps-search-home input:focus{outline:none;border-color:var(--goldText);background:var(--white);box-shadow:0 0 0 3px rgba(200,169,107,.18)}
.opptabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
/* 🎚️ (الصقل Premium) التبويبات كان مالهاش hover خالص — الشريحة بتتحوّل
   من «ساكنة» لـ«مختارة» من غير أي رد فعل في النص. دلوقتي فيه رد فورّي
   (`--t-fast`) على الحد والخلفية، والمختارة ليها ظلّ خفيف بيرفعها. */
.opptab{font:inherit;font-size:13.5px;font-weight:600;padding:12px 17px;border-radius:999px;border:1.5px solid var(--line,var(--border-warm));background:transparent;color:var(--navy);cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast),color var(--t-fast),box-shadow var(--t-base)}
.opptab:hover{border-color:var(--gold);background:var(--cream)}
.opptab.active{background:var(--navy);color:var(--white);border-color:var(--navy);box-shadow:var(--sh-2)}
.opptab.active:hover{background:var(--navy2);border-color:var(--navy2)}
.opptab:active{transform:scale(.97)}
/* 🌍 فلتر مستقلّ (AND) بجانب تبويبات المرحلة — نفس شكل الشريحة، ووزن أخفّ
 *    عمدًا حتى لا يُقرأ كتبويب مرحلة خامس. الأخضر فقط عند التفعيل. */
.oppfilters{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.oppfilter{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:12.5px;font-weight:600;
  padding:12px 14px;border-radius:999px;border:1.5px dashed var(--line,var(--border-warm));background:transparent;
  color:var(--n70);cursor:pointer}
.oppfilter .d{width:7px;height:7px;border-radius:50%;border:1.5px solid currentColor;flex:0 0 auto}
.oppfilter:hover{border-color:var(--goldText)}
.oppfilter.on{background:rgba(10,125,77,.10);border-style:solid;border-color:rgba(10,125,77,.45);color:var(--ok-tx)}
.oppfilter.on .d{background:currentColor;border-color:currentColor}
.oppcount{font-size:13px;color:var(--n62);margin:0 0 10px}
.ocard.is-hidden{display:none}
.oppnores{text-align:center;padding:22px 12px;color:var(--n62)}
.oppnores .hint{font-size:13px;margin-top:6px}
.oppnores button{font:inherit;color:var(--goldText);font-weight:700;background:none;border:none;cursor:pointer;text-decoration:underline;padding:0}
/* بحث الرئيسية المصغّر — form بسيط بيودّي لصفحة الفرص بالنتيجة */
.opps-search-home{position:relative;display:flex;gap:8px;margin:2px 0 18px;align-items:center}
.opps-search-home .oppsearch-ic{top:50%;transform:translateY(-50%)}
.opps-search-home input{flex:1}
.opps-search-home button{font:inherit;font-weight:600;font-size:14px;padding:12px 20px;border-radius:12px;border:none;background:var(--gold);color:var(--navy-k);cursor:pointer;white-space:nowrap}

/* شارة التخصص على كروت الفرص — هادية بهوية الموقع */
.fchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.fchips span{font-size:12px;font-weight:600;letter-spacing:.2px;color:var(--n62);background:color-mix(in srgb,var(--navy) 4%,transparent);border:1px solid var(--border);border-radius:999px;padding:3px 9px;line-height:1.7}

/* «مين أنا» — التعريف المختصر بعد الهيرو */
.whoami{display:grid;gap:22px;align-items:start}
.whoami.has-photo{grid-template-columns:200px 1fr}
.whoami .ph{width:100%;aspect-ratio:1;object-fit:cover;border-radius:18px;border:2px solid var(--gold);box-shadow:var(--sh-2)}
.wintro{font-size:15px;font-weight:700;color:var(--navy);line-height:1.9;margin-bottom:14px}
.wpt{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--border)}
.wpt:first-of-type{border-top:0;padding-top:0}
.wpt .i{flex:none;font-size:17px;line-height:1.5}
.wpt .t{display:flex;flex-direction:column;gap:3px}
.wpt .t b{font-size:13px;color:var(--navy)}
.wpt .t span{font-size:12.5px;line-height:1.9;color:var(--n70)}
.wmore{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-size:12.5px;font-weight:700;color:var(--goldText);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .16s}
.wmore::after{content:"↓";font-size:12px}
.wmore:hover{border-bottom-color:var(--goldText)}

/* كارت الحساب */
.acctcard{background:var(--white);border:1px solid var(--border);border-radius:18px;padding:24px;box-shadow:var(--sh-1)}
.apt{display:flex;gap:14px;align-items:flex-start;padding:15px 0;border-top:1px solid var(--border)}
.apt:first-of-type{border-top:0;padding-top:0}
.apt .i{flex:none;font-size:18px;line-height:1.5}
.apt .t{display:flex;flex-direction:column;gap:3px}
.apt .t b{font-size:15px;color:var(--navy);line-height:1.55}
.apt .t span{font-size:14px;line-height:1.8;color:var(--n70);max-width:var(--measure)}
.abtns{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.abtns .cta,.abtns .ghost{flex:1;min-width:150px;justify-content:center;margin:0}

@media (max-width:720px){
  /* ✂️ تقصير عنوان الرئيسية على الموبايل — **عربي بس**.
     🔴 اتكشف بالقياس على `/ru/`: القاعدة كانت بتشتغل على التلات لغات،
        فالعنوان الروسي «Обучение в России — без обещаний…» بيتحوّل لـ
        «России — без обещаний…» — ده حرفيًا حالة إضافة/حرف جر من غير
        حرف الجر، يعني **جملة مكسورة نحويًا** مش عنوان مختصر.
        (بالعربي «روسيا — ما بوعدكش» شظيّة سليمة، فالقرار العربي صح.)
     الإصلاح نطاق مش محتوى: كل لغة بتعرض عنوانها الكامل زي ما اتكتب. */
  html[lang="ar"] .h1-drop{display:none}
  /* 🧹 (الصقل Premium) القواعد التلاتة اللي كانت هنا (`grid-template-columns:1fr`
     و`.ph{width:150px}` و`.wintro{text-align:center}`) بقت **ميتة جزئيًا**:
     تحديث «الرئيسية V3» بيعيد تعريف `.whoami.has-photo` بصورة 96px في
     عمودين بعد الكتلة دي، فالعمودين بيكسبوا — لكن `text-align:center`
     كان فاضل شغّال وحده، فالسطر التعريفي بيتوسّط جنب صورة وقائمة
     محاذاتها للبداية. المحاذاة بقت متسقة، والقواعد الميتة اتشالت. */
}

/* لمعة واحدة على الجزء الذهبي في هيرو الرئيسية الجديدة (دسكتوب بس — motion.js
   بيضيف .go وقت التشغيل، والموبايل ما بيوصلش للكلاس ده أصلًا) */
.hero-v2 h1 .g.shimmer-once{background-image:linear-gradient(100deg,transparent 38%,rgba(255,255,255,.55) 50%,transparent 62%);background-size:220% 100%;background-position:220% 0;-webkit-background-clip:text;background-clip:text}
.hero-v2 h1 .g.shimmer-once.go{transition:background-position 1s ease-out;background-position:-40% 0}

/* ═══════════════════════════════════════════════════════════════
   الرئيسية V3 — الإيقاع والصور والحجم
   المبدأ: الفخامة في المساحات الفاضية، مش في الحشو.
   ═══════════════════════════════════════════════════════════════ */

/* الأقسام العريضة بتتكتب **برّه** .wrap في الماركب — مش بحيلة margin/100vw.
   السبب: 100vw بيحسب عرض السكرول بار، فبيطلع القسم مزحزح وفيه فجوة على
   الجنب. الخروج من الـ wrapper بيدي عرض كامل حقيقي في كل المتصفحات. */
.numsec .inr,.quoteband blockquote{padding-inline:18px}

/* ── ① الهيرو: الشاشة الأولى كاملة ── */
.hero-v2{--ov-rgb:7,20,38;outline:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:64px 34px 74px;border-radius:24px}
.hero-v2 h1{font-size:clamp(34px,6.2vw,64px);line-height:1.24;letter-spacing:-.5px;margin-bottom:20px;max-width:17ch}
.hero-v2 p.lead{font-size:clamp(14.5px,1.5vw,16.5px);max-width:52ch}
.hero-v2 .btns{margin-top:28px}
/* مؤشر النزول — بيقول «فيه محتوى تحت» */
.scrollcue{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);width:1px;height:34px;overflow:hidden;z-index:2}
.scrollcue .ln{display:block;width:1px;height:34px;background:linear-gradient(var(--gold),transparent);animation:cue 2.1s ease-in-out infinite}
@keyframes cue{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}
@media (prefers-reduced-motion:reduce){.scrollcue .ln{animation:none;opacity:.5}}

/* ── ② مين أنا: صورة دائرية صغيرة جوه شريط ── */
.whoami.has-photo{grid-template-columns:96px 1fr;gap:20px;align-items:start}
.whoami .ph{width:96px;height:96px;border-radius:50%;object-fit:cover;border:0;box-shadow:var(--sh-2)}

/* ── ③ الأرقام: تدرّج كحلي خالص، أرقام ضخمة ذهبية ── */
/* 📐 (الصقل Premium) الأقسام العريضة كانت بتاخد 44 و48 و36 — والباقي
   بياخد `--sec-gap`. القيمة واحدة دلوقتي في الموقع كله. */
.numsec{box-shadow:inset 0 1px 0 var(--band-edge),inset 0 -1px 0 var(--band-edge);background:var(--feature-band, linear-gradient(160deg,#0b1e35 0%,var(--navy-k) 52%,#050f1c 100%));color:var(--cream-k);padding:64px 18px;margin-top:var(--sec-gap)}
.numsec .inr{max-width:820px;margin:0 auto;text-align:center}
.numsec .k{font-size:12.5px;font-weight:700;letter-spacing:1.6px;color:var(--goldText);text-transform:uppercase;margin-bottom:30px}
.numsec .ns{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.numsec .n1 b{display:block;font-family:Inter,system-ui,sans-serif;font-size:clamp(40px,7vw,72px);font-weight:800;line-height:1;color:var(--goldText);letter-spacing:-2px}
.numsec .n1 .l{display:block;margin-top:10px;font-size:14px;font-weight:800;color:var(--cream-k)}
.numsec .n1 small{display:block;margin-top:5px;font-size:12.5px;line-height:1.8;color:var(--cream45)}
.numsec .nnote{margin-top:32px;padding-top:20px;border-top:1px solid rgba(239,230,214,.14);font-size:12px;line-height:1.9;color:var(--cream45);max-width:56ch;margin-inline:auto}

/* ── ④ كروت الفرص بصور ── */
.opp.has-img{padding:0;overflow:hidden;display:flex;flex-direction:column}
/* ═══ معالجة أغلفة الكروت الموحّدة ═══
   🔴 المشكلة: الصور مصادرها مختلفة (مبنى ليلي · مدينة نهارية · واجهة جامعة)،
      فالكروت كانت باينة **صور عشوائية** مش نظام واحد — حتى وهي كلها بنفس النسبة.
   الحل في الكود (مش في الصور): **نفس القص** + **نفس التدرّج من تحت** +
   **نفس تهدئة التشبّع** — فالعين بتقراهم كمجموعة، والصورة تفضل مميّزة لفرصتها.
   ⚠️ التدرّج خفيف (بيبدأ من ٥٥٪ لتحت) عشان الصورة تفضل واضحة — ده كارت
      مش هيرو، والنص مش فوق الصورة أصلًا فمافيش شرط تباين هنا. */
.opp.has-img .thumb{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--navy-k)}
.opp.has-img .thumb img{width:100%;height:100%;object-fit:cover;object-position:center 45%;display:block;
  filter:saturate(.80);transition:transform .5s ease}
/* 🔴 الطبقة الكحلية **على الصورة كلها** — والسبب مقاس مش ذوق:
     `saturate()` فلتر **ضربي** — بيكبّر أو يصغّر كل صورة بنسبتها، فالفرق
     بينهم **بيفضل زي ما هو**. والتدرّج القديم كان من ٥٥٪ لتحت بس، يعني
     **أعلى نص الصورة كان بإضاءته الأصلية بالكامل**.
     القياس على الخمس أغلفة المميّزة: الإضاءة كانت **٩٣ → ١٥٤** (فرق ٦٠ من
     ٢٥٥)، والتشبّع **٠.١٢ → ٠.٢٨** (أكتر من الضعف). فالكروت كانت فعلًا
     شكلها صور عشوائية.
     الطبقة الموحّدة **بتضغط المدى**: الفرق بيبقى (1-α) × الأصلي.
     α≈٠.٤٥ ⇒ الفرق **٦٠ ← ٣٣**، والصور فاضلة واضحة (٦٠–٩٣ إضاءة).
     ⚠️ زيادة α فوق ٠.٦ بتوحّد أكتر بس بتطفّي الصورة — جرّبناها وطلعت غامقة. */
.opp.has-img .thumb::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,20,38,.42) 0%,rgba(7,20,38,.44) 55%,rgba(7,20,38,.54) 100%)}
.opp.has-img:hover .thumb img{transform:scale(1.045);opacity:1}
.opp.has-img>.badge{position:absolute;top:12px;inset-inline-start:12px;z-index:2;background:var(--gold);color:var(--navy-k);box-shadow:0 6px 18px -8px rgba(0,0,0,.6)}
.opp.has-img>h3,.opp.has-img>.meta,.opp.has-img>.fchips,.opp.has-img>.ft{margin-inline:18px}
.opp.has-img>h3{margin-top:16px;font-size:17px}
.opp.has-img>.ft{margin-bottom:16px;margin-top:auto;padding-top:12px}

/* ── ⑤ شريط الاقتباس ── */
.quoteband{position:relative;margin:var(--sec-gap) 0;min-height:340px;display:grid;place-items:center;overflow:hidden}
.quoteband img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.quoteband .ov{position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--ov-rgb),.86),rgba(var(--ov-rgb),.72))}
.quoteband blockquote{position:relative;z-index:2;max-width:640px;padding:56px 26px;text-align:center}
.quoteband p{font-size:clamp(19px,3vw,28px);line-height:1.7;color:var(--cream-k);font-weight:700}
.quoteband cite{display:block;margin-top:18px;font-size:12.5px;font-style:normal;color:var(--goldText);font-weight:700}

/* ── ⑥ الأدلة: قايمة صفّية (شكل مختلف عن الكروت) ── */
.guidelist{border:1px solid var(--border);border-radius:18px;background:var(--white);overflow:hidden;box-shadow:var(--sh-1)}
.guidelist .guide{display:flex;align-items:center;gap:15px;padding:18px 20px;border-top:1px solid var(--border);text-decoration:none;transition:background var(--t-base)}
.guidelist .guide:first-child{border-top:0}
.guidelist .guide:hover{background:var(--soft2)}
.guidelist .guide .ic{flex:none;font-size:18px}
.guidelist .guide .tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.guidelist .guide h2{font-size:16.5px;font-weight:600;color:var(--navy);line-height:1.5;margin:0;letter-spacing:-.004em}
.guidelist .guide .d{font-size:14px;color:var(--n70);line-height:1.75;max-width:var(--measure)}
.guidelist .guide .dl{margin-inline-start:auto;flex:none;font-size:13.5px;font-weight:600;color:var(--goldText);white-space:nowrap}
/* 📄 صف الدليل = الرابط + (اختياريًا) زرار تحميل الـPDF جنبه.
   الزرار **برّه** الرابط عشان مايبقاش رابط جوّه رابط (HTML غلط + كسر لوحة المفاتيح). */
.guide-row{display:flex;align-items:center;border-top:1px solid var(--border)}
.guide-row:first-child{border-top:0}
.guide-row:hover{background:var(--beige)}
.guide-row .guide{flex:1;border-top:0;min-width:0}
/* هدف اللمس: كان ٣٩px — تحت ٤٤ (مقاس حي على `/guides/` عند 430px). */
.gpdf{flex:none;display:inline-flex;align-items:center;gap:6px;margin-inline-end:18px;min-height:44px;
  padding:10px 15px;border:1px solid var(--border);border-radius:999px;background:var(--white);
  font-size:13px;font-weight:600;color:var(--goldText);text-decoration:none;white-space:nowrap;
  transition:border-color var(--t-base),background var(--t-base)}
.gpdf:hover{border-color:var(--goldText);background:var(--cream)}
@media (max-width:560px){
  .guide-row{flex-wrap:wrap;padding-bottom:12px}
  .guide-row .guide{flex:1 0 100%}
  .gpdf{margin-inline-start:60px}
}

/* ── تنفّس: مسافات أكبر بين الأقسام ── */
.hero-v2 ~ .sec-k{margin-top:52px}

@media (max-width:720px){
  /* الهيرو: العنوان + التحذير + زر واحد لازم يبانوا من غير scroll */
  .hero-v2{min-height:88vh;min-height:88svh;padding:40px 22px 56px}
  .hero-v2 h1{font-size:clamp(28px,8.4vw,38px);max-width:none;margin-bottom:14px}
  .hero-v2 .btns{margin-top:20px}
  .numsec{padding:38px 16px}
  .numsec .k{margin-bottom:22px}
  .numsec .ns{grid-template-columns:1fr;gap:18px}
  .numsec .n1 b{font-size:44px}
  .numsec .n1 .l{margin-top:6px;font-size:13px}
  .numsec .nnote{margin-top:22px;padding-top:16px}
  .quoteband{min-height:280px;margin:34px 0}
  .quoteband blockquote{padding:44px 20px}
  .guidelist .guide{flex-wrap:wrap}
  .guidelist .guide .dl{margin-inline-start:0;width:100%;padding-inline-start:33px}
}

/* الهيرو V2 من الحافة للحافة — مش صندوق في النص.
   بيتكتب برّه .wrap في الماركب، فالعرض كامل بدون أي حيلة vw.
   الارتفاع = الشاشة ناقص الهيدر الثابت (79px) عشان يملى المرئي بالظبط. */
.hero-v2{border-radius:0;margin-top:0;min-height:calc(100vh - var(--hdr-h));min-height:calc(100svh - var(--hdr-h))}
.hero-v2 .inr{max-width:820px;margin:0 auto;width:100%;position:relative;z-index:2}
.hero-v2 .glow{width:420px;height:420px;top:-16%;right:-8%}
@media (max-width:720px){
  .hero-v2{min-height:calc(88vh - var(--hdr-h));min-height:calc(88svh - var(--hdr-h))}
  .hero-v2 .inr{padding-inline:4px}
}

/* ═══════════════════════════════════════════════════════════════
   قائمة التنقّل — زر الهيدر + اللوحة المنزلقة
   ═══════════════════════════════════════════════════════════════ */

/* زر القائمة — ٣ شرطات بأطوال متدرّجة (تفصيلة هوية) */
/* (P2-15) 44×44 هدف اللمس المعتمد — كان 42 */
.menubtn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;background:var(--white);border:1px solid var(--border);border-radius:12px;cursor:pointer;transition:border-color var(--t-base),background var(--t-base)}
.menubtn:hover{border-color:var(--gold);background:var(--cream)}
.menubtn:active{transform:scale(.96)}
.menubtn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* 🌓 زر المظهر — نفس شكل زر القائمة. ديسكتوب بس (≥760px)؛ تحت كده الاختيار جوّه القائمة
   عشان الهيدر مايزحمش على الموبايل. الأيقونة بتتبع الاختيار (data-pref) مش الوضع الفعلي. */
.themebtn{display:none;align-items:center;justify-content:center;width:44px;height:44px;flex:none;background:var(--white);color:var(--navy);border:1px solid var(--border);border-radius:12px;cursor:pointer;transition:border-color var(--t-base),background var(--t-base)}
.themebtn:hover{border-color:var(--gold);background:var(--cream)}
.themebtn:active{transform:scale(.96)}
.themebtn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.themebtn .ti{display:none}
.themebtn[data-pref="system"] .ti-system,.themebtn[data-pref="light"] .ti-light,.themebtn[data-pref="dark"] .ti-dark{display:block}
@media (min-width:760px){.themebtn{display:inline-flex}}
body.has-fullhero .themebtn{background:rgba(255,255,255,.07);border-color:rgba(200,169,107,.35);color:var(--cream-k)}
body.has-fullhero.scrolled .themebtn{background:var(--white);border-color:var(--border);color:var(--navy)}
/* اختيار المظهر جوّه القائمة — راديو أصلي (لوحة مفاتيح + قارئ شاشة) بشكل أزرار مقسّمة */
.thm{border:0;margin:16px 0 0;padding:0;min-width:0}
.thm legend{font-size:12.5px;font-weight:700;color:var(--n62);margin-bottom:8px;padding:0}
.thm-o{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--border);border-radius:12px;padding:3px;background:var(--white)}
.thm label{position:relative;display:flex;align-items:center;justify-content:center;min-height:40px;border-radius:9px;font-size:13px;font-weight:600;color:var(--n70);cursor:pointer;text-align:center;line-height:1.3;padding:4px 6px}
.thm input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.thm label:has(input:checked){background:var(--navy);color:var(--beige)}
.thm label:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:1px}
.menubtn .bars{display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.menubtn .bars i{display:block;height:1.8px;border-radius:4px;background:var(--navy);transition:width .22s ease}
.menubtn .bars i:nth-child(1){width:17px}
.menubtn .bars i:nth-child(2){width:12px}
.menubtn .bars i:nth-child(3){width:15px}
.menubtn:hover .bars i{width:17px}
.menubtn[aria-expanded="true"] .bars i:nth-child(2){width:17px}

/* اللوحة */
.navwrap{position:fixed;inset:0;z-index:60}
.navscrim{position:absolute;inset:0;background:rgba(7,20,38,.55);opacity:0;transition:opacity .28s ease;backdrop-filter:blur(2px)}
.navwrap.on .navscrim{opacity:1}
.navpanel{position:absolute;inset-block:0;inset-inline-start:0;width:min(88vw,376px);background:var(--beige);border-inline-end:1px solid var(--border);box-shadow:var(--sh-1);display:flex;flex-direction:column;padding:18px 20px 22px;overflow-y:auto;
  /* العربي (RTL) بتفتح من اليمين · الإنجليزي (LTR) من الشمال — جهة الـstart */
  transform:translateX(var(--slide,-100%));transition:transform .32s cubic-bezier(.22,.61,.36,1)}
[dir="rtl"] .navpanel{--slide:100%;box-shadow:var(--sh-1)}
.navwrap.on .navpanel{transform:translateX(0)}

.navtop{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;border-bottom:1px solid var(--border)}
.navttl{font-size:12.5px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--goldText)}
.navx{width:44px;height:44px;display:grid;place-items:center;background:transparent;border:1px solid var(--border);border-radius:12px;color:var(--n70);cursor:pointer;transition:border-color var(--t-base),color var(--t-base),background var(--t-base)}
.navx:hover{border-color:var(--navy);color:var(--navy);background:var(--cream)}
.navx:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

.navlist{list-style:none;margin:6px 0 0;padding:0;flex:1}
/* انزلاق متتابع من حافة القايمة (متسق مع دخول الهيرو) — transform/opacity بس */
.navlist li{opacity:0;transform:translateX(-12px);transition:opacity .24s ease,transform .26s cubic-bezier(.22,.61,.36,1);transition-delay:calc(var(--i) * 26ms + 60ms)}
[dir="rtl"] .navlist li{transform:translateX(16px)}
.navwrap.on .navlist li{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.navlist li{transition:none;opacity:1;transform:none}}
.navlist a{display:flex;align-items:center;gap:13px;padding:15px 6px;border-bottom:1px solid var(--border);text-decoration:none;border-radius:8px;transition:padding-inline-start var(--t-base) var(--ease-out),background var(--t-base)}
.navlist a:hover{padding-inline-start:10px;background:var(--soft2)}
.navlist a:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:8px}
.navlist .nx{flex:none;font-size:12px;font-weight:700;color:var(--n35);width:20px}
.navlist .nt{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.navlist .nt b{font-size:15px;color:var(--navy);font-weight:600}
.navlist .nt span{font-size:12.5px;color:var(--n62)}
.navlist a:hover .nt b{color:var(--goldText)}
.navlist .na{flex:none;color:var(--n35);font-size:17px;transition:color .16s}
.navlist a:hover .na{color:var(--goldText)}

.navtg{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;padding:13px;background:var(--gold);color:var(--navy-k);border-radius:12px;font-weight:700;font-size:13px;text-decoration:none;transition:transform .14s}
.navtg:active{transform:scale(.98)}

@media (prefers-reduced-motion:reduce){
  .navpanel,.navscrim,.navlist li{transition-duration:.001ms!important}
  .navlist li{opacity:1;transform:none}
}
@media (max-width:430px){.menubtn{width:40px;height:40px}}

/* ═══════════════════════════════════════════════════════════════
   «الخيط» — أربع لمسات بصرية منفصلة
   ⚠️ زخرفة بحتة: aria-hidden + pointer-events:none + مفيش معلومة
      بتتنقل بيها. صفر filter/blur/mask/تدرّجات — الأمان على Safari.
   ═══════════════════════════════════════════════════════════════ */
.thread{position:absolute;pointer-events:none;color:var(--goldText);z-index:0;overflow:visible;
  /* الافتراضي = مرسوم بالكامل، فلو JS ما اشتغلش يفضل زخرفة ثابتة سليمة */
  opacity:.9}
.thread.t-static{opacity:.7}

/* ① الهيرو → مين أنا: من **يمين** القسم (ناحية الموتو، بعيد عن الأزرار) */
.whoami{position:relative}
.t-whoami{top:-58px;inset-inline-end:-14px;width:186px;height:186px}

/* ② قسم الأرقام: قوس على **حافة** القسم — مش حوالين رقم */
.numsec{position:relative;overflow:hidden}
.t-nums{top:8%;inset-inline-end:14px;width:56px;height:270px;color:var(--goldSoft);opacity:.62}

/* ③ الفرص: خيط **خلف** الكروت (z-index 0 والكروت فوقه) */
.opps-home{position:relative}
.opps-home>.opp{position:relative;z-index:1}
.t-opps{top:-30px;inset-inline-end:0;width:100%;height:52px;opacity:.9}

/* ④ القصة: الخط التحتي والأثر المجرّد — بينتهي هنا قبل قسم تيليجرام */
.about{position:relative}
.t-story{top:-96px;inset-inline-end:-10px;width:216px;height:108px}

/* الشاشات الضيقة: اللمسات الباقية أصغر ومزحزحة عن النص */
@media (max-width:720px){
  .t-whoami{width:128px;height:128px;top:-40px;inset-inline-end:-8px}
  .t-opps{height:40px;top:-22px}
  .t-story{width:140px;height:70px;top:-62px}
}
/* أصغر من 480px أو تقليل الحركة → ثابت وخافت (thread.js بيضيف t-static) */
@media (max-width:480px){.thread{opacity:.3}}
@media (prefers-reduced-motion:reduce){.thread{opacity:.32}}

/* ═══ الهيرو الحقيقي ملء الشاشة ═══
   المشكلة: الهيرو كان بيملأ المساحة **تحت** الهيدر — فشريط الهيدر البيج
   فوقه كان بيخليه يبان صندوق. الحل: الهيرو يطلع لأعلى الشاشة (y=0)
   والهيدر يبقى شفّاف فوقه، ويرجع بيج أول ما تنزل. */

body.has-fullhero .hdr{background:transparent;border-bottom-color:transparent;transition:background .3s ease,border-color .3s ease}
body.has-fullhero .hdr .brand .w{color:var(--cream-k)}
body.has-fullhero .hdr .brand .s{color:var(--goldSoft)}
body.has-fullhero .lang-switch,body.has-fullhero .hdr-account{background:rgba(255,255,255,.07);color:var(--cream-k);border-color:rgba(226,207,166,.34)}
body.has-fullhero .lang-switch .glb{color:var(--goldSoft)}
body.has-fullhero .lang-switch:hover,body.has-fullhero .hdr-account:hover{background:rgba(255,255,255,.14);color:#fff;border-color:var(--gold)}
body.has-fullhero .menubtn{background:rgba(255,255,255,.07);border-color:rgba(200,169,107,.35)}
body.has-fullhero .menubtn .bars i{background:var(--cream-k)}
/* بعد النزول: الهيدر يرجع طبيعي */
body.has-fullhero.scrolled .hdr{background:var(--beige);border-bottom-color:var(--border)}
body.has-fullhero.scrolled .hdr .brand .w{color:var(--navy)}
body.has-fullhero.scrolled .hdr .brand .s{color:var(--goldText)}
body.has-fullhero.scrolled .lang-switch,body.has-fullhero.scrolled .hdr-account{background:var(--white);color:var(--n70);border-color:var(--border)}
body.has-fullhero.scrolled .lang-switch .glb{color:var(--n62)}
body.has-fullhero.scrolled .menubtn{background:var(--white);border-color:var(--border)}
body.has-fullhero.scrolled .menubtn .bars i{background:var(--navy)}

/* الهيرو نفسه: من y=0 لآخر الشاشة */
.hero-v2{margin-top:calc(-1 * var(--hdr-h));padding-top:calc(var(--hdr-h) + 52px);min-height:100vh;min-height:100svh}
@media (max-width:720px){
  .hero-v2{margin-top:calc(-1 * var(--hdr-h));padding-top:calc(var(--hdr-h) + 30px);min-height:88vh;min-height:88svh}
}

/* ═══ صورة القصة: النص هو البطل ═══
   كانت 340×408 — واخدة نص القسم. بقت 120px زي «مين أنا». */
.about.has-photo{grid-template-columns:120px 1fr;gap:22px;align-items:start}
.about .ph{width:120px;height:120px;border-radius:18px;object-fit:cover;border:0;
  box-shadow:var(--sh-2)}
@media (max-width:720px){
  .about.has-photo{grid-template-columns:1fr}
  .about .ph{width:96px;height:96px;margin-inline:auto;display:block}
}

/* ═══════════════════════════════════════════════════════════════
   إصلاحات كشفها ماسح وصول الستايل (tools/audit-css.mjs)
   ═══════════════════════════════════════════════════════════════ */

/* .lt — كانت مستخدمة في 49 صفحة **من غير أي قاعدة**.
   الغرض المقصود: الأرقام والنص اللاتيني بخط Inter وبعرض ثابت. */
.lt{font-family:'Inter','IBM Plex Sans Arabic',sans-serif;font-variant-numeric:tabular-nums;letter-spacing:0}

/* ═══ سطر التحذير في الهيرو — أهم جملة في الصفحة ═══
   🔴 كان color:var(--n62) — كحلي غامق بشفافية 55% **على خلفية كحلية**،
      فكان بيضيع تمامًا. دلوقتي: كريمي فاتح على خلفية داكنة خفيفة بحد ذهبي.
   التباين: #EFE6D6 على ~#0d1b2e ⇒ أعلى بكتير من 4.5:1 (معيار AA).
   ⚠️ من غير أحمر — الأحمر محجوز للمواعيد والتحذيرات الحرجة. */
.hero-v2 .hero-note{color:var(--cream-k);background:rgba(7,20,38,.42);
  border:1px solid rgba(200,169,107,.34);border-inline-start:3px solid var(--gold);
  border-start-start-radius:0;border-end-start-radius:0;
  border-start-end-radius:10px;border-end-end-radius:10px;
  padding:12px 15px;font-size:13.5px;font-weight:600;
  line-height:1.85;max-width:56ch;margin-top:18px}

/* ═══ قسم تيليجرام المدمج — الكلاسات دي اتبنت في الماركب من غير CSS ═══ */
.staysec{box-shadow:inset 0 1px 0 var(--band-edge),inset 0 -1px 0 var(--band-edge);background:var(--feature-band, linear-gradient(165deg,#0b1e35 0%,var(--navy-k) 58%,#050f1c 100%));
  color:var(--cream-k);padding:56px 18px;margin-top:var(--sec-gap)}
.staysec .inr{max-width:820px;margin:0 auto}
.staysec .k{font-size:12.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--goldText);margin-bottom:10px}
.staysec h2{color:var(--cream-k);margin-bottom:10px}
.sintro{font-size:14px;line-height:1.9;color:var(--cream70);max-width:56ch;margin-bottom:24px}

.scards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.scard{display:flex;flex-direction:column;align-items:flex-start;gap:7px;
  background:rgba(255,255,255,.05);border:1.5px solid rgba(200,169,107,.28);
  border-radius:18px;padding:20px;text-decoration:none;color:var(--cream-k);
  transition:border-color .18s,background .18s,transform .18s}
.scard:hover{border-color:var(--goldText);background:rgba(255,255,255,.08);transform:translateY(-2px)}
.scard .ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;
  background:rgba(200,169,107,.14);color:var(--goldText);margin-bottom:4px}
.scard .bdg{font-size:12px;font-weight:700;letter-spacing:.3px;color:var(--navy-k);
  background:var(--goldSoft);padding:3px 10px;border-radius:999px}
.scard b{font-size:16px;color:var(--cream-k);font-weight:600}
.scard .hnd{font-size:12.5px;color:var(--goldText)}
.scard .d{font-size:12.5px;line-height:1.9;color:var(--cream70);flex:1}
/* زر حقيقي — مش لينك نصي مسطّر */
.scard .go{display:inline-flex;align-items:center;justify-content:center;margin-top:12px;
  width:100%;padding:11px 16px;background:var(--gold);color:var(--navy-k);
  border-radius:12px;font-weight:700;font-size:13px;transition:transform .14s}
.scard:hover .go{transform:translateY(-1px)}

.snote{margin-top:22px;padding-top:18px;border-top:1px solid rgba(239,230,214,.14);
  font-size:12.5px;line-height:1.9;color:var(--cream70);max-width:60ch}
.ssoon{margin-top:8px;font-size:13px;line-height:1.9;color:var(--cream60);max-width:60ch}
.ssoon-cta{color:var(--gold);font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}

/* حاويات نصية — hooks للتخطيط */
.wtx{display:flex;flex-direction:column;min-width:0}

@media (max-width:720px){
  .staysec{padding:40px 16px;margin-top:var(--sec-gap)}
  .scards{grid-template-columns:1fr}
  .hero-v2 .hero-note{font-size:12.5px;padding:10px 12px;margin-top:14px}
}

/* ═══════════════════════════════════════════════════════════════
   إصلاحات تباين (فحص WCAG على الصفحة الحقيقية)
   ⚠️ من غير أحمر — الأحمر محجوز للمواعيد والتحذيرات الحرجة.
   ═══════════════════════════════════════════════════════════════ */
:root{
  /* الذهبي الهوياتي #C8A96B تباينه على الأبيض ≈ 2.2:1 — كويس كحدود
     وأيقونات، بس **مش كفاية للنص**. ده نفس الذهبي مغمّق للنص الصغير
     على الخلفيات الفاتحة (≈ 4.9:1 على الأبيض). */
  --goldText:#8a6a2c;
  /* كريمي بشفافية أعلى للنص الصغير على الكحلي (كان .45 ⇒ 3.4:1) */
  --cream60:rgba(239,230,214,.78);

  /* 📊 نص رمادي بتباين كافٍ. `--n55` كانت 4.04 على البيج و4.11 على الأبيض
     — الاتنين تحت 4.5 المطلوبة للنص العادي. القيمة دي بتدّي ≈4.8/5.2.
     (`--n55` نفسها فضلت للحدود والخلفيات — التغيير على النص بس.) (P2-12) */
  --n62:rgba(7,20,38,.62);

  /* 🌫️ (قسم ٨) ٣ مستويات ظلّ وظيفية بدل ٤٨ قيمة — للارتفاعات الكحلية بس؛
     توهّجات الذهبي فاضلة زي ما هي (هوية أثر، مش ارتفاع). */
  --sh-1:0 1px 2px rgba(7,20,38,.06);
  --sh-2:0 10px 24px -18px rgba(7,20,38,.35);
  --sh-3:0 18px 44px -20px rgba(7,20,38,.45);

  /* ═══════════════════════════════════════════════════════════════
     جولة الصقل «Premium» — توكنز إيقاع وحركة وتركيز.
     🔒 صفر ألوان براند جديدة · صفر خط جديد · صفر وزن جديد.
     كل اللي هنا: تسمية للقيم اللي كانت متناثرة، عشان الإيقاع يبقى
     مقصودًا مش صدفة. (استُخرجت من القياس الحي — docs/DESIGN-SYSTEM.md)
     ═══════════════════════════════════════════════════════════════ */

  /* سلّم مسافات — مضاعفات ٤ بميل للمسافات الكبيرة في فواصل الأقسام */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px; --sp-4:16px;
  --sp-5:22px; --sp-6:30px; --sp-7:40px; --sp-8:52px;

  /* 📐 إيقاع الأقسام — كان مقاسًا 34 و44 و48 على نفس الصفحة.
     قيمة واحدة تحكم المسافة قبل كل رأس قسم في الموقع كله. */
  --sec-gap:52px;

  /* 📏 قياس القراءة — `.prose` كانت لوحدها مسقوفة بـ68ch، والباقي
     (`.card .li`, `details.acc .in`, `.step p`) بياخد 784px كاملة
     ⇒ ≈١٠٠ حرف في السطر. توكن واحد لكل نص متدفّق. */
  --measure:68ch;

  /* ⌨️ حلقة تركيز واحدة لكل الموقع (كانت ١١ قاعدة متفرقة بس) */
  --focus-ring:2px solid var(--goldText);
  --focus-offset:2px;

  /* ⏱️ مدد الحركة — «سريعة وهادية». الحركة بتدّي feedback، ماتأخّرش. */
  --t-fast:.12s; --t-base:.18s; --t-slow:.26s;
  --ease-out:cubic-bezier(.22,.61,.36,1);

  /* 📏 ارتفاع الهيدر الحقيقي = اللوجو + حشو `.hdr .in` من فوق وتحت.
     🔴 كان الرقم مكتوب بالإيد في ٤ أماكن (79px و71px) والارتفاع الفعلي
        **112px** — فالهيرو «ملء الشاشة» كان بيبدأ بعد الهيدر بـ34px
        وبيسيب شريط بيج فوق الصورة في كل صفحة ليها هيرو كامل
        (٣٤px على الديسكتوب و١٧px على الموبايل — مقاسين حيًّا).
     توكن واحد دلوقتي، والقيمة متحسوبة من نفس مقاسات اللوجو تحت. */
  --hdr-h:112px;
}
@media(max-width:430px){:root{--hdr-h:88px}}
/* الإيقاع نفسه بمقياس أصغر على الشاشات الضيقة — النسبة محفوظة. */
@media(max-width:560px){:root{--sec-gap:40px}}

/* ⌨️ التركيز الظاهر — `:where()` بصفر أولوية عشان أي قاعدة تركيز
   خاصة موجودة قبل كده تفضل هي الأقوى. الحلقة بتتبع نصف قطر العنصر
   تلقائيًا في المتصفحات الحديثة، فمفيش قفزة شكل. */
:where(a,button,summary,input,select,textarea,[tabindex]:not([tabindex="-1"])):focus-visible{
  outline:var(--focus-ring);outline-offset:var(--focus-offset)
}
/* على الأسطح الكحلية الحلقة لازم تبقى الذهبي الفاتح عشان تتشاف */
:where(.hero,.hero-v2,.numsec,.staysec,.quoteband,.navpanel,.season) :where(a,button,summary,input,[tabindex]):focus-visible{
  outline-color:var(--gold)
}

/* 🟡 الذهبي كنص — توكن واحد بقيمتين حسب الخلفية.
   #C8A96B تباينه على البيج/الأبيض ≈ 2.1 (المطلوب 4.5)، وعلى الكحلي ممتاز.
   فبدل ما نختار قيمة واحدة غلط في مكان، التوكن بيتعاد تعريفه جوّه الأقسام
   الداكنة. أي `color:var(--goldText)` بياخد القيمة الصح من سياقه تلقائيًا.
   والذهبي الأصلي `--gold` فاضل زي ما هو للحدود والأيقونات والتوهّجات. */
.hero, .hero-v2, .numsec, .staysec, .authstage, .quoteband,
.all-opps, .season, .botcard, .ytbox, .msgprev, .opptab.active{
  --goldText:var(--gold);
}
/* نص ذهبي صغير على خلفية فاتحة */
.guidelist .guide .dl,.wmore,.quoteband cite,.credits a,.credits{color:var(--goldText)}
.wmore:hover{border-bottom-color:var(--goldText)}
/* وصف الأدلة كان 4.11:1 — تغميق بسيط يعدّيه */
.guidelist .guide .d{color:var(--n70)}
/* نصوص صغيرة على الأقسام الكحلية */
.numsec .nnote,.ssoon,.numsec .n1 small{color:var(--cream60)}

/* اعتمادات الصور في الفوتر — كانت --n35 (2.25:1). النص صغير جدًا (10px)
   فمحتاج تباين أعلى مش أقل. */
footer .fine.credits,footer .fine.credits a{color:var(--n70)}
/* سطر الهيدر الفرعي — الذهبي على البيج 4.04:1، تحت الحد بشعرة */
.hdr .brand .s,body.has-fullhero.scrolled .hdr .brand .s{color:var(--goldText)}

/* ═══ أداة دمج PDF + صفحة الأدوات ═══ */
.toolcard-m{margin-top:16px}
.mdrop{display:flex;flex-direction:column;align-items:center;gap:8px;padding:30px 20px;border:2px dashed var(--border);border-radius:18px;background:var(--beige);cursor:pointer;text-align:center;transition:border-color .18s,background .18s}
.mdrop:hover,.mdrop.on{border-color:var(--goldText);background:color-mix(in srgb,var(--gold) 7%,transparent)}
.mdrop:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.mdrop .ic{color:var(--goldText)}
.mdrop b{font-size:14px;color:var(--navy)}
.mdrop .hint{font-size:12.5px;color:var(--n62)}
.mdrop.over{border-color:var(--goldText);background:color-mix(in srgb,var(--gold) 10%,transparent)}
/* أداة تصغير PDF: خيارات الجودة + صندوق النتيجة */
.cq{display:flex;flex-direction:column;gap:8px}
.cqopt{display:flex;align-items:center;gap:10px;padding:10px 13px;border:1.5px solid var(--border);border-radius:12px;cursor:pointer;transition:border-color .15s,background .15s}
.cqopt:has(input:checked){border-color:var(--goldText);background:color-mix(in srgb,var(--gold) 7%,transparent)}
.cqopt input{accent-color:var(--goldText);width:17px;height:17px;flex:none}
.cqopt span{display:flex;flex-direction:column;gap:1px}
.cqopt b{font-size:13px;color:var(--navy)}
.cqopt small{font-size:12.5px}
.c-result{margin-top:14px;padding:14px 16px;border:1.5px solid var(--gold);border-radius:12px;background:color-mix(in srgb,var(--gold) 6%,transparent)}
.c-sizes{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;font-weight:600;color:var(--navy)}
.c-sizes .c-new{color:var(--ok-tx2)}
.c-sizes .c-arrow{color:var(--n62)}
.c-sizes .c-pct{margin-inline-start:auto;background:#0a7;color:#fff;font-weight:700;padding:3px 10px;border-radius:999px;font-size:13px}
.c-done{display:flex;align-items:center;gap:12px}
.c-done .c-new{font-size:27px;font-weight:800;color:var(--ok-tx2)}
.c-done .c-pct{background:#0a7;color:#fff;font-weight:700;padding:3px 11px;border-radius:999px;font-size:13px}
.c-done-txt{margin:8px 0 0;font-size:14px;font-weight:600;color:var(--navy)}
/* أداة استخراج الصفحات: شبكة الصفحات */
.xgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:10px}
.xtile{padding:0;border:2px solid var(--border);border-radius:8px;background:var(--white);cursor:pointer;overflow:hidden;display:flex;flex-direction:column;align-items:center;transition:border-color .14s,transform .1s}
.xtile:hover{border-color:var(--goldText)}
.xtile.sel{border-color:var(--goldText);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 40%,transparent)}
.xtile .xthumb{width:100%;aspect-ratio:1/1.3;background:var(--beige) center/cover no-repeat;display:flex;align-items:center;justify-content:center}
.xtile .xthumb.has-img .xnum{display:none}
.xtile .xnum{font-size:21px;font-weight:700;color:var(--n62)}
.xtile .xlbl{font-size:12px;font-weight:600;color:var(--navy);padding:4px 0}
.xtile.sel .xlbl{color:var(--goldText)}
/* أداة ترتيب/حذف: أزرار التحكّم لكل صفحة */
.rtile{cursor:default}
.rtile .rctl{display:flex;gap:3px;padding:0 3px 5px}
.rbtn{flex:1;padding:5px 0;border:1px solid var(--border);border-radius:8px;background:var(--white);cursor:pointer;font-size:12px;color:var(--navy);transition:background .12s,border-color .12s}
.rbtn:hover{border-color:var(--goldText);background:var(--cream)}
.rbtn.del{color:var(--del-tx)}
.rbtn.del:hover{border-color:var(--del-tx);background:var(--warn-bg2)}
/* أداة التدوير: الصورة المصغّرة بتلف فورًا */
.otbwrap{overflow:hidden}
.othumb{width:100%;height:100%;background:center/cover no-repeat;display:flex;align-items:center;justify-content:center;transition:transform .28s ease}
.otbwrap.has-img .othumb .xnum{display:none}
.c-note{margin:10px 0 0;font-size:13px;line-height:1.7}
.c-note.ok{color:var(--navy)}
.c-note.warn{color:var(--note-tx);background:var(--note-bg);border:1px solid var(--note-bd);border-radius:8px;padding:9px 12px}
.c-result .cta{margin-top:12px}
.cdiag-toggle{background:none;border:0;color:var(--n62);font-size:12.5px;cursor:pointer;padding:4px 2px;text-decoration:underline}
.cdiag{white-space:pre-wrap;font-size:12px;color:var(--n62);background:var(--beige);border:1px solid var(--border);border-radius:8px;padding:8px 10px;margin:6px 0 0;max-height:200px;overflow:auto;direction:ltr;text-align:left}
.mhead{display:flex;justify-content:space-between;align-items:center;margin:18px 0 8px;font-size:12.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--n62)}
.mlist{border:1.5px solid var(--border);border-radius:12px;overflow:hidden}
.mrow{display:flex;align-items:center;gap:11px;padding:11px 13px;border-top:1px solid var(--border);background:var(--white)}
.mrow:first-child{border-top:0}
.mrow .mn{flex:none;width:22px;height:22px;display:grid;place-items:center;border-radius:8px;background:var(--cream);color:var(--navy);font-size:12px;font-weight:700}
.mrow .mtx{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.mrow .mtx b{font-size:13px;color:var(--navy);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .ms{font-size:12px;color:var(--n62)}
.macts{display:flex;gap:4px;flex:none}
.mbtn{width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--border);background:var(--white);border-radius:8px;cursor:pointer;font-size:12px;color:var(--n70);transition:border-color .14s,color .14s}
.mbtn:hover{border-color:var(--goldText);color:var(--goldText)}
.mbtn.del:hover{border-color:var(--red);color:var(--red)}
.mbtn:focus-visible{outline:2px solid var(--gold);outline-offset:1px}

/* صندوق الطمأنة */
.safebox{background:var(--white);border:1.5px solid color-mix(in srgb,var(--green) 26%,transparent);border-radius:18px;padding:18px;margin-top:16px}
.safebox .sbh{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.safebox .sbh b{font-size:14px;color:var(--navy)}
.safebox .sbh .ic{font-size:17px}
.safebox .sbwhy{margin-top:11px;padding-top:11px;border-top:1px solid var(--border);font-size:12px;line-height:1.9;color:var(--n62)}

/* شبكة كروت الأدوات */
.toolgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.tcard{display:flex;flex-direction:column;gap:7px;background:var(--white);border:1.5px solid var(--border);border-radius:18px;padding:20px;text-decoration:none;transition:border-color .18s,transform .18s,box-shadow .18s}
.tcard:hover{border-color:var(--goldText);transform:translateY(-2px);box-shadow:var(--sh-2)}
.tcard .tic{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:var(--cream);color:var(--goldText);margin-bottom:4px}
.tcard b{font-size:16px;color:var(--navy)}
.tcard .d{font-size:12.5px;line-height:1.9;color:var(--n70);flex:1}
.tcard .tgo{margin-top:10px;font-size:12.5px;font-weight:700;color:var(--goldText)}
@media (max-width:720px){.toolgrid{grid-template-columns:1fr}}

/* ═══ الاستفسارات — /account/help/ ═══ */
.hd-box{margin-bottom:18px}
.hd-t{font-size:17px;font-weight:700;color:var(--navy);margin-bottom:10px}
.asect-d{font-size:13px;color:var(--n62);margin:-4px 0 16px;line-height:1.7;max-width:640px}
.hd-l{list-style:none;padding:0;margin:0 0 10px}
.hd-l li{position:relative;padding-inline-start:20px;margin-bottom:7px;font-size:14px;color:var(--n70);line-height:1.7}
.hd-l li::before{content:"";position:absolute;inset-inline-start:2px;top:9px;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.hd-n{font-size:13px;color:var(--n62);margin:0}
.hd-a{color:var(--goldText);font-weight:700;text-decoration:underline}
.hf-box{margin-bottom:26px}
.hl-t{margin:0 0 12px}

/* قايمة المحادثات */
.hl{display:grid;gap:10px}
.hl-i{display:block;width:100%;text-align:start;font-family:inherit;cursor:pointer;
      background:var(--white);border:1px solid var(--border);border-radius:12px;
      padding:14px 16px;transition:border-color .16s,box-shadow .16s}
.hl-i:hover,.hl-i:focus-visible{border-color:var(--goldText);box-shadow:var(--sh-2)}
.hl-h{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.hl-h b{font-size:15px;color:var(--navy);line-height:1.5}
.hl-n{flex:none;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;
      background:var(--gold);color:var(--navy-k)}
.hl-m{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.camp-st.open{background:rgba(200,169,107,.22);color:var(--goldText)}
.camp-st.answered{background:rgba(10,125,77,.12);color:var(--green)}
.camp-st.closed{background:var(--cream);color:var(--n62)}

/* المحادثة */
.hb{font-family:inherit;font-size:13px;font-weight:600;color:var(--goldText);
    background:none;border:0;padding:0;margin-bottom:14px;cursor:pointer}
.hb:hover{text-decoration:underline}
.ht{display:grid;gap:12px;margin-bottom:20px}
.hm{border-radius:12px;padding:13px 16px;border:1px solid var(--border)}
.hm-s{background:var(--white)}
.hm-a{background:var(--cream);border-color:rgba(200,169,107,.4)}
.hm-w{font-size:12.5px;font-weight:600;color:var(--n62);margin-bottom:6px}
.hm-a .hm-w{color:var(--goldText)}
.hm-b{margin:0;font-size:14px;color:var(--navy);line-height:1.9;white-space:pre-wrap}
/* مخفي بصريًا وظاهر لقارئ الشاشة (label بيوصف حقل واضح من الـ placeholder) */
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ═══ لوحة الأدمن: إحصائيات + CRUD (المرحلة ٦) ═══ */
.stg{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.stc{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:14px 12px;text-align:center}
.stn{display:block;font-family:Inter,system-ui,sans-serif;font-size:27px;font-weight:800;color:var(--navy);line-height:1.2}
.stn.bad{color:var(--red)}
.stl{display:block;font-size:12.5px;color:var(--n62);margin-top:4px;line-height:1.5}
.crud{margin:12px 0 4px;background:var(--white);border:1px solid var(--border);border-radius:12px;padding:12px 16px}
.crud>summary{font-size:14px;font-weight:600;color:var(--goldText);cursor:pointer;list-style:none}
.crud>summary::-webkit-details-marker{display:none}
.crud[open]>summary{margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.crud-r{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:default}
.crud-r:hover{border-color:var(--border);box-shadow:none}
.xbtn{flex:none;font-family:inherit;font-size:12px;font-weight:600;color:var(--red);background:none;
      border:1px solid rgba(214,40,57,.28);border-radius:8px;padding:5px 12px;cursor:pointer}
.xbtn:hover{background:rgba(214,40,57,.07)}
/* ═══ المرحلة ٧: الطلبات + التعديل داخل الصف ═══ */
.rq{cursor:default}
.rq:hover{border-color:var(--border);box-shadow:none}
.rq-f{display:flex;align-items:flex-end;gap:10px;margin-top:10px}
.rq-t{flex:1;font-family:inherit;font-size:14px;color:var(--navy);background:var(--white);
      border:1px solid var(--border);border-radius:12px;padding:10px 12px;resize:vertical;line-height:1.7}
.rq-t:focus{outline:0;border-color:var(--goldText);box-shadow:0 0 0 3px rgba(200,169,107,.18)}
.crud-a{flex:none;display:flex;gap:6px}
.xbtn.edt{color:var(--goldText);border-color:rgba(200,169,107,.45)}
.xbtn.edt:hover{background:rgba(200,169,107,.1)}
.crud-e{background:var(--white);border:1px solid var(--gold);border-radius:12px;padding:14px 16px}

/* ═══ صفحة 404 ═══ */
.nf{max-width:760px}
.nf-t{font-size:17px;font-weight:700;color:var(--navy);margin:26px 0 14px}
.nf-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-bottom:26px}
.nf-c{display:block;background:var(--white);border:1px solid var(--border);border-radius:12px;
      padding:16px 18px;transition:border-color .16s,box-shadow .16s}
.nf-c:hover{border-color:var(--goldText);box-shadow:var(--sh-2)}
.nf-c b{display:block;font-size:15px;color:var(--navy);margin-bottom:5px}
.nf-c span{display:block;font-size:13px;color:var(--n62);line-height:1.7}
.nf-n{font-size:13px;color:var(--n62);margin-top:22px;line-height:1.8}

/* ═══ شارات المواعيد على الكروت ═══
   🔴 الأحمر هنا متسق مع .deadline — نفس المعنى (موعد قرب). */
.dt{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;
    margin:10px 0 0;line-height:1.7}
.dt .dot{flex:none;width:7px;height:7px;border-radius:50%;background:currentColor}
.dt-open{color:var(--green)}
.dt-soon{color:var(--red)}
.dt-closed{color:var(--n62);font-weight:600}
.dt-none{color:var(--n62);font-weight:600;font-size:12px}

/* ═══ تبويب الفرص (المرحلة ٩) ═══ */
.opsearch{width:100%;font-family:inherit;font-size:15px;color:var(--navy);background:var(--white);
          border:1px solid var(--border);border-radius:12px;padding:11px 14px;margin-bottom:12px}
.opsearch:focus{outline:0;border-color:var(--goldText);box-shadow:0 0 0 3px rgba(200,169,107,.18)}
.opdates{border-color:rgba(214,40,57,.28)}   /* 🔴 الأحمر = المواعيد */
.opdrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:14px 0 4px}
.oppub{margin-top:20px;border-color:rgba(200,169,107,.45)}
/* ═══ تبويب المتابعة (المرحلة ١٠) ═══ */
.mn-r{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:default}
.mn-r:hover{border-color:var(--border);box-shadow:none}
.mn-t{display:flex;gap:6px;flex-wrap:wrap;flex:none}
.mn-b{font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;
      background:var(--cream);color:var(--n62);white-space:nowrap}
.mn-b.warn{background:rgba(200,169,107,.22);color:var(--goldText)}
.mn-b.err{background:rgba(214,40,57,.1);color:var(--red)}
.mn-b.ok{background:rgba(10,125,77,.12);color:var(--green)}
/* حالتين جداد: لسه مافتحتش · وموعد بس من غير ادّعاء فتح — الاتنين محايدين */
.dt-soonopen{color:var(--goldText)}
.dt-plain{color:var(--n70)}

/* ═══ الكارت بعد شيل الشيبات: تنفّس أوضح وتدرّج بصري ═══
   الترتيب: صورة · شارة النوع · العنوان · الجهة · الموعد · التمويل · الزرار */
.opp h3{margin:0 0 6px;line-height:1.5}
.opp .meta{margin:0 0 12px;font-size:13px;color:var(--n62);line-height:1.7}
.opp .dt{margin:0 0 14px;padding-top:12px;border-top:1px solid var(--border)}
.opp .ft{margin-top:auto;padding-top:12px}
.opp .fund{font-size:13px;line-height:1.7;color:var(--n70)}

/* من بيطلب تقليل الحركة: الحجم يتغيّر من غير انتقال */
@media (prefers-reduced-motion: reduce){

}
.adminlink{border-color:rgba(200,169,107,.5)}
.adminlink:hover{border-color:var(--goldText);background:rgba(200,169,107,.06)}
.navadmin{display:block;text-align:center;font-weight:600;font-size:13px;color:var(--goldText);
          background:rgba(200,169,107,.1);border:1px solid rgba(200,169,107,.4);border-radius:12px;
          padding:11px;margin:6px 0 10px;text-decoration:none}
.navadmin:hover{background:rgba(200,169,107,.18)}

/* ═══ لوحة الأدمن ككروت ═══ */
.acards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:8px}
.acards-group{margin-top:18px}
.acards-group:first-child{margin-top:8px}
.acards-gk{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--goldText);padding-inline-start:2px}
.acard{position:relative;text-align:start;font-family:inherit;cursor:pointer;background:var(--white);
       border:1px solid var(--border);border-radius:18px;padding:18px 18px 16px;transition:border-color .16s,box-shadow .16s,transform .12s}
.acard:hover{border-color:var(--goldText);box-shadow:var(--sh-2);transform:translateY(-2px)}
.acard b{display:block;font-size:16px;color:var(--navy);margin-bottom:5px}
.acard span{display:block;font-size:12.5px;color:var(--n62);line-height:1.7}
.acard .acn{position:absolute;top:14px;inset-inline-end:14px;min-width:22px;height:22px;padding:0 6px;
            display:none;align-items:center;justify-content:center;font-size:12px;font-weight:700;font-style:normal;
            background:var(--gold);color:var(--navy-k);border-radius:999px}
.acard .acn:not(:empty){display:inline-flex}
.asect{margin-top:6px}
.asback{font-family:inherit;font-size:13px;font-weight:600;color:var(--goldText);background:none;border:0;
        padding:0;margin-bottom:14px;cursor:pointer}
.asback:hover{text-decoration:underline}

/* ⚡ الملخّص السريع — ٤–٥ صناديق تحت الهيرو مباشرة، قبل أي فقرة نص.
   الهدف: الطالب يعرف في ثانيتين «دي تخصّني ولا لأ» من غير ما يقرا سطر واحد.
   نفس توكنز الهوية بالظبط — مفيش لون جديد. */
/* ⚡ الملخّص السريع (جولة الصقل ٢ سبتمبر): كان ٥ كروت متوسّطة — إيموجي سطر،
   تسمية سطر، قيمة سطر = شكل «حقول داتابيز». دلوقتي صندوق واحد بصفوف أفقية:
   الأيقونة والتسمية والقيمة وحدة بصرية واحدة على سطر، والتفصيلة تحتهم. */
/* ⚡ (الصقل Premium) «الفهم السريع» فوق الفولد — دي أهم كتلة في صفحة
   الفرصة: الطالب بيقرر منها في تانيتين هل الفرصة تخصّه ولا لأ.
   المفتاح `:` بيفضل هادي والقيمة بتكبر درجة — العين بتمسح **القيم**
   في عمود واحد من غير ما تقرا المفاتيح. */
.qf{display:grid;grid-template-columns:repeat(2,1fr);margin:20px 0 0;background:var(--white);border:1px solid var(--border);border-radius:16px;box-shadow:var(--sh-1);overflow:hidden}
.qfi{display:flex;gap:12px;align-items:flex-start;padding:15px 18px;border-top:1px solid var(--border)}
.qfi:nth-child(-n+2){border-top:0}
.qfi:nth-child(odd){border-inline-end:1px solid var(--border)}
.qfic{font-size:17px;line-height:1.5;flex:none;opacity:.9}
.qft{min-width:0}
.qfl{display:flex;gap:7px;align-items:baseline;flex-wrap:wrap}
.qfk{font-size:12.5px;color:var(--n62)}
.qfk::after{content:":"}
.qfv{font-size:14.5px;font-weight:600;color:var(--navy);line-height:1.55}
.qfs{display:block;font-size:12.5px;color:var(--n62);line-height:1.7;margin-top:3px}
.qfi.hot{background:var(--warn-bg)}
.qfi.hot .qfv{color:var(--warn-tx)}
.qfi.hot .qfs{color:var(--warn-tx2)}
.qfi:last-child:nth-child(odd){grid-column:1/-1;border-inline-end:0}
@media(max-width:640px){
  .qf{grid-template-columns:1fr}
  .qfi{border-inline-end:0!important;border-top:1px solid var(--border)}
  .qfi:first-child{border-top:0}
  .qfi{padding:11px 14px}
}

/* (جولة الصقل) شروط الأهلية: كانت ٥ صناديق بيضا منفصلة بظل لكل شرط —
   تفتيت بلا وظيفة. صندوق واحد وصفوف بفواصل رفيعة، والأيقونة جنب العنوان. */
.crit{display:grid;margin-top:4px;background:var(--white);border:1px solid var(--border);border-radius:14px;box-shadow:var(--sh-1);overflow:hidden}
.cr{display:flex;gap:12px;align-items:flex-start;padding:13px 16px;border-top:1px solid var(--border)}
.cr:first-child{border-top:0}
.cr .cric{font-size:17px;line-height:1.35;flex:none;width:26px;text-align:center}
.cr .crtx{min-width:0}
.cr .crtx>b{display:block;font-size:14px;color:var(--navy);line-height:1.5}
.cr .crtx p{font-size:13px;color:var(--n70);line-height:1.9;margin-top:3px}
.cr.warn{background:var(--cr-warn-bg);border-color:rgba(154,107,0,.22)}
.cr.warn .crtx b{color:var(--amber)}
@media(max-width:520px){.cr{padding:12px 13px;gap:10px}.cr .cric{width:22px;font-size:16px}}

/* سطر التحفّظ تحت قيمة الصندوق — «مجانية» وتحتها «المشاركة بس».
   الرقم لوحده بيكذب أحيانًا؛ السطر ده بيمنع سوء الفهم. */

/* 🔴 الأكورديون لازم يبان إنه بيتفتح — الشكل القديم كان سهم باهت
   في آخر السطر، فالطالب كان بيقرا السؤال ويعدّي من غير ما يعرف إن
   تحته إجابة. دلوقتي: زرار دائري بحدود + خلفية واضحة وهو مفتوح. */
details.acc summary .ar{margin-right:auto;color:var(--goldText);font-size:12px;transition:transform .25s,background .2s,border-color .2s;width:26px;height:26px;border:1.5px solid rgba(200,169,107,.5);border-radius:999px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--white)}
details.acc summary:hover .ar{background:var(--cream);border-color:var(--goldText)}
details.acc[open]{border-color:rgba(200,169,107,.55);box-shadow:var(--sh-2)}
details.acc[open] summary{background:var(--soft2)}
details.acc[open] summary .ar{background:var(--gold);border-color:var(--goldText);color:var(--navy-k)}
/* تلميح فوق الأسئلة — سطر واحد بيقول للطالب إن دي عناصر بتتفتح */
.acchint{font-size:12px;color:var(--n62);margin:-2px 0 12px}
.acchint b{color:var(--goldText)}

/* ⏳ العدّاد التنازلي — الرقم بارز والتاريخ جنبه دايمًا.
   محسوب من التاريخ في الداتابيز وقت البناء، فبيتحدّث لوحده كل يوم. */
/* ⏳ (الصقل Premium) العدّاد: كان كبسولة **ممتلئة بحد ذهبي** جنب عنوان
   13px ⇒ أعلى عنصر صوتًا في الكارت هو التاريخ مش اسم الفرصة.
   دلوقتي: نفس المعلومة بالحرف، بخلفية أهدى وبلا حد — بتفضل واضحة
   للمسح السريع لكن ما بتسبقش الاسم. الحالة العاجلة (`.urg`) فضلت
   بكامل صوتها الأحمر: العاجل **لازم** يصرخ. */
.cd{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;background:color-mix(in srgb,var(--gold) 11%,transparent);border:1px solid transparent;border-radius:999px;padding:6px 13px 6px 11px;margin-top:6px;align-self:flex-start}
/* 🇷🇺 `white-space:nowrap` كان بيمنع اللفّ، والنص الروسي («Ожидается
   открытие…») أطول من العربي بمرّة ونص ⇒ الكبسولة بتخرج ٢٨px بره
   الشاشة على 320px. اللفّ مسموح دلوقتي والكبسولة مسقوفة بعرض أبوها. */
.cd{max-width:100%}
.cd .n{font-family:'Inter','IBM Plex Sans Arabic',sans-serif;font-weight:800;font-size:13px;color:var(--navy);letter-spacing:-.01em;overflow-wrap:anywhere}
@media(min-width:520px){.cd .n{white-space:nowrap}}
.cd .sep{width:1px;height:13px;background:rgba(7,20,38,.14);flex:none}
/* 🐞 (الصقل Premium) تصادم كلاسات حقيقي اتكشف بالقياس:
   التاريخ جوّه الكبسولة اسمه `.dt` — **نفس** كلاس سطر الحالة بره.
   فكان بياخد من `.dt` العامة (`display:flex;gap:7px;margin-top:10px`)
   ومن `.opp .dt` (`padding-top:12px;border-top:1px solid;margin-bottom:14px`)
   ⇒ الكبسولة ارتفاعها **59px** بدل ٣٢، وجوّاها خط فاصل مالوش لازمة،
   والتاريخ مزحزح عن خط الأساس بتاع الرقم اللي جنبه.
   الإصلاح: تصفير صريح للورث ده جوّه الكبسولة بس. */
.cd .dt{display:inline;align-items:initial;gap:0;margin:0;padding:0;border:0;
  font-weight:400;font-size:12.5px;line-height:1.7;color:var(--n62);white-space:nowrap}
/* 🗂️ جسم كارت «قريبًا» — الوصف والمدينة والرابط الرسمي.
   الكارت كان اسم + كلمة «قريبًا» بس، والوصف المُراجَع مدفون في الداتابيز. */
.ocard .onote{font-size:12.5px;line-height:1.8;color:var(--n70);margin:7px 0 0;
  /* 📜 (الصقل ١٨) النوتة ٢٩١ حرفًا متوسطًا × ٢٧٦ كارت = صفحة مرهقة للمسح.
     سطران وبس على الكارت — «كافي تقرّر، قصير تمسح» — والكامل في صفحته. */
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ocard .ometa{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:9px}
.ocard .ometa-i{font-size:12.5px;color:var(--n62);display:inline-flex;align-items:center;gap:4px}
.ocard .olink{color:var(--navy);font-weight:700;text-decoration:none;
  border-bottom:1px solid rgba(200,169,107,.55);padding-bottom:1px}
.ocard .olink:hover{border-bottom-color:var(--goldText)}
/* الحالة تفضل آخر حاجة في الكارت مهما طال الوصف */
/* (أُزيلت هنا قاعدة عرض زائدة لكروت «قريبًا» — كانت مكررة عن قاعدة .ocard الأساسية، وموضعها بعد قاعدة الإخفاء كان يبطل إخفاء الكروت في كل الفلاتر — R2) */
.ocard.soon .state{margin-top:auto;padding-top:10px}

/* 🗓️ «متوقّع يفتح …» — تقدير مش تاريخ مؤكد.
   لازم يبان **مختلف** عن العدّاد المؤكد بالعين المجردة: بلا خلفية كريمية،
   وحدود متقطّعة، ولون أهدأ. الشكل نفسه بيقول «ده تقدير» حتى قبل ما تقرا. */
.cd.est{background:transparent;border-style:dashed;border-color:rgba(7,20,38,.22)}
.cd.est .n{color:var(--n70);font-weight:700}

/* أقل من ٧ أيام — الأحمر بيخلق الإلحاح */
.cd.urg{background:var(--warn-bg);border-color:rgba(214,40,57,.32)}
.cd.urg .n{color:var(--red)}
.cd.urg .sep{background:rgba(214,40,57,.25)}
.cd.urg .dt{color:var(--warn-tx2)}
/* نبضة خفيفة للعاجل — بتوقف لو المستخدم طالب تقليل الحركة */
@media(prefers-reduced-motion:no-preference){
  .cd.urg::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red);flex:none;animation:cdpulse 2s ease-in-out infinite}
  @keyframes cdpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.82)}}
}
@media(prefers-reduced-motion:reduce){
  .cd.urg::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red);flex:none}
}
/* على الكروت الضيقة */
.opp .cd,.card .cd{margin-top:6px}
@media(max-width:520px){
  .cd{padding:5px 11px 5px 9px;gap:6px}
  .cd .n{font-size:12.5px}.cd .dt{font-size:12px}
}

/* ═══════════ قسم Open Doors — od-* ═══════════
   نفس توكنز الهوية بالظبط. 🔴 الأحمر (var(--red)) هنا في حاجتين بس:
   الأحداث الحرجة في التايم لاين و.note.warn الموجودة أصلًا. ممنوع أي أزرق فاتح. */

/* شريط حالة الدورة */
.odbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--white);border:1px solid var(--border);border-radius:18px;padding:10px 14px;margin-top:14px;font-size:12.5px}
.odbar .od-cycle{font-weight:600;color:var(--goldText);background:var(--cream);border-radius:999px;padding:4px 12px;font-size:12.5px;flex:none}
.odbar .od-st{font-weight:600;font-size:12.5px}
.odbar .cd{margin-top:0}
.odbar .od-next{color:var(--n62);font-size:12.5px}
.odbar .od-next b{color:var(--navy);font-weight:700}

/* تنقّل القسم — أزرار واضحة (اتقوّت 2026-08-07 بعد ملاحظة عبدالرحمن:
   الشكل الباهت مكانش بيقول «أنا زرار»). بيج الكروت + حد ذهبي للنشط —
   ومفيش أزرق، والأحمر للمواعيد بس. */
.od-nav{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0 6px}
.od-nav a{font-size:13px;font-weight:600;color:var(--navy);background:var(--cream);border:1.5px solid rgba(200,169,107,.35);border-radius:999px;padding:9px 17px;text-decoration:none;box-shadow:var(--sh-2);transition:border-color .16s,background .16s,transform .14s}
.od-nav a:hover{border-color:var(--goldText);background:var(--white);transform:translateY(-1px)}
.od-nav a:active{transform:scale(.97)}
.od-nav a.on{background:var(--white);border:2px solid var(--gold);color:var(--navy);box-shadow:0 6px 16px -8px rgba(200,169,107,.8)}

/* عناوين القسم */
.od-h1{font-weight:700;font-size:clamp(22px,4.5vw,30px);line-height:1.35;margin:18px 0 12px}
.od-h1-sub{font-size:13px;font-weight:600;color:var(--n62);white-space:nowrap}
.od-hero .od-stats{display:flex;gap:9px;flex-wrap:wrap;align-items:center;font-size:13px;font-weight:600;color:var(--goldSoft);margin:4px 0 2px}
.od-hero .od-stats i{color:var(--cream45);font-style:normal}

/* الملاحظة الرمادية الصريحة — بديل القايمة الفاضية */
.od-none{background:var(--soft);border:1px dashed var(--n35);border-radius:12px;padding:10px 14px;font-size:12.5px;color:var(--n62);margin:10px 0}
.od-none-sm{display:inline-block;padding:3px 10px;font-size:12px;margin:6px 0 0;border-radius:999px}

/* شارة الثقة — ترجمة confidence لجملة. أخضر/ذهبي/كهرماني/رمادي — مفيش أحمر */
.od-conf{display:inline-block;font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;margin:4px 0 0;border:1px solid transparent}
.od-conf-ok{background:rgba(10,125,77,.1);color:var(--green);border-color:rgba(10,125,77,.25)}
.od-conf-gold{background:var(--cream);color:var(--gold-tx);border-color:rgba(200,169,107,.4)}
.od-conf-mid{background:rgba(154,107,0,.08);color:var(--amber);border-color:rgba(154,107,0,.22)}
.od-conf-none{background:var(--soft);color:var(--n62);border-color:var(--n35);border-style:dashed}

/* شبكة كروت القسم */
.od-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:8px 0}
.od-card{display:flex;flex-direction:column;gap:5px;background:var(--white);border:1px solid var(--border);border-radius:18px;padding:15px;text-decoration:none;color:var(--navy);transition:transform .2s,box-shadow .2s,border-color .2s}
.od-card:hover{transform:translateY(-3px);border-color:var(--goldText);box-shadow:var(--sh-2)}
.od-card b{font-size:14px;line-height:1.7}
.od-card>span{font-size:12.5px;color:var(--n62)}
.od-en{font-size:12px;color:var(--n62)}
.od-code{font-weight:700;font-size:12px;color:var(--goldText);background:var(--cream);border-radius:8px;padding:2px 8px;align-self:flex-start}
.od-city{font-size:12.5px;color:var(--n62)}
.od-count{font-size:12.5px;color:var(--green);font-weight:600}
/* رابط مستقل (مش جوّه جملة) ⇒ لازم يوصل ٤٤px. الهامش السالب بيحافظ على الشكل. */
.od-more{display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:600;color:var(--goldText);text-decoration:none;margin-top:4px;padding-block:12px;margin-block:-8px;padding-inline:8px;margin-inline:-8px;border-radius:8px}
.od-more:hover{text-decoration:underline}

/* الملخّص السريع + صفوف الحقائق */
.od-qf dl,.od-facts{display:flex;flex-direction:column;gap:0}
.od-qfrow{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px dashed var(--border);font-size:13px}
.od-qfrow:last-child{border-bottom:0}
.od-qfrow dt{color:var(--n62);flex:none}
.od-qfrow dd{font-weight:600;text-align:left}

/* التغطية: مغطى / مش مغطى / حسب الجامعة */
.od-covgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:10px;margin:8px 0}
.od-cov{background:var(--white);border:1px solid var(--border);border-radius:18px;padding:14px}
.od-cov>b{display:block;font-size:13px;margin-bottom:8px}
.od-cov ul{margin:0;padding-right:18px;font-size:13px;color:var(--n70);line-height:1.9}
.od-cov-ok>b{color:var(--green)}
.od-cov-no>b{color:var(--n62)}
.od-cov-mid>b{color:var(--amber)}
.od-covnote{color:var(--n62);font-size:12.5px}

/* التايم لاين الرأسي */
.od-tl{list-style:none;margin:14px 0;padding:0;position:relative}
.od-tl::before{content:"";position:absolute;top:6px;bottom:6px;right:7px;width:2px;background:var(--border)}
.od-ev{position:relative;padding:0 30px 22px 0}
.od-ev-dot{position:absolute;right:0;top:5px;width:16px;height:16px;border-radius:50%;background:var(--white);border:3px solid var(--gold);z-index:1}
.od-ev.st-completed .od-ev-dot{border-color:var(--n35);background:var(--cream)}
.od-ev.st-active .od-ev-dot{border-color:var(--green);box-shadow:0 0 0 4px rgba(10,125,77,.15)}
.od-ev.crit .od-ev-dot{border-color:var(--red)}
.od-ev-date{font-weight:600;font-size:13px}
.od-ev.crit .od-ev-date{color:var(--red)}
.od-ev.st-completed .od-ev-body{opacity:.62}
.od-ev-title{display:block;font-size:13px;margin-top:2px}
.od-ev-desc,.od-ev-act{font-size:12.5px;color:var(--n70);margin-top:3px}
.od-evst{font-size:12px;font-weight:600;border-radius:999px;padding:2px 9px;margin-inline-start:7px;vertical-align:2px}
.od-evst-upcoming{background:var(--cream);color:var(--gold-tx)}
.od-evst-active{background:rgba(10,125,77,.12);color:var(--green)}
.od-evst-completed{background:var(--soft);color:var(--n62)}
.od-tl-sm .od-ev{padding-bottom:14px}

/* شرايح المسارات */
.od-chips{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 0}
.od-chip{font-size:12px;font-weight:600;color:var(--n70);background:var(--soft);border:1px solid var(--border);border-radius:999px;padding:2px 9px;text-decoration:none}
a.od-chip:hover{border-color:var(--goldText);color:var(--goldText)}

/* جدول التخصصات — على الموبايل الصفوف بتتكسر كروت (برييف §8) */
.od-tblwrap{overflow-x:auto;margin:10px 0}
.od-tbl{width:100%;border-collapse:collapse;font-size:12.5px;background:var(--white);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.od-tbl th{background:var(--cream);color:var(--navy);font-size:12.5px;text-align:right;padding:9px 12px}
.od-tbl td{padding:9px 12px;border-top:1px solid var(--border);vertical-align:top}
@media(max-width:560px){
  .od-tbl thead{display:none}
  .od-tbl,.od-tbl tbody,.od-tbl tr,.od-tbl td{display:block;width:100%}
  .od-tbl tr{border-top:2px solid var(--border);padding:6px 0}
  .od-tbl td{border-top:0;padding:4px 12px}
  .od-tbl td::before{content:attr(data-l) " · ";color:var(--n62);font-size:12px;font-weight:600}
}

/* البحث */
.od-search{margin:10px 0}
.od-search input{width:100%;font:inherit;font-size:13px;background:var(--white);border:1.5px solid var(--border);border-radius:12px;padding:12px 16px;color:var(--navy)}
.od-search input:focus{outline:none;border-color:var(--goldText)}

/* مؤشر الأهلية */
.od-wizard .od-q{margin-bottom:14px;display:flex;flex-direction:column;gap:6px}
.od-wizard label{font-size:13px}
.od-wizard select,.od-wizard input{font:inherit;font-size:13px;background:var(--beige);border:1.5px solid var(--border);border-radius:12px;padding:10px 13px;color:var(--navy)}
.od-wizard select:focus,.od-wizard input:focus{outline:none;border-color:var(--goldText)}
.od-hint{font-size:12.5px;color:var(--n62)}
.od-wizout{margin-top:14px;border-top:1px dashed var(--border);padding-top:12px}
.od-wizres{font-weight:600;font-size:14px;background:var(--cream);border-radius:12px;padding:12px 15px}

/* متفرقات */
.od-warn ul{margin:6px 0 0;padding-right:18px}
.od-src{font-size:12.5px;color:var(--n62);margin:10px 0 0}
.od-src a{color:var(--goldText);font-weight:600;text-decoration:none}
.od-foot{border-top:1px solid var(--border);margin-top:26px;padding:8px 0 22px}
.od-links{font-size:12.5px}
.od-links-blk{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}
.od-btns{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.od-why{margin-top:8px;font-size:12.5px}
.od-why>b{color:var(--goldText)}
.od-soon p{font-size:14px;margin-bottom:8px}
.od-trk h3 .od-en{margin-inline-start:6px}
.odsec.is-hidden,.od-ev.is-hidden,.od-card.is-hidden,.od-noresults.is-hidden{display:none}

/* مُدخل تاريخ الميلاد (يوم/شهر/سنة) + جملة النافذة */
.od-dob{display:flex;gap:8px}
.od-dob input,.od-dob select{flex:1;min-width:0}
.od-dob input#odDobY{flex:1.4}
.od-dobwin{background:var(--soft);border:1px solid var(--border);border-radius:12px;padding:10px 14px;font-size:13px;margin:8px 0;line-height:1.9}
.od-dobwin b{color:var(--navy)}
.od-hub{margin-top:16px}

/* شارات الأكواد — نظامان ترقيم: OKSO الجامعي (ذهبي) والتخصصات العلمية للدكتوراه (كحلي محدد) */
.od-codetag{display:inline-block;font-weight:600;font-size:12.5px;border-radius:8px;padding:2px 9px;letter-spacing:.02em}
.od-codetag-okso{background:var(--cream);color:var(--gold-tx);border:1px solid rgba(200,169,107,.45)}
.od-codetag-sci{background:var(--white);color:var(--navy);border:1.5px solid var(--navy2)}
.od-codelegend{margin:8px 2px 0;line-height:1.9}

/* دفعة 2F: ملاحظات المصدر والتغطية والمنحة الشهرية */
.od-covline{background:var(--cream);border:1px solid rgba(200,169,107,.4);border-radius:12px;padding:9px 14px;font-size:13px;font-weight:600;margin:10px 0 0}
.od-srcissue{display:block;font-size:12px;color:var(--amber);margin-top:5px;line-height:1.9}
.od-stipend{margin-top:10px}
.od-stipend p{margin-bottom:8px}
.od-evst-crit{background:rgba(214,40,57,.1);color:var(--red)}
.od-evst-remain{background:var(--cream);color:var(--gold-tx)}
.od-pdnotice p{margin-bottom:8px;line-height:1.9}
.od-faqopen h3{font-size:15px;margin-bottom:10px}
.od-faqopen .od-faqnote{margin-top:10px}
.od-intro{margin:0 0 14px;color:var(--n70)}
.od-cycleunknown{color:var(--amber)}

/* القواعد الـ66: رقم البند + التمييز الأحمر للحرج (استخدام مشروع للأحمر) */
.od-rulenum{display:inline-block;font-weight:700;font-size:12px;color:var(--goldText);background:var(--cream);border-radius:8px;padding:1px 8px;margin-inline-end:4px}
.od-rule-crit{border-inline-start:4px solid var(--red)}
.od-rule-crit .od-rulenum{color:var(--red);background:rgba(214,40,57,.08)}
.od-why{margin-top:10px}
.od-why>b{color:var(--goldText);display:block;margin-bottom:4px}
.od-why p{margin:0;line-height:1.9}

/* ═══════════════════════════════════════════════════════════════════════
   🎙️ الجلسات المباشرة (/sessions/*) + لوحة الجلسات — المرحلة (أ)
   بيعيد استخدام متغيرات الهوية الموجودة (gold/cream/n70/amber/red).
   ═══════════════════════════════════════════════════════════════════════ */

/* — قايمة الجلسات — */
.ses-disclaimers ul{margin:0;padding-inline-start:20px}
.ses-disclaimers li{line-height:1.9;font-weight:600}
.ses-filters{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 10px}
/* هدف اللمس: كانت ٣٩px — وهي فلاتر رئيسية على الموبايل. */
.ses-fbtn{background:var(--cream);border:1px solid rgba(200,169,107,.4);border-radius:999px;
  min-height:44px;display:inline-flex;align-items:center;
  padding:10px 17px;font:inherit;font-size:13.5px;font-weight:600;cursor:pointer;color:inherit;
  transition:background var(--t-fast),border-color var(--t-fast)}
.ses-fbtn:hover{border-color:var(--gold);background:var(--white)}
.ses-fbtn.on{background:var(--gold);color:var(--navy-k);border-color:var(--goldText)}
.ses-tz{margin:0 0 18px}
.ses-list{margin-top:6px}
.ses-card{position:relative}
.ses-aud{display:inline-block;font-size:12px;font-weight:600;color:var(--goldText);
  background:var(--cream);border-radius:8px;padding:2px 10px;margin-bottom:8px}
.ses-facts{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px;
  font-size:13px;color:var(--n70)}
.ses-facts li{display:flex;align-items:center;gap:5px}
.ses-facts li::before{content:"·";color:var(--goldText);font-weight:700}
.ses-facts li:first-child::before{content:"🗓"}
.ses-seats{font-weight:700}

/* — صفحة الجلسة — */
.ses-meta{margin:16px 0}
.ses-metarow{display:flex;justify-content:space-between;gap:16px;padding:9px 0;
  border-bottom:1px solid rgba(200,169,107,.18)}
.ses-metarow:last-of-type{border-bottom:0}
.ses-metarow span{color:var(--n70)}
.ses-check{list-style:none;margin:0 0 14px;padding:0}
.ses-check li{display:flex;align-items:center;gap:10px;padding:7px 0;line-height:1.9}
.ses-check li .ck{font-size:16px;width:22px;text-align:center}
.ses-check li.ok{color:var(--goldText);font-weight:600}
.ses-acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.ses-fld .req{color:var(--red);font-weight:700}

/* — لوحة الجلسات — */
.asbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:16px 0}
.asbar input,.asbar select{background:var(--cream);border:1px solid rgba(200,169,107,.4);
  border-radius:8px;padding:8px 12px;font:inherit;font-size:13px;color:inherit}
.asbulk{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px;font-size:13px;color:var(--n70)}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.atable{width:100%;border-collapse:collapse;font-size:13px;min-width:720px}
.atable th,.atable td{padding:9px 10px;text-align:start;border-bottom:1px solid rgba(200,169,107,.2);vertical-align:top}
.atable th{font-weight:700;color:var(--goldText);white-space:nowrap}
.atable td.nowrap{white-space:nowrap}
.atable select,.atable input[type=text]{background:var(--cream);border:1px solid rgba(200,169,107,.35);
  border-radius:8px;padding:5px 8px;font:inherit;font-size:12px;color:inherit;max-width:180px}
.atable .ansc{max-width:280px;font-size:12px;line-height:1.8}
.atable .bad{color:var(--red);font-size:12px}
/* النسخة الصغيرة بتتحرّر من أرضية الـ48px بتاعة الزر الأساسي — بس
   بأرضية لمس 36px (زر ثانوي جوّه صفّ، مش هدف أساسي). */
.ghost.sm{padding:6px 12px;font-size:12.5px;min-height:36px}
.ascounts{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.ascount{background:var(--cream);border:1px solid rgba(200,169,107,.35);border-radius:12px;
  padding:10px 18px;text-align:center;min-width:88px}
.ascount b{display:block;font-size:21px;color:var(--goldText);line-height:1.35}
.ascount span{font-size:12px;color:var(--n70)}
.asjoin{margin:14px 0}
.qedit{display:grid;gap:14px;margin-bottom:14px}
.qrow{background:var(--cream);border:1px solid rgba(200,169,107,.3);border-radius:12px;padding:14px}
.qhead{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.qacts{display:flex;gap:6px}

/* ═══════════════════════════════════════════════════════════════════════
   📄 خدمة الترجمة — الصفحة العامة · صفحات الطالب · لوحة المترجم
   ⚠️ نفس التوكنز الموجودة (بيج · ذهبي · كريمي · نيفي). الأحمر --red
      **للمواعيد المتأخرة بس** — ولا زر ولا حالة عادية بتستعمله.
   ═══════════════════════════════════════════════════════════════════════ */
.tr-list{list-style:none;display:grid;gap:10px}
.tr-list li{padding-inline-start:20px;position:relative;font-size:14px;line-height:1.9}
.tr-list li::before{content:"";position:absolute;inset-inline-start:0;top:12px;
  width:7px;height:7px;border-radius:50%;background:var(--gold)}
.tr-steps{list-style:none;counter-reset:s;display:grid;gap:12px}
.tr-steps li{counter-increment:s;padding-inline-start:38px;position:relative;font-size:14px;line-height:1.9}
.tr-steps li::before{content:counter(s);position:absolute;inset-inline-start:0;top:2px;
  width:26px;height:26px;border-radius:50%;background:var(--cream);color:var(--goldText);
  border:1px solid rgba(200,169,107,.45);display:grid;place-items:center;font-weight:600;font-size:13px}
.tr-tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tr-table{width:100%;border-collapse:collapse;font-size:13px;min-width:460px}
.tr-table th,.tr-table td{padding:11px 12px;text-align:start;border-bottom:1px solid rgba(200,169,107,.22);vertical-align:top}
/* 🎨 صف العناوين بخلفية كريمي خفيفة — بيفصل الرأس عن الصفوف بدل ما
      الجدول يبان كتلة واحدة. و`--goldText` مش `--gold`: الذهبي الهوياتي
      تباينه ≈2.2:1 على الأبيض و**مش كفاية للنص** (نفس ملاحظة `:root`). */
.tr-table thead th{font-weight:700;color:var(--goldText);white-space:nowrap;
  background:var(--soft);border-bottom-color:rgba(200,169,107,.4)}
.tr-table thead th:first-child{border-start-start-radius:10px}
.tr-table thead th:last-child{border-start-end-radius:10px}
.tr-table tbody tr:last-child th,.tr-table tbody tr:last-child td{border-bottom:0}
.tr-table tbody tr:hover td{background:rgba(239,230,214,.28)}
.tr-table td.tr-price{font-weight:600}
.tr-policy{border-inline-start:3px solid var(--gold)}

/* — كروت الطلبات (الطالب واللوحة) — */
.tr-orders{display:grid;gap:12px}
.tr-card{display:block;background:var(--white);border:1px solid var(--border);border-radius:12px;
  padding:14px;text-decoration:none;color:inherit;transition:border-color .16s,transform .16s}
a.tr-card:hover{border-color:var(--goldText);transform:translateY(-1px)}
.tr-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.tr-card-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:var(--n70);margin-top:4px}
.tr-badge{background:var(--cream);color:var(--navy);border:1px solid rgba(200,169,107,.45);
  border-radius:999px;padding:4px 12px;font-size:12px;font-weight:600;white-space:nowrap}
.tr-badge.s-delivered{background:var(--gold);color:var(--navy-k);border-color:var(--goldText)}
.tr-badge.s-cancelled{background:transparent;color:var(--n62)}
.tr-dot{display:inline-block;margin-top:8px;background:var(--gold);color:var(--navy-k);
  border-radius:999px;padding:2px 10px;font-size:12.5px;font-weight:600}
/* 🔴 الأحمر هنا **بس**: موعد الطالب عدّى والطلب لسه شغّال */
.tr-late{color:var(--red);font-weight:700}

.tr-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:18px 0 6px}
.tr-head h1{font-size:21px;line-height:1.5}

.tr-timeline{list-style:none;display:grid;gap:10px}
.tr-timeline li{padding-inline-start:18px;position:relative;font-size:13px}
.tr-timeline li::before{content:"";position:absolute;inset-inline-start:0;top:9px;
  width:8px;height:8px;border-radius:50%;background:var(--gold)}
.tr-timeline li b{display:block;font-weight:600}

.tr-file{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:10px 0;border-bottom:1px solid rgba(200,169,107,.2);font-size:13px}
.tr-file:last-child{border-bottom:0}
.tr-file .lt{display:block;font-size:12px}
.tr-final{background:var(--cream);border:1px solid rgba(200,169,107,.45);border-radius:12px;
  padding:14px;display:grid;gap:10px;margin-bottom:12px;justify-items:start}

/* ─── 🔁 دورات التعديل + تاريخ النسخ (١٤ سبتمبر ٢٠٢٦) ────────────────
   الليبل هو المنتج هنا: الطالب لازم يعرف في لمحة أنهي نسخة «الحالية»
   وأنهي «سابقة» — نسختان بنفس الشكل بتخلّيه يفتح الغلط ويمشي بيه. */
.tr-ver.is-current{background:var(--cream);border-radius:10px;padding-inline:10px}
.tr-verchip{display:inline-block;margin-inline-start:8px;padding:2px 9px;border-radius:999px;
  font-size:11.5px;font-weight:600;vertical-align:middle}
.tr-verchip.cur{background:var(--gold);color:var(--navy-k)}
.tr-verchip.old{background:transparent;color:var(--n62);border:1px solid var(--border)}

.tr-revhead{display:grid;gap:10px;justify-items:start;padding-bottom:12px;
  border-bottom:1px solid rgba(200,169,107,.25);margin-bottom:12px}
.tr-revhead .tr-rev-form{display:grid;gap:10px;width:100%}

.tr-rev{border:1px solid var(--border);border-radius:14px;padding:14px;margin-bottom:12px;
  background:var(--white);display:grid;gap:10px}
.tr-rev.s-needs_student{border-inline-start:3px solid var(--red)}
.tr-rev.s-delivered{border-inline-start:3px solid var(--green)}
.tr-rev.s-in_progress{border-inline-start:3px solid var(--gold)}
.tr-rev-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tr-rev-flag{background:var(--red-solid);color:#fff;border-radius:8px;padding:7px 11px;
  font-size:12.5px;font-weight:600;justify-self:start}
.tr-rev-dates{display:flex;flex-wrap:wrap;gap:12px;font-size:12px}
.tr-rev-threadk{font-size:12.5px;font-weight:600;color:var(--goldText);margin-top:4px}
.tr-rev-thread{max-height:280px}
.tr-badge[class*="rs-"]{background:var(--cream)}
.tr-badge.rs-delivered{background:var(--gold);color:var(--navy-k);border-color:var(--goldText)}
.tr-badge.rs-needs_student{background:var(--red-solid);color:#fff;border-color:var(--red-solid)}

/* 🚩 «محتاج إجراء منك» — على الكارت في القايمة وفوق صفحة الطلب.
   الطلب حالته «اتسلّم»، فمن غير الشارة دي الطالب مش هيدوّر أصلًا. */
.tr-need{display:inline-block;margin-top:8px;background:var(--red-solid);color:#fff;
  border-radius:999px;padding:3px 11px;font-size:11.5px;font-weight:600}
.tr-need-banner{margin:10px 0 0;background:var(--red-solid);color:#fff;border-radius:10px;
  padding:10px 13px;font-size:13px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tr-need-banner .lt{color:rgba(255,255,255,.85);font-size:12px}

/* — تفاصيل الدفع: السرّ اللي مابيظهرش غير بعد خمس بوابات في الداتابيز — */
.tr-paydetails{margin:10px 0 14px;font-size:13px;line-height:1.9}
.tr-account{background:var(--cream);border:1px dashed rgba(200,169,107,.6);border-radius:8px;
  padding:12px;margin-top:8px;display:grid;gap:6px}
.tr-account code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;
  word-break:break-all;color:var(--navy)}

/* — الشات — */
.tr-chat{display:grid;gap:10px;max-height:380px;overflow-y:auto;padding-inline-end:4px}
.tr-msg{border-radius:12px;padding:10px 12px;font-size:13px;max-width:88%}
.tr-msg.me{background:var(--cream);justify-self:start}
.tr-msg.them{background:var(--white);border:1px solid var(--border);justify-self:end}
.tr-msg-who{font-size:12.5px;font-weight:600;color:var(--goldText);margin-bottom:4px}
.tr-msg-body{white-space:pre-line;line-height:1.9}
.tr-msg-att{margin-top:6px;font-size:12.5px}
.tr-msg-time{font-size:12px;margin-top:6px}

/* — 🔁 دورات التعديل في لوحة المترجم — */
.tv-revs{display:grid;gap:12px}
.tv-rev{border:1px solid var(--border);border-radius:14px;padding:12px 14px;
  background:var(--white);display:grid;gap:10px}
.tv-rev.s-requested{border-inline-start:3px solid var(--red)}
.tv-rev.s-in_progress{border-inline-start:3px solid var(--gold)}
.tv-rev.s-needs_student{border-inline-start:3px solid var(--amber)}
.tv-rev.s-delivered{border-inline-start:3px solid var(--green)}
.tv-rev-text{white-space:pre-line;line-height:1.9;font-size:13px;background:var(--beige);
  border-radius:10px;padding:10px 12px}
.tv-rev-threadk{font-size:12.5px;font-weight:600;color:var(--goldText)}
.tv-rev-thread{max-height:260px}
/* الشارة على الكارت في القايمة — «تعديل جديد» لازم يبان من بعيد */
.tr-badge.tv-revnew{background:var(--red-solid);color:#fff;border-color:var(--red-solid)}
.tr-badge.tv-revwait{background:transparent;color:var(--amber);border-color:var(--amber)}
.tr-badge.tv-revwork{background:var(--cream);color:var(--goldText)}

/* — لوحة المترجم — */
/* 🚦 شريط طوابير المترجم (P1-07) — chips بعدّادات بدل قايمة منسدلة.
   الطابور العاجل (متأخر/النهاردة) بيتعلّم بالأحمر لما فيه حاجة فعلًا. */
.tv-queues{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.tv-queue{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;
  border:1px solid var(--border);border-radius:999px;background:var(--white);
  font-family:inherit;font-size:13px;font-weight:600;color:var(--n70);cursor:pointer;
  transition:border-color .14s,background .14s,color .14s}
.tv-queue:hover{border-color:var(--gold)}
.tv-queue.on{background:var(--navy);border-color:var(--navy);color:var(--beige)}
.tv-queue .tv-qn{font-family:Inter,system-ui,sans-serif;font-variant-numeric:tabular-nums;
  font-size:12px;font-weight:700;background:var(--cream);color:var(--navy);
  border-radius:999px;padding:1px 8px;min-width:22px;text-align:center}
.tv-queue.on .tv-qn{background:var(--gold);color:var(--navy-k)}
.tv-queue.urgent{border-color:var(--red);color:var(--red)}
.tv-queue.urgent .tv-qn{background:var(--red-solid);color:var(--white-k)}
.tv-queue.urgent.on{background:var(--red-solid);border-color:var(--red-solid);color:var(--white-k)}
.tv-filters{display:flex;flex-wrap:wrap;gap:12px}
.tv-filters .fld{flex:1 1 200px;margin:0}
.tv-card{background:var(--white)}
.tv-detail{margin-top:14px;border-top:1px solid rgba(200,169,107,.3);padding-top:14px;display:grid;gap:16px}
.tv-sec{display:grid;gap:8px}
.tv-sec>b{color:var(--goldText);font-size:13px}
.tv-grid{display:flex;flex-wrap:wrap;gap:10px}
.tv-grid .fld{flex:1 1 130px;margin:0}
.tv-actions{display:flex;flex-wrap:wrap;gap:8px}
.tv-rule,.tv-method,.tv-fx{background:var(--cream);border:1px solid rgba(200,169,107,.3);
  border-radius:12px;padding:14px;margin-bottom:12px;display:grid;gap:8px}
.tv-rule-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.tv-fx{align-items:end}
@media(max-width:520px){
  .tr-card-top{flex-direction:column;align-items:flex-start;gap:6px}
  .tr-msg{max-width:100%}
}

/* ═══════════════════════════════════════════════════════════════════════
   /services/ — قسم الخدمات المدفوعة
   ═══════════════════════════════════════════════════════════════════════
   🎨 مراجعة بصرية ٢٣ أغسطس ٢٠٢٦. الصفحة كانت شغّالة بس فاضية:
     • الهيرو ٢٤٧px كحلي صلب، والوصف ٣ أسطر جوّاه
     • الكارت `padding:14px` بلا ظل، والعنوان ١٦px زي المتن
     • الـCTA `span.more` **مالوش أي قاعدة CSS** ⇒ نص ١٦px عادي
     • المسافة بين الهيرو والكارت = صفر · و٣٦٦px فاضية تحت التوقيع
   ⛔️ كل حاجة هنا مسبوقة بـ`.svc-` أو متداخلة جوّه `.svc-hero` — صفر
      تعديل على أي قاعدة قايمة، فمفيش صفحة تانية بتتأثر.
   🎯 وكل لون من متغيّرات الهوية — مفيش لون جديد اتخترع. */

/* الهيرو: أخف وأقصر على الصفحة دي بس. التدرّج بيكسر صلابة الكحلي،
   والـglow بيتوسّع شوية عشان الكتلة تبان أنعم من غير زخرفة زيادة. */
.svc-hero .hero-slim{padding:30px 26px 26px;
  background:var(--feature-bg, linear-gradient(160deg,var(--navy-k) 0%,var(--navy2-k) 100%))}
.svc-hero .hero-slim .glow{width:340px;height:340px;top:-26%;right:-14%;
  background:radial-gradient(circle,rgba(200,169,107,.22),transparent 68%)}
.svc-hero .hero-slim h1{font-size:clamp(24px,4.2vw,33px);margin-bottom:10px}
.svc-hero .hero-slim .lead{max-width:52ch;font-size:14px;line-height:1.9;
  color:var(--cream60)}

/* شبكة الخدمات — عمودان من ٧٢٠px، وواحد على الموبايل */
/* `auto-fit` بدل `repeat(2,1fr)` + `:has()`: خدمة واحدة بتملا العرض،
   واتنتين بيتقسموا — من غير ما نعتمد على دعم `:has()` أصلًا. */
.svc-grid{display:grid;gap:14px;margin-top:16px;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}

/* الكارت — نفس لغة `.opp`: خط ذهبي فوق، حدود، وظل خفيف جدًا */
.svc-card{position:relative;display:flex;flex-direction:column;
  background:var(--white);border:1px solid var(--border);border-radius:18px;
  padding:22px 22px 18px;overflow:hidden;text-decoration:none;color:var(--navy);
  box-shadow:var(--sh-2);
  transition:border-color .18s,transform .18s,box-shadow .18s}
.svc-card::before{content:"";position:absolute;top:0;right:0;width:100%;height:3px;
  background:linear-gradient(90deg,var(--gold),transparent)}
[dir="ltr"] .svc-card::before{background:linear-gradient(270deg,var(--gold),transparent)}
a.svc-card:hover{border-color:rgba(200,169,107,.65);transform:translateY(-2px);
  box-shadow:var(--sh-2)}
a.svc-card:active{transform:translateY(0)}

.svc-tag{align-self:flex-start;font-size:12px;font-weight:600;color:var(--goldText);
  background:var(--soft);border:1px solid rgba(200,169,107,.35);
  border-radius:999px;padding:4px 11px;margin-bottom:12px}
/* العنوان أكبر بوضوح من المتن — ده أهم فرق في الهرم البصري */
.svc-t{font-weight:700;font-size:18px;line-height:1.5;margin:0 0 8px;color:var(--navy)}
.svc-l{font-size:13px;line-height:1.9;color:var(--n70);margin:0 0 16px;max-width:60ch}

/* تذييل الكارت — نفس نمط `.opp .ft`: فاصل فوق، والمحتوى على الطرفين.
   ⚖️ ده اللي بيوزن الكارت: من غيره الـchips والـCTA بيتكوّموا على جنب
      واحد ويسيبوا نص عرض الكارت أبيض (الشكوى من «الصفحة فاضية»). */
.svc-ft{display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;margin-top:auto;padding-top:16px;
  border-top:1px solid var(--border)}

/* chips الأنواع — بتحوّل قايمة كانت جوّه الفقرة لمعلومة تتقري بنظرة */
.svc-chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.svc-chips li{font-size:12.5px;font-weight:600;color:var(--n70);
  background:var(--beige);border:1px solid var(--border);
  border-radius:8px;padding:5px 10px}

/* الـCTA — نفس بيلّة `.opp .ft .more` بس أوضح، وفوقه فاصل زي `.opp .ft` */
.svc-cta{display:inline-flex;align-items:center;gap:8px;flex:none;
  font-size:12.5px;font-weight:600;color:var(--goldText);
  border:1.5px solid rgba(200,169,107,.45);border-radius:999px;padding:9px 16px;
  transition:background .18s,border-color .18s}
.svc-cta .ar{font-size:15px;line-height:1;transform:translateY(-1px)}
[dir="ltr"] .svc-cta .ar{transform:translateY(-1px) rotate(180deg)}
a.svc-card:hover .svc-cta{background:var(--soft);border-color:rgba(200,169,107,.75)}

/* شريط الخطوات — بيملا الفراغ اللي كان تحت الكارت */
.svc-steps{display:grid;gap:10px;list-style:none;margin:0;padding:0}
@media(min-width:720px){.svc-steps{grid-template-columns:repeat(4,1fr)}}
@media(min-width:460px) and (max-width:719px){.svc-steps{grid-template-columns:repeat(2,1fr)}}
.svc-steps li{position:relative;background:var(--white);border:1px solid var(--border);
  border-radius:12px;padding:14px 15px 13px}
.svc-steps .n{display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:50%;background:var(--cream);
  color:var(--goldText);font-size:12.5px;font-weight:600;margin-bottom:9px}
.svc-steps b{display:block;font-weight:600;font-size:13px;line-height:1.7;margin-bottom:3px}
.svc-steps .d{display:block;font-size:12.5px;line-height:1.7;color:var(--n62)}

.svc-trust{margin:14px 0 4px;font-size:12.5px;line-height:1.9;color:var(--n62);
  border-inline-start:2px solid rgba(200,169,107,.45);padding-inline-start:12px}

@media(max-width:520px){
  /* على الموبايل التذييل بيتكسر لسطرين والـCTA بيتمدّ عرض الكارت —
     هدف لمس أكبر وأوضح من زرار صغير على الطرف. */
  .svc-ft{align-items:stretch;flex-direction:column;gap:12px}
  .svc-cta{justify-content:center}
  .svc-card{padding:18px 17px 16px;border-radius:18px}
  .svc-t{font-size:17px}
  .svc-hero .hero-slim{padding:24px 20px 22px}
}

/* كارت «جاهز تبدأ؟» في آخر صفحة الخدمة — نداء الإجراء الختامي.
   ⚠️ `.gate` مستعملة في ٧ صفحات (شاشات «سجّل دخولك»)، فممنوع نلمسها.
      `.svc-gate` مُعدِّل مستقل بيشتغل على الصفحة دي بس. */
.svc-gate{max-width:520px;margin:26px auto 0;padding:26px 22px 24px;
  background:linear-gradient(180deg,var(--white) 0%,var(--cream45) 100%);
  border-color:rgba(200,169,107,.45)}
.svc-gate h2{font-size:18px;margin-bottom:8px}
.svc-gate .prose{margin-bottom:16px;max-width:42ch;margin-inline:auto}
.svc-gate .svc-gate-n{display:block;margin-top:13px;font-size:12.5px;
  line-height:1.8;color:var(--n62)}

/* ═══════════════════════════════════════════════════════════════════════
   👥 لوحة الحسابات — /account/admin/users/
   ⚠️ كل الكلاسات هنا بتبدأ بـ`au` أو بمُعدِّل `tg-*` جديد. ممنوع نلمس
      `.tgstate.on/.off` الموجودة — دي مستعملة في صفحة الحساب بتاعة الطالب.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── حالة تيليجرام في الجدول — تلات حالات مميّزة بصريًا ── */
.tgstate.tg-on{color:var(--green);border-color:color-mix(in srgb,var(--green) 34%,transparent);
  background:color-mix(in srgb,var(--green) 8%,transparent)}
/* 🟡 مربوط بس التنبيهات مقفولة — لازم يبان **مختلف** عن «غير مربوط»،
      لأن الخلط بينهم هو بالظبط سبب التشخيص الغلط اللي اللوحة دي بتحلّه. */
.tgstate.tg-mute{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 34%,transparent);
  background:color-mix(in srgb,var(--amber) 9%,transparent)}
.tgstate.tg-off{color:var(--n62)}

.ascount.warn{border-color:color-mix(in srgb,var(--amber) 45%,transparent);
  background:color-mix(in srgb,var(--amber) 7%,transparent)}
.ascount.warn b{color:var(--amber)}

/* 🐞 اتكشف في المعاينة: `.atable` العامة `min-width:720px`، والجدول ده ١٠
   أعمدة — فكانت شارة «مربوط · التنبيهات شغالة» بتتكسر ٣ سطور والصفوف
   بتبقى غير مقروءة. الجدول جوّه `.tablewrap` اللي فيها `overflow-x:auto`،
   فالعرض الأكبر بيدّي تمرير أفقي بدل كسر — وده الصح لجدول إداري. */
#auTable{min-width:1080px}
#auTable .tgstate,#auTable td:nth-child(3),#auTable td:nth-child(10){white-space:nowrap}

/* ── الجدول ── */
.aurow{cursor:pointer}
.aurow:hover{background:var(--soft)}
.aurow:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.aupill{display:inline-block;font-size:12px;font-weight:700;padding:2px 8px;border-radius:999px;
  background:var(--cream);border:1px solid rgba(200,169,107,.5);color:var(--goldText);
  vertical-align:middle;margin-inline-start:4px}

/* ── الدرج ونافذة الحذف — نفس الغلاف، محتوى مختلف ── */
.audrawer{position:fixed;inset:0;z-index:60}
.audrawer[hidden]{display:none}
.audrawer-bg{position:absolute;inset:0;background:rgba(7,20,38,.45)}
.audrawer-panel{position:absolute;inset-block:0;inset-inline-start:0;width:min(560px,100%);
  background:var(--beige);border-inline-end:1px solid var(--border);
  overflow-y:auto;overscroll-behavior:contain;
  padding:0 20px 40px;box-shadow:var(--sh-1)}
.audrawer-hd{position:sticky;top:0;z-index:1;background:var(--beige);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:18px 0 14px;border-bottom:1px solid var(--border);margin-bottom:6px}
.audrawer-hd h2{font-size:18px;line-height:1.5;overflow-wrap:anywhere}
.audrawer-x{flex:none;width:34px;height:34px;border-radius:8px;border:1px solid var(--border);
  background:var(--white);font-size:21px;line-height:1;cursor:pointer;color:var(--n70)}
.audrawer-x:hover{border-color:var(--goldText);color:var(--navy)}

/* ── صفوف مفتاح/قيمة ── */
.aurow-kv{display:flex;gap:12px;justify-content:space-between;align-items:baseline;
  padding:7px 0;border-bottom:1px dashed var(--border);font-size:13px}
.aurow-kv:last-child{border-bottom:0}
.aurow-kv .auk{flex:none;color:var(--n62);font-size:12.5px}
.aurow-kv .auv{text-align:end;overflow-wrap:anywhere}
.aurow-kv.warn .auv{color:var(--amber);font-weight:700}

/* ── أدوات الدعم ── */
.auact{padding:14px 0;border-bottom:1px dashed var(--border)}
.auact:last-child{border-bottom:0;padding-bottom:0}
.auact:first-child{padding-top:0}
.auact .fld{margin-bottom:10px}

/* ── المنطقة الحمراء — بعيدة وواضحة عن قصد ── */
.audanger-k{color:var(--red)}
.audanger{border-color:color-mix(in srgb,var(--red) 34%,transparent);
  background:color-mix(in srgb,var(--red) 4%,transparent);margin-bottom:18px}
.audanger .prose{margin-bottom:12px;font-size:13px}
.cta.danger{background:var(--red-solid);border-color:var(--red-solid);color:#fff}
.cta.danger:disabled{opacity:.45;cursor:not-allowed}

/* ── نافذة الحذف ── */
.audel{position:absolute;inset-inline:0;inset-block-start:50%;translate:0 -50%;
  width:min(520px,calc(100% - 32px));margin-inline:auto;max-height:92vh;
  overflow-y:auto;overscroll-behavior:contain;
  background:var(--beige);border:1px solid color-mix(in srgb,var(--red) 30%,transparent);
  border-radius:18px;padding:24px 22px;box-shadow:var(--sh-2)}
.audel-t{font-size:18px;color:var(--red);margin-bottom:14px}
.audel-info{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:12px 15px}
.audel-plan{margin:14px 0}
.audel-sec{margin-bottom:12px;font-size:13px}
.audel-sec b{display:block;margin-bottom:5px;font-size:12.5px;color:var(--n70)}
.audel-sec ul{margin:0;padding-inline-start:20px;line-height:1.9}
.audel-sec .muted{color:var(--n62)}
.audel-sec.warnbox{border:1px solid color-mix(in srgb,var(--amber) 40%,transparent);
  background:color-mix(in srgb,var(--amber) 6%,transparent);border-radius:12px;padding:12px 15px}

@media(max-width:640px){
  .audrawer-panel{width:100%;border-inline-end:0}
  .aurow-kv{flex-direction:column;gap:2px}
  .aurow-kv .auv{text-align:start}
}

/* نافذة التأكيد العامة — نفس صندوق الحذف بس من غير النبرة الحمرا.
   الحذف بيفضل هو الوحيد اللي بحدود حمرا: لو كل النوافذ حمرا، الأحمر
   بيبطّل يعني «خطر» ويبقى مجرد لون. */
.aucf{border-color:rgba(200,169,107,.45)}
.aucf .audel-t{color:var(--navy)}

/* 🔢 ترتيب الطبقات **صريح** — مش بالاعتماد على ترتيب الـDOM.
   🐞 كل الطبقات كانت z-index:60، والمتصفح بيطلي المتساوي حسب ترتيب
      الـDOM. و#auConfirm بيجي قبل #auDelModal ⇒ نافذة التأكيد كانت
      بتظهر **تحت** نافذة الحذف على الإنتاج (٣١ أغسطس ٢٠٢٦).
      نافذة الحذف بقت خطوتين جوّه نفسها فالتراكب ده اختفى، بس القيم
      الصريحة دي بتمنع رجوعه لو اتضافت طبقة جديدة بعدين. */
#auDrawer  { z-index: 60 }
#auConfirm { z-index: 70 }   /* فوق الدرج دايمًا */

/* خطوات نافذة الحذف — الخطوة المخفية مالهاش أي وجود في التخطيط */
#auDelStep1[hidden], #auDelStep2[hidden] { display: none }

/* ═══════════════════════════════════════════════════════════════════════
   📎 مرفقات المساعدة — الـcomposer · المرفق في الرسالة · الـlightbox
   بتتشارك بين /account/help/ و/account/admin/notify/ (assets/help-media.js)
   ═══════════════════════════════════════════════════════════════════════ */

/* — شريط الإرفاق — */
.hmc{margin:-4px 0 14px}
.hmc-bar{display:flex;flex-wrap:wrap;gap:8px}
.hmc-b{padding:9px 16px;font-size:12.5px}
.hmc-b[disabled]{opacity:.5;cursor:not-allowed}
.hmc-b[disabled]:hover{border-color:var(--border);color:var(--navy);transform:none}

/* — معاينة المرفق قبل الإرسال — */
.hmc-prev{margin-top:10px}
.hmc-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  border:1px solid var(--border);border-radius:12px;padding:10px 12px;background:var(--white)}
.hmc-img{width:72px;height:72px;object-fit:cover;border-radius:8px;flex:0 0 auto}
.hmc-audio{flex:1 1 220px;min-width:0;max-width:100%;height:40px}
.hmc-meta{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0}
.hmc-name{font-size:12px;color:var(--n62);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.hmc-x{margin-inline-start:auto;padding:7px 14px;font-size:12px;flex:0 0 auto}

/* — التسجيل الجاري — */
.hmc-live{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;
  border:1px solid rgba(200,169,107,.45);border-radius:12px;padding:10px 12px;background:var(--white)}
.hmc-live[hidden]{display:none}
.hmc-prev[hidden]{display:none}
.hmc-dot{width:10px;height:10px;border-radius:50%;background:var(--n55);flex:0 0 auto}
.hmc-dot.on{background:var(--del-tx);animation:hmcpulse 1s ease-in-out infinite}
@keyframes hmcpulse{0%,100%{opacity:1}50%{opacity:.25}}
.hmc-rec{font-size:12.5px;font-weight:600;color:var(--navy)}
.hmc-clock{font-size:13px;font-variant-numeric:tabular-nums;color:var(--n62)}
.hmc-stop{margin-inline-start:auto;padding:8px 18px;font-size:12.5px}
@media (prefers-reduced-motion:reduce){.hmc-dot.on{animation:none}}

/* — المرفق داخل الرسالة — */
.hm-att{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.hm-thumb{padding:0;border:1px solid var(--border);border-radius:12px;background:var(--white);
  cursor:pointer;overflow:hidden;line-height:0;flex:0 0 auto;
  transition:border-color .16s,transform .16s}
.hm-thumb:hover,.hm-thumb:focus-visible{border-color:var(--goldText);transform:translateY(-1px)}
.hm-thumb img{width:150px;height:150px;object-fit:cover;display:block}
.hm-audio{flex:1 1 220px;min-width:0;max-width:100%;height:40px}
.hm-att-m{font-size:12px;color:var(--n62);font-variant-numeric:tabular-nums}
.hm-att-e{font-size:12px;color:var(--n62);flex:1 1 100%}
.hm-att-b{padding:8px 14px;font-size:12px}

/* — Lightbox: طبقة فوق كل حاجة، والصورة مابتخرجش عن الشاشة أبدًا — */
.hmlb{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(7,20,38,.88);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.hmlb-i{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
  border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.hmlb-x{position:absolute;top:14px;inset-inline-end:14px;width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;
  border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--navy-k);
  font-size:18px;font-family:inherit;cursor:pointer}
.hmlb-x:hover{background:#fff}

@media (max-width:520px){
  .hm-thumb img{width:120px;height:120px}
  .hmc-bar .hmc-b{flex:1;justify-content:center}
  .hmc-x{margin-inline-start:0}
  .hmlb{padding:12px}
}

/* ═══════════ الأثر — شهادات الطلاب (/impact/ + لوحة الإدارة) ═══════════ */
/* نفس التوكنات والمكوّنات (card/fld/cta/ghost/note) — دي إضافات الصفحة بس */
.imp-form{margin-top:8px}
.imp-lead{font-size:13px;color:var(--n70);margin-bottom:14px}
.imp-fieldset{border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin:0 0 14px;min-width:0}
.imp-fieldset legend{font-weight:600;font-size:12.5px;color:var(--navy);padding:0 6px}
.imp-check{display:flex;gap:9px;align-items:flex-start;padding:6px 2px;font-size:13.5px;line-height:1.8;color:var(--navy);cursor:pointer}
.imp-check input{width:17px;height:17px;margin-top:4px;flex:none;accent-color:var(--gold)}
.imp-check input:focus-visible{outline:2px solid var(--goldText);outline-offset:2px}
.vh-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0)}
.fld-hint{font-size:12px;color:var(--n55);margin:6px 0 10px}
.imp-evidence{border:1.5px dashed rgba(200,169,107,.55);border-radius:14px;padding:14px 16px;margin:16px 0}
.imp-evidence h3{font-size:14px;margin-bottom:6px}
.imp-ev-desc{font-size:12.5px;color:var(--n70);margin-bottom:10px}
.imp-ev-privacy{font-size:12px}
.imp-filelist{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.imp-file{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:var(--soft);border:1px solid var(--border);border-radius:10px;padding:8px 12px}
.imp-file-meta{flex:1;min-width:150px;display:flex;flex-direction:column;gap:2px}
.imp-file-name{font-size:12.5px;font-weight:600;color:var(--navy);word-break:break-all}
.imp-file-size{font-size:11px;color:var(--n55)}
.imp-file-type select{font-family:inherit;font-size:12px;color:var(--navy);background:var(--white);border:1px solid var(--border);border-radius:8px;padding:6px 9px}
.imp-file-rm{font-family:inherit;font-size:12px;font-weight:600;color:var(--red);background:none;border:1px solid var(--border);border-radius:999px;padding:5px 12px;cursor:pointer}
.imp-file-rm:hover{border-color:var(--red)}
.imp-consents{background:var(--soft)}
.imp-feed-sec{margin:34px 0 10px}
.imp-feed-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px}
.imp-filter select{font-family:inherit;font-size:13.5px;min-height:44px;color:var(--navy);background:var(--white);border:1px solid var(--border);border-radius:10px;padding:10px 14px;transition:border-color var(--t-base)}
.imp-filter select:hover{border-color:rgba(200,169,107,.55)}
.imp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px;align-items:start}
.imp-card{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:16px;box-shadow:var(--sh-2)}
.imp-card-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px}
.imp-card-name{font-weight:700;font-size:14px;color:var(--navy)}
.imp-badge{font-size:10.5px;font-weight:600;color:var(--green);border:1px solid currentColor;border-radius:999px;padding:1px 8px;white-space:nowrap}
.imp-card-country{font-size:12px;color:var(--n55)}
.imp-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.imp-tag{font-size:11px;font-weight:600;color:var(--goldText);background:var(--soft);border-radius:999px;padding:2px 9px}
.imp-card-uni{font-size:12px;color:var(--n70);margin-bottom:8px}
.imp-card-text{font-size:13px;line-height:1.95;color:var(--n70);white-space:pre-wrap;word-break:break-word}
.imp-card-date{display:block;font-size:11px;color:var(--n55);margin-top:10px}
.imp-more-wrap{text-align:center;margin:18px 0}
/* ── لوحة الإدارة ── */
.ai-list{display:flex;flex-direction:column;gap:14px;margin-top:14px}
.ai-card{margin-bottom:0}
.ai-head{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:8px}
.ai-email{font-size:12px;color:var(--n55)}
.ai-status{font-size:11px;font-weight:600;border-radius:999px;padding:2px 10px;border:1px solid var(--border);color:var(--n70)}
.ai-st-approved{color:var(--green);border-color:currentColor}
.ai-st-rejected{color:var(--red);border-color:currentColor}
.ai-st-pending{color:var(--amber);border-color:currentColor}
.ai-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:12px;color:var(--n70);margin-bottom:8px;align-items:center}
.ai-consents{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;margin-bottom:8px}
.ai-c-yes{color:var(--green);font-weight:600}
.ai-c-no{color:var(--n55)}
.ai-text{font-size:13px;line-height:1.95;color:var(--navy);background:var(--soft);border-radius:10px;padding:10px 12px;white-space:pre-wrap;word-break:break-word}
.ai-date{font-size:11.5px;color:var(--n55);margin:8px 0}
.ai-atts h4{font-size:13px;margin:10px 0 6px}
.ai-att-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ai-att{display:flex;flex-wrap:wrap;gap:10px;align-items:center;border:1px solid var(--border);border-radius:10px;padding:8px 12px}
.ai-att-meta{flex:1;min-width:180px;display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}
.ai-att-type{font-size:12px;font-weight:700;color:var(--goldText)}
.ai-att-name{font-size:12.5px;color:var(--navy);word-break:break-all}
.ai-att-info{font-size:11px;color:var(--n55)}
.ai-att-date{font-size:11px;color:var(--n55)}
.ai-att-acts{display:flex;gap:8px}
.ai-att-acts .ghost{padding:7px 12px;font-size:12px}
.ai-lang{display:inline-flex;gap:8px;align-items:center;font-size:12.5px;color:var(--n70)}
.ai-lang select{font-family:inherit;font-size:12.5px;color:var(--navy);background:var(--white);border:1px solid var(--border);border-radius:8px;padding:7px 10px}


/* ╔══════════════════════════════════════════════════════════════════════╗
   ║  الإخراج الفني (ART DIRECTION) — المرحلة ٢                            ║
   ║                                                                      ║
   ║  المرحلة ١ كانت إصلاحات وإيقاع. المرحلة دي بتشتغل على **التركيب**:    ║
   ║  أقل صناديق، مقياس أقوى، مساحة مقصودة، ولحظات بصرية تفضل في الذاكرة. ║
   ║                                                                      ║
   ║  🔒 القيود زي ما هي بالحرف: صفر خط جديد · صفر لون براند جديد ·       ║
   ║     صفر لوجو · صفر محتوى · صفر خطوة زيادة على المستخدم.              ║
   ║                                                                      ║
   ║  🧭 المبدأ الحاكم: **ما نشيلش معلومة، نشيل حاوية.**                   ║
   ║     أغلب الإحساس الـ«dashboard» جاي من إن كل كتلة معلومات متحطوطة    ║
   ║     في صندوق أبيض بحد وشريط ذهبي. المعلومة نفسها ممتازة — الصندوق     ║
   ║     هو الزيادة. الهيراركي والخط الشعري والمساحة بيعملوا نفس التجميع   ║
   ║     من غير ضوضاء.                                                    ║
   ║                                                                      ║
   ║  ↩️ الرجوع: الكتلة دي كلها متصلة — شيلها كوحدة وترجع للمرحلة ١.       ║
   ╚══════════════════════════════════════════════════════════════════════╝ */

/* ───────────────────────────────────────────────────────────────────────
   ١) المقياس — سلّم عناوين له «صوت» فعلي
   كان أكبر نص في صفحة داخلية 38px وعنوان القسم 24px والنص الجاري 16px:
   الفرق بين المستويات ضعيف، فالصفحة بتتقري «كلها بنفس النبرة».
   ─────────────────────────────────────────────────────────────────────── */
.hero-slim h1{
  font-size:clamp(30px,4.6vw,47px);line-height:1.22;letter-spacing:-.022em;
  margin-bottom:14px;max-width:19ch}
.hero-slim .org{font-size:14px;margin-bottom:14px;letter-spacing:.005em}
.hero-slim p.lead{font-size:15.5px;line-height:1.85;max-width:54ch;color:var(--cream70)}
@media(max-width:600px){
  .hero-slim h1{font-size:clamp(27px,7.6vw,36px);max-width:none;letter-spacing:-.016em}
  .hero-slim p.lead{font-size:15px;max-width:none}
}

/* ───────────────────────────────────────────────────────────────────────
   ٢) الهيرو — الصورة تبقى صورة، والنص يفضل هو البطل
   الغلاف كان تدرّجًا رأسيًا موحّدًا بيغمّق الصورة **كلها** بالتساوي، فالصورة
   بتتحوّل لخلفية رمادية والنص بيقف على «لا حاجة».
   دلوقتي طبقتان: نفس التدرّج الرأسي (أرضية التباين محفوظة بالحرف) + تدرّج
   **اتجاهي** بيغمّق ناحية بداية السطر بس (يمين في العربي، شمال في اللاتيني)
   ⇒ النص واقف على أغمق جزء، والجهة التانية بتفضل صورة حقيقية باينة.
   ⚠️ التباين بيزيد ولا يقلّ — الطبقة الجديدة **بتضيف** غمقان، فأرضية الـ7.2:1
      المحسوبة في تعليق `.hero .ov` فوق فاضلة صحيحة كحد أدنى. */
.hero:has(.bgimg):not(.hero-v2){min-height:300px}
@media(max-width:600px){.hero:has(.bgimg):not(.hero-v2){min-height:240px}}
.hero .ov::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to left,rgba(7,20,38,.55) 0%,rgba(7,20,38,.22) 42%,transparent 78%)}
html[dir="ltr"] .hero .ov::after{
  background:linear-gradient(to right,rgba(7,20,38,.55) 0%,rgba(7,20,38,.22) 42%,transparent 78%)}
/* الهالة الذهبية أكبر وأهدى — لمسة عمق مش بقعة ضوء */
.hero:not(.hero-v2) .glow{width:380px;height:380px;top:-22%;opacity:.8}

/* 📱 إخراج فني للموبايل — مش «نسخة مضغوطة»:
   الهيرو بيخرج من الهوامش ويلمس حواف الشاشة. ده أكتر تغيير بيدّي إحساس
   «منتج مصمَّم» على الموبايل، وبيدّي الصورة مساحة حقيقية بدل مستطيل محبوس
   جوّه هامش ١٨px. المحتوى جوّه بيحتفظ بهامشه فمفيش نص بيلزق في الحافة. */
@media(max-width:600px){
  .hero:not(.hero-v2){
    margin-inline:-18px;border-radius:0;padding-inline:18px;
    padding-block:34px 30px;margin-top:10px}
}

/* ───────────────────────────────────────────────────────────────────────
   ٣) «ورقة المواصفات» — أهم كتلة في صفحة الفرصة
   كانت كارت أبيض بحد ونصف قطر وظلّ، جوّاه شبكة بخطوط داخلية: صندوق جوّه
   صندوق. المعلومة (لمين · اللغة · التخصصات · المراحل · التسجيل) هي أسرع
   طريق لقرار الطالب، فالمفروض تتقري كـ**ورقة مواصفات** لا كـ«widget».
   دلوقتي: خطوط شعرية على خلفية الصفحة — صفر حد خارجي، صفر ظل.
   نفس الخانات ونفس الترتيب ونفس النص بالحرف. */
.qf{background:transparent;border:0;border-radius:0;box-shadow:none;
    border-top:1px solid var(--border);border-bottom:1px solid var(--border);
    margin:26px 0 0;overflow:visible}
.qfi{position:relative;padding:17px 4px;gap:13px}
.qfi:nth-child(odd){border-inline-end:0}
/* الفاصل الرأسي بقى خطًّا شعريًا في النص مش حدًّا لخانة */
.qfi:nth-child(odd)::after{content:"";position:absolute;inset-block:14px;
  inset-inline-end:-1px;width:1px;background:var(--border)}
@media(max-width:600px){.qfi:nth-child(odd)::after{display:none}}
/* الليبل بقى «مفتاح» صغير متباعد الحروف، والقيمة هي اللي بتتمسح بالعين */
.qfk{font-size:11.5px;letter-spacing:.06em;color:var(--n55);font-weight:600}
.qfv{font-size:16px;font-weight:600;letter-spacing:-.006em}
.qfic{font-size:16px;opacity:.55}
/* خانة «التسجيل» — كانت مربّعًا ورديًا كامل. بقت علامة على الحافة:
   حضور أهدى ودلالة أوضح (الأحمر على الحد مش على المساحة).
   📐 العلامة `::before` مطلقة مش حدّ على العنصر: الحدّ + الهامش السالب كانوا
      بيطلّعوا الصفّ **٢٠px بره** حافة ورقة المواصفات، فالخط الأحمر مابقاش
      متعامدًا مع الخطوط الشعرية ولا مع حدّ لوحة الموعد تحته (اتقاس في اللقطة).
      دلوقتي العلامة على الحافة بالظبط وصفر إزاحة في التخطيط. */
.qfi.hot{background:transparent}
.qfi.hot::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;
  width:2px;background:var(--red)}
.qfi.hot .qfv{color:var(--warn-tx)}

/* ───────────────────────────────────────────────────────────────────────
   ٤) صفّ الأرقام — نفس المعالجة: خط شعري بدل صندوق
   ─────────────────────────────────────────────────────────────────────── */
.strip{background:transparent;border:0;border-radius:0;box-shadow:none;
  border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:30px 0 0}
.strip .s{padding:20px 12px}
.strip .s b{font-size:23px}
.strip .s .num{font-size:30px;font-weight:800;height:36px;line-height:36px}

/* ───────────────────────────────────────────────────────────────────────
   ٥) كروت الفرص — سطح مستوي بدل صندوق مُحاط
   كل كارت كان فيه تلات طبقات كروم: حد + شريط ذهبي + نصف قطر. × ١٢٦ كارت
   = صفحة «بلاطات». الأبيض لوحده على البيج بيفصل الكارت كفاية، فالحد
   والشريط زيادة. المسافة بين الكروت كبرت عشان الفصل يفضل واضح.
   ⚠️ الكارت كله لسه رابط واحد بضغطة واحدة — صفر تغيير في الوصول. */
/* 📐 مع اختفاء الحد، الكارت الأقصر كان بيتمدّد ليطابق جاره فبيسيب مساحة
   بيضا فاضية تحت تذييله. المقاس حسب المحتوى أنضف بصريًا هنا، والتذييل
   لسه آخر عنصر في كل كارت. */
.ocards{gap:18px;align-items:start}
.ocard{border:0;border-radius:16px;padding:20px 22px;box-shadow:var(--sh-1)}
.ocard::before{display:none}
.ocard.open{border:0}
.ocard.soon{background:color-mix(in srgb,var(--white) 62%,var(--beige))}
@media (hover:hover) and (pointer:fine){
  .ocard:hover{box-shadow:var(--sh-3);transform:translateY(-2px)}
}
.ocard b{font-size:16.5px;line-height:1.5}
.ocard .en{font-size:12.5px;margin-top:2px;opacity:.9}
.ocard .onote{font-size:14px;line-height:1.75;margin-top:12px}
.ocard .state{padding-top:14px;margin-top:14px;border-top:1px solid var(--border)}

/* كروت الفرص المميّزة (الرئيسية) — نفس المنطق، والصورة هي البطل */
.opp{border:0;box-shadow:var(--sh-1);border-radius:20px}
.opp::before{display:none}
.opp.has-img .thumb{aspect-ratio:3/2}
@media(max-width:700px){.opp.has-img .thumb{aspect-ratio:16/9}}
.opps-home{gap:20px}

/* ───────────────────────────────────────────────────────────────────────
   ٦) الكارت الساكن في الصفحات الطويلة — سطح، مش إطار
   ─────────────────────────────────────────────────────────────────────── */
.card{border:0;box-shadow:var(--sh-1);border-radius:20px;padding:24px 26px}
.card::before{opacity:.55;height:2px}
@media(max-width:600px){.card{padding:20px}}

/* ───────────────────────────────────────────────────────────────────────
   ٧) رأس القسم — افتتاحية تحريرية
   الخط الشعري أرفع وأطول والعنوان أقرب ليه، فالقسم بيبدأ بحركة عين واحدة
   (سطر ⇠ كلمة مفتاحية ⇠ عنوان) بدل تلات عناصر منفصلة.
   ─────────────────────────────────────────────────────────────────────── */
.sec-k{font-size:12.5px;letter-spacing:.075em;gap:14px}
.sec-k::after{height:1px;opacity:.55}
h2{letter-spacing:-.014em;font-size:clamp(22px,2.5vw,29px);line-height:1.38}
@media(max-width:560px){h2{font-size:22px}}
.sec-p{font-size:15.5px;margin-top:-6px}

/* ───────────────────────────────────────────────────────────────────────
   ٨) أول شاشة في الرئيسية — سبع كتل بقت أربع مجموعات
   المحتوى بالحرف زي ما هو. اللي اتغيّر: إزاي العين بتجمّعه.
     [شارة + عنوان]  →  [وصف]  →  [برهان + هوامش]  →  [أفعال]
   قبل كده الأرقام والهوامش كانوا كبسولات بنفس وزن الأزرار، فأول شاشة
   كانت بتقول سبع حاجات بنفس الصوت.
   ─────────────────────────────────────────────────────────────────────── */
.hero-v2 h1{letter-spacing:-.03em;line-height:1.18}
.hero-v2 p.lead{font-size:clamp(15px,1.55vw,17px);line-height:1.8;margin-top:2px}
/* البرهان: صفّ واحد بخط شعري فاصل — الأرقام بتتقري كوحدة مش كخانتين */
.herostats{gap:0;margin:26px 0 0;align-items:stretch}
.herostats .hs{padding-inline-end:28px;margin-inline-end:28px;
  border-inline-end:1px solid rgba(226,207,166,.26)}
.herostats .hs:last-child{border-inline-end:0;padding-inline-end:0;margin-inline-end:0}
.herostats .hs b{font-size:38px;letter-spacing:-.02em;line-height:1}
.herostats .hs span{font-size:12.5px;letter-spacing:.02em;margin-top:7px;opacity:.85}
/* الهوامش: سطور دقيقة تحت البرهان — معلومة كاملة، بصوت هامش */
.hero-v2 .hero-note{background:transparent;border:0;
  border-inline-start:2px solid rgba(200,169,107,.5);
  border-start-end-radius:0;border-end-end-radius:0;
  padding:2px 0;padding-inline-start:13px;
  font-size:13.5px;font-weight:400;color:var(--cream70);margin-top:20px;max-width:52ch}
.hero-noupload{background:transparent;border:0;padding:0;margin:12px 0 0;
  font-size:13px;font-weight:400;color:var(--cream70);opacity:.88}
.hero-v2 .btns{margin-top:30px}
@media(max-width:720px){
  .herostats .hs b{font-size:32px}
  .herostats .hs{padding-inline-end:20px;margin-inline-end:20px}
  .hero-v2 .hero-note{font-size:13px;margin-top:16px}
  .hero-v2 .btns{margin-top:24px}
}

/* ───────────────────────────────────────────────────────────────────────
   ٩) الموعد — لوحة موعد، مش مربّع تنبيه
   الأحمر زي ما هو (محجوز للمواعيد)، بس التوزيع الداخلي اتغيّر: التاريخ هو
   أكبر عنصر والشرح تحته بصوت أهدى. المساحة الوردية قلّت والحد الجانبي
   بقى هو حامل الدلالة.
   ─────────────────────────────────────────────────────────────────────── */
.deadline{background:linear-gradient(to left,rgba(214,40,57,.055),transparent 62%);
  border:0;border-inline-start:3px solid var(--red);border-radius:0;
  padding:18px 0;padding-inline-start:20px;margin-top:26px;gap:16px}
html[dir="ltr"] .deadline{background:linear-gradient(to right,rgba(214,40,57,.055),transparent 62%)}
.deadline .ic{font-size:20px;opacity:.85}
.deadline>div>b{font-size:17px;line-height:1.45;margin-bottom:6px;letter-spacing:-.01em}
.deadline p{font-size:14px;line-height:1.85;color:var(--warn-tx3)}
@media(max-width:600px){
  .deadline{padding-inline-start:16px;gap:12px}
  .deadline>div>b{font-size:15.5px}
}

/* ───────────────────────────────────────────────────────────────────────
   ١٠) التنبيهات الجارية — حد دلالي + مساحة، بدل مستطيل ملوّن
   `.note.warn` فاضلة بخلفيتها: التحذير الحرج **لازم** يفضل كتلة ملوّنة.
   ─────────────────────────────────────────────────────────────────────── */
.note{background:transparent;border:0;border-inline-start:2px solid rgba(200,169,107,.55);
  border-radius:0;padding:4px 0;padding-inline-start:18px;margin:20px 0}
.note.tip{background:transparent;border-inline-start-color:rgba(10,125,77,.45)}
.note.warn{background:var(--warn-bg);border:1px solid rgba(214,40,57,.14);
  border-inline-start:3px solid var(--red);border-radius:14px;padding:18px 20px}

/* ───────────────────────────────────────────────────────────────────────
   ١١) قائمة الأدلة والأدوات — صفوف تحريرية بدل بلاطات
   ─────────────────────────────────────────────────────────────────────── */
.guidelist{border:0;border-radius:0;box-shadow:none;background:transparent;
  border-top:1px solid var(--border)}
.guidelist .guide{padding:20px 4px;border-top:0;border-bottom:1px solid var(--border)}
.guidelist .guide:hover{background:transparent}
.guidelist .guide h2{font-size:17.5px}
@media (hover:hover) and (pointer:fine){
  .guidelist .guide{transition:padding-inline-start var(--t-base) var(--ease-out)}
  .guidelist .guide:hover{padding-inline-start:10px}
  .guidelist .guide:hover h2{color:var(--goldText)}
}
.toolcard{border:0;box-shadow:var(--sh-1);border-radius:20px;padding:24px 26px}
.toolcard::before{display:none}

/* ───────────────────────────────────────────────────────────────────────
   ١٢) محاذاة بصرية دقيقة
   ─────────────────────────────────────────────────────────────────────── */
.crumbs{padding-top:18px;font-size:12.5px}
.opps-total b{letter-spacing:-.025em}
.opps-note{font-size:14px;line-height:1.8}


/* ───────────────────────────────────────────────────────────────────────
   ١٣) تنقّل أفقي على الديسكتوب — تجربة قابلة للرجوع
   الموبايل ما اتغيّرش ولا بكسل: الشريط ده `display:none` تحت 1080px.
   الهيدر بيتوسّع لـ1120px عشان الشريط ياخد مساحته من غير زحمة — والمحتوى
   نفسه فاضل في عموده 820px زي ما هو.
   ─────────────────────────────────────────────────────────────────────── */
.hdr-nav{display:none}
/* 📏 نقطة الكسر **1280** مش 1080: اتقاست على أطول لغة (الإنجليزي — ٧ عناصر
   بأسماء أطول من العربي). عند 1100px الشريط الإنجليزي كان بيتصادم مع أزرار
   الهيدر فعلًا (اتصوّر). الروسي ٤ عناصر بس فمريّح. */
@media(min-width:1280px){
  .hdr .in{max-width:1240px;gap:16px}
  /* الاسم مايلفّش في الشريط العريض — كان بيبقى ٣ سطور ويرفع الهيدر */
  .hdr .brand{flex:none}
  .hdr .brand .w{white-space:nowrap}
  .hdr-nav{display:flex;align-items:center;gap:1px;flex:1 1 auto;justify-content:center;min-width:0}
  .hdr-nav a{
    display:inline-flex;align-items:center;min-height:44px;
    font-size:13px;font-weight:600;color:var(--n70);text-decoration:none;
    padding:10px 11px;border-radius:10px;white-space:nowrap;
    transition:color var(--t-base),background var(--t-base)}
  .hdr-nav a:hover{color:var(--navy);background:var(--cream)}
  /* الصفحة الحالية: نقطة ذهبية تحت الاسم — علامة هادية، مش خلفية مصمتة */
  .hdr-nav a[aria-current="page"]{color:var(--goldText);position:relative}
  .hdr-nav a[aria-current="page"]::after{
    content:"";position:absolute;inset-inline:11px;bottom:6px;height:2px;
    border-radius:2px;background:var(--gold)}
  /* فوق الهيرو الكامل: الشريط بيتقلب فاتح زي باقي الهيدر */
  body.has-fullhero .hdr-nav a{color:var(--cream70)}
  body.has-fullhero .hdr-nav a:hover{color:#fff;background:rgba(255,255,255,.1)}
  body.has-fullhero.scrolled .hdr-nav a{color:var(--n70)}
  body.has-fullhero.scrolled .hdr-nav a:hover{color:var(--navy);background:var(--cream)}
  /* زر القائمة بيفضل — فيه عناصر مش في الشريط (لوحة الإدارة) — بس أهدى */
  .menubtn{opacity:.78}
  .menubtn:hover{opacity:1}
}

/* عنوان كارت الفرصة: `balance` بيوزّع الأسطر بالتساوي، فالاسم اللاتيني
   جوّه اسم عربي (زي «(Open Doors)») ما بيتقطعش بقوس يتيم في آخر سطر. */
.ocard b,.opp h3{text-wrap:balance}


/* ╔══════════════════════════════════════════════════════════════════════╗
   ║  الصقل النهائي — من «premium clean» لـ«memorable premium»             ║
   ║  التلات archetypes بس: الرئيسية · القوايم · صفحة الفرصة.              ║
   ║  🔒 صفر خط · صفر لون براند · صفر محتوى · صفر خطوة · صفر جافاسكربت.    ║
   ║  ↩️ الكتلة دي متصلة — شيلها كوحدة وترجع لـ51a542a.                     ║
   ╚══════════════════════════════════════════════════════════════════════╝ */

/* ───────────────────────────────────────────────────────────────────────
   ٠) تحرير الحاوية — شرط لازم للي بعده
   `.wrap{overflow-x:clip}` كانت بتقصّ عند 820px، فمستحيل أي هيرو يوصل
   لحواف الشاشة. `overflow-clip-margin` بتسمح بالرسم بره القصّ **من غير**
   ما تعمل تمرير، و`html{overflow-x:clip}` هي شبكة الأمان النهائية بدل
   الاعتماد على `.wrap` (والـclip — مش hidden — مابيعملش حاوية تمرير
   ومابيكسرش `position:sticky` بتاعة الهيدر).
   ─────────────────────────────────────────────────────────────────────── */
/* 🔓 شبكة الأمان النهائية ضد التمرير الأفقي بقت على `html` نفسها بدل
   الاعتماد على `.wrap` (والتعليق الأصلي في أول الملف كان بيقول إن
   `body` لوحدها مش كفاية لأن الفائض بيوصل لـ`html`). */
html{overflow-x:clip}
/* ...وبكده الحاوية اللي فيها هيرو بصورة تقدر تسيب الهيرو يخرج لحواف الشاشة.
   ⚠️ الاستثناء **مضبوط بالظبط** على الحاويات دي بس (`:has`)، فباقي الموقع
      لسه محمي بقصّ الحاوية زي ما كان. */
.wrap:has(> .hero .bgimg){overflow-x:visible}

/* ───────────────────────────────────────────────────────────────────────
   ١) تركيب هيرو الرئيسية — من «متمركز وآمن» لـ«بوستر»
   المشكلة مش في العناصر، في إنها كانت متوسّطة رأسيًا: الصورة والنص بياخدوا
   نفس الوزن فمفيش توتر. دلوقتي الكتلة النصية مرساة تحت، فالمبنى بياخد
   السما فوقه والعنوان بيقف على كتلة المبنى — علاقة بين النص والصورة بدل
   مجرد نص **فوق** صورة.
   ⚠️ الأزرار لسه جوّه أول شاشة (اتقاس: بتخلص عند 826 من 900).
   ─────────────────────────────────────────────────────────────────────── */
.hero-v2{justify-content:flex-end;padding-bottom:clamp(52px,8vh,96px)}
.hero-v2 h1{font-size:clamp(34px,6.6vw,70px);line-height:1.14;letter-spacing:-.034em}
.hero-v2 p.lead{max-width:46ch}
/* عمق مرساة على الكتلة النصية نفسها مش على الإطار — الطبقة بتغمّق حوالين
   النص وبتسيب باقي الصورة. ده اللي بيدّي إحساس «طبقات» من غير صندوق. */
.hero-v2 .ov::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(118% 76% at 76% 74%,rgba(3,8,16,.58),transparent 60%)}
html[dir="ltr"] .hero-v2 .ov::before{
  background:radial-gradient(118% 76% at 24% 74%,rgba(3,8,16,.58),transparent 60%)}
/* العلامة الذهبية تحت الكلمة المفتاحية: كانت شريطًا أصمّ 9px. بقت أرفع
   وبتتلاشى ناحية نهاية الكلمة — أثر قلم، مش هايلايتر. */
.hero h1 .g::after{height:6px;bottom:3px;opacity:.34;border-radius:3px;
  background:linear-gradient(to left,var(--gold),rgba(200,169,107,.18))}
html[dir="ltr"] .hero h1 .g::after{
  background:linear-gradient(to right,var(--gold),rgba(200,169,107,.18))}
@media(max-width:720px){
  .hero-v2{padding-bottom:clamp(40px,6vh,64px)}
  .hero-v2 h1{line-height:1.18;letter-spacing:-.024em}
}

/* ───────────────────────────────────────────────────────────────────────
   ٢) شخصية الكارت — تفاصيل دقيقة، من غير رجوع للحدود ولا الشريط الذهبي
   ─────────────────────────────────────────────────────────────────────── */
:root{
  /* 🌾 ظلّ دافي للكروت: `--sh-1` كحلي، والكحلي على صفحة بيج دافية بيدّي
     حافة رمادية باردة حوالين الكارت الأبيض. نفس القوة بالظبط، بحرارة
     الصفحة — الكارت بقى من نفس العيلة من غير ما نلمس لون سطحه. */
  --sh-card:0 1px 2px rgba(122,96,48,.07), 0 12px 26px -20px rgba(122,96,48,.30);
  --sh-card-hi:0 2px 4px rgba(122,96,48,.08), 0 22px 44px -22px rgba(122,96,48,.42);
}
.ocard,.opp,.card,.toolcard,.acctcard,.guidelist{box-shadow:var(--sh-card)}
@media (hover:hover) and (pointer:fine){
  .opp:hover,.guide:hover,.botcard:hover,.toolcard:hover{box-shadow:var(--sh-card-hi)}
  .ocard:hover{box-shadow:var(--sh-card-hi)}
}
/* ✨ الفاصل فوق تذييل الكارت بقى شعرة ذهبية بدل رمادية — نفس موتيف
   `.sec-k::after` بالظبط، فالكارت بيرجع لعيلة الموقع بتفصيلة واحدة
   عرضها 1px بدل شريط 3px كان فوق كل كارت. */
.ocard .state,.opp .ft{
  border-top-color:color-mix(in srgb,var(--gold) 34%,transparent)}
/* 📐 تقليم بصري: السطر الأول من الاسم بياخد مساحة زيادة من `line-height`
   فالكارت بيبان مزحلق لتحت. تقليل الحشو العلوي 3px بيرجّع التوازن البصري
   بين أعلى الكارت وأسفله. */
.ocard{padding-top:17px}
.opp.has-img>h3{margin-top:15px}
/* الاسم اللاتيني تحت العربي: تباعد حروف بسيط بيخلّيه «معرّف تاني» مش عنوان تاني */
.ocard .en{letter-spacing:.006em;opacity:.86}

/* ───────────────────────────────────────────────────────────────────────
   ٣) هيدر صفحة الفرصة — من «كارت كبير» لـ«ترويسة فيتشر»
   الفرق الحقيقي بين الاتنين هو الحافة: الكارت له حواف مدوّرة وهامش حواليه،
   والترويسة بتلمس حواف الشاشة. نفس الصورة ونفس النص ونفس الأزرار ونفس
   الترتيب — الإطار بس هو اللي اتشال، والمحتوى جوّه فاضل في عموده 820px.
   ─────────────────────────────────────────────────────────────────────── */
.hero:has(.bgimg):not(.hero-v2){
  margin-inline:calc(50% - 50vw);width:100vw;max-width:100vw;
  margin-top:6px;border-radius:0;min-height:370px;
  padding-block:clamp(38px,5.4vw,62px) clamp(34px,4.6vw,54px);
  padding-inline:max(18px,calc(50vw - 410px))}
@media(max-width:600px){
  .hero:has(.bgimg):not(.hero-v2){min-height:280px;margin-top:4px;
    padding-block:32px 28px}
}
/* الهالة الذهبية بقت مرساة على جهة النص بدل ركن الإطار */
.hero:has(.bgimg):not(.hero-v2) .glow{
  width:520px;height:520px;top:-34%;inset-inline-end:8%;opacity:.55}
/* شعرة ذهبية على حافة الترويسة السفلية — بتربط الترويسة بورقة المواصفات
   تحتها، فالاتنين بيتقروا ككتلة افتتاحية واحدة بدل عنصرين منفصلين. */
.hero:has(.bgimg):not(.hero-v2)::after{
  content:"";position:absolute;inset-inline:0;bottom:0;height:1px;z-index:3;
  background:var(--hero-hairline, linear-gradient(90deg,transparent,rgba(200,169,107,.55),transparent))}
.hero:has(.bgimg):not(.hero-v2)+.qf{margin-top:22px}

/* ───────────────────────────────────────────────────────────────────────
   ٤) إيقاع القراءة على الموبايل — العربي والروسي
   الوظيفة كانت ممتازة؛ اللي كان ناقص هو المسافة بين الفقرات: 9px تحت نص
   14.5px بـleading 1.85 بيخلّي الفقرات تتلزق وتتقري ككتلة واحدة طويلة.
   ─────────────────────────────────────────────────────────────────────── */
@media(max-width:600px){
  .mdp p+p{margin-top:13px}
  .prose.mdp p+p{margin-top:15px}
  .note{padding-inline-start:15px;margin:18px 0}
  .card .li{margin-bottom:13px;gap:11px}
  .card{padding:20px 18px}
  details.acc .in{line-height:1.9;padding-bottom:18px}
  .step{padding:16px 15px}
  .deadline{margin-top:22px}
  .qf{margin-top:22px}
  .strip{margin-top:26px}
}
/* 🇷🇺 السيريلي في Inter x-height بتاعه أعلى من IBM Plex Sans Arabic، فنفس
   الـleading بيبان أوسع وبيفكّك الفقرة. تقليل بسيط بيرجّع الكثافة الصح —
   وده ضبط سطر مش تغيير خط. */
html[lang="ru"] .prose,html[lang="ru"] .card .li,html[lang="ru"] .note,
html[lang="ru"] details.acc .in,html[lang="ru"] .step p,
html[lang="ru"] .ocard .onote,html[lang="ru"] .opp .meta{line-height:1.72}
html[lang="ru"] .hero p.lead{line-height:1.7}


/* ╔══════════════════════════════════════════════════════════════════════╗
   ║  توسيط «طبقة الملخّص» — قاعدة بصرية، بحدّ صريح                        ║
   ║                                                                      ║
   ║  القاعدة: **محتوى قصير = متوسّط · قراءة طويلة = محاذاة البداية.**      ║
   ║                                                                      ║
   ║  متوسّط: اسم الفرصة · اسم الجهة · الحالة · الموعد/العدّاد · الـCTA ·   ║
   ║          سطر أو سطرين داعمين قصيرين.                                  ║
   ║  محاذاة البداية (مُستثنى بقصد): الأوصاف الطويلة · الأسئلة الشائعة ·    ║
   ║          شروط الأهلية · التحذيرات · جسم المقال · ورقة المواصفات.       ║
   ║                                                                      ║
   ║  ⚖️ عند أي تعارض بين «أجمل» و«أسهل قراءة» — القراءة تكسب، والعنصر     ║
   ║     بيفضل على محاذاة البداية. كل استثناء تحت مكتوب ومعاه سببه.        ║
   ╚══════════════════════════════════════════════════════════════════════╝ */

/* ── كارت الفرصة في القائمة ───────────────────────────────────────────── */
.ocard{text-align:center;align-items:center}
/* ⚠️ من غير `max-width` هنا بقصد: الكارت نفسه ٣٩٠px فالقياس مسقوف أصلًا،
   وأي سقف إضافي كان بيقطع الاسم بدري («…(the / Quota)» بقوس يتيم).
   `balance` بيوزّع الأسطر بالتساوي بدل ما يسيب كلمة وحيدة في الآخر. */
.ocard b{text-wrap:balance}
.ocard .en{text-align:center;text-wrap:balance}
.ocard-dt{align-self:center}
.ocard .cd{align-self:center}
.ocard .ometa{justify-content:center}
.ocard .state{text-align:center;align-self:stretch}
/* ⛔️ الوصف **مستثنى**: نصّه طويل ومقصوص على سطرين بـ«…»، وتوسيط نص مقطوع
   بيدّي حافتين مسنّنتين وسطرًا أخيرًا معلّقًا في النص. القراءة تكسب. */
.ocard .onote{text-align:start;align-self:stretch;max-width:none}
/* ⛔️ وشروط الأهلية مستثناة بنصّ القاعدة. */
.ocard .oelig{text-align:start;align-self:stretch}

/* ── كارت الفرصة المميّزة (الرئيسية) ──────────────────────────────────── */
.opp h3,.opp .meta{text-align:center}
.opp h3{text-wrap:balance}
.opp>.dt{justify-content:center}
.opp>.cd{align-self:center;margin-inline:auto}
.opp.has-img{align-items:stretch}
.opp.has-img>.cd{display:inline-flex;margin-inline:auto}
/* تذييل الكارت: الـCTA بقى متوسّطًا تحت سطر التمويل بدل صفّ مفكوك على
   الطرفين. سطر التمويل نفسه متوسّط كمان لأنه سطر داعم قصير (٢–٣ سطور
   بسقف قياس) — ولو طال عن كده بيفضل مقروءًا لأن السقف بيمنع السطر الطويل. */
.opp .ft{flex-direction:column;align-items:center;gap:12px;text-align:center}
.opp .ft .fund,.opp .ft .st{max-width:44ch;margin-inline:auto}
.opp .ft .more{flex:none}

/* ── كتل الملخّص والأرقام ─────────────────────────────────────────────── */
/* `.strip` متوسّطة أصلًا · `.all-opps-wrap` متوسّط أصلًا — مافيش تغيير. */
/* كارت «قريبًا» المختصر */
.ocard.soon .state{text-align:center}

/* ── كتل CTA المدمجة ──────────────────────────────────────────────────── */
.tool-signup{text-align:center}
.acctcard .abtns{justify-content:center}

/* ⛔️ **مستثناة صراحةً** — دي قراءة مش ملخّص:
   ورقة المواصفات (بتتمسح كعمود قيم) · التنبيهات · التحذيرات · المراحل ·
   الأسئلة الشائعة · جسم المقال · لوحة الموعد بشرحها.
   مكتوبة هنا عشان أي تعميم جاي مايلخبطش الحد. */
.qf,.qfi,.note,.note.warn,.note.tip,.deadline,.steps,.step,
details.acc,details.acc .in,.prose,.mdp,.card .li,.elig,.minlist,.eligtx{
  text-align:start}


/* ╔══════════════════════════════════════════════════════════════════════╗
   ║  قسم الأرقام/الثقة — إعادة تصميم تحريرية                              ║
   ║  كان بيتقرا كـ«إنفوجرافيك»: تلات أرقام ضخمة (حتى 72px) كل واحد        ║
   ║  بوستر لوحده. بقى قسمًا تحريريًا هادي: تلات أعمدة متساوية بفواصل        ║
   ║  شعرية، الرقم واضح من غير ما يصرخ، والسطر تحته مباشرةً.                ║
   ╚══════════════════════════════════════════════════════════════════════╝ */

/* 🔢 أهم إصلاح هنا: الرقم كان `font-family:Inter` — وInter **مافيهاش أرقام
   عربية-هندية** (٠١٢…)، فالأرقام العربية كانت بتقع على خط النظام، وده
   بالظبط سبب إحساس «شكل الأرقام مختلف عن باقي الموقع».
   دلوقتي بيرث ستاك الموقع: IBM Plex Sans Arabic للعربي واللاتيني،
   وInter للسيريلي — فنفس الوزن البصري في AR و EN و RU.
   والوزن 700 صريح: الخط محمَّل لحد 700، و«800» كانت بترجع لـ700 ضمنًا. */
.numsec .n1 b{
  font-family:inherit;
  font-size:clamp(44px,4.4vw,56px);font-weight:700;
  line-height:1.06;letter-spacing:-.022em;
  font-variant-numeric:tabular-nums;color:var(--goldText)}

.numsec{padding:58px 18px}
.numsec .k{font-size:12px;letter-spacing:.14em;margin-bottom:34px;font-weight:700}
/* فواصل شعرية بين الأعمدة بدل فجوة — الأعمدة بقت جزءًا من كتلة واحدة */
.numsec .ns{grid-template-columns:repeat(3,1fr);gap:0;align-items:start}
.numsec .n1{position:relative;padding-inline:24px}
.numsec .n1+.n1::before{content:"";position:absolute;inset-block:4px;
  inset-inline-start:0;width:1px;background:rgba(239,230,214,.16)}
.numsec .n1 .l{margin-top:13px;font-size:15px;font-weight:600;letter-spacing:.004em;color:var(--cream-k)}
.numsec .n1 small{margin-top:7px;font-size:13px;line-height:1.75;max-width:32ch;margin-inline:auto}
.numsec .nnote{margin-top:38px;padding-top:22px;font-size:12.5px}

@media(max-width:720px){
  .numsec{padding:44px 18px}
  .numsec .k{margin-bottom:26px}
  .numsec .ns{grid-template-columns:1fr;gap:0}
  .numsec .n1{padding-inline:0;padding-block:22px}
  .numsec .n1:first-child{padding-top:0}
  /* على الموبايل الفاصل بيتقلب أفقي فوق كل عنصر */
  .numsec .n1+.n1::before{inset-block:auto;top:0;inset-inline:0;width:auto;height:1px}
  .numsec .n1 b{font-size:clamp(36px,9.5vw,44px)}
  .numsec .n1 .l{margin-top:10px;font-size:14.5px}
  .numsec .n1 small{font-size:12.5px;max-width:34ch}
  .numsec .nnote{margin-top:26px;padding-top:18px}
}
/* 🐞 (ثيمات ٢٠٢٦-١٠-١١) القوس ده كان ناقص من الإنتاج: كل القواعد اللي تحت (البيتا + أي إضافة
   في آخر الملف) كانت محبوسة جوّه max-width:720px ⇒ مابتشتغلش على الديسكتوب. حارس
   check-theme-tokens بيتأكد إن الأقواس متوازنة. */
/* ═══════════════════════════════════════════════════════════════
   النسخة التجريبية للمدرّب — صفحات الطالب والإدارة.
   بيقدّمها سيرفر المدرّب (مش build.mjs) لكن بنفس الـstylesheet دي،
   فالمكوّنات كلها فوق (.card · .cta · .fld · .auth-msg · .ascount …)
   والقواعد هنا **زيادات صغيرة بس** مالهاش بديل جاهز.
   ═══════════════════════════════════════════════════════════════ */
/* حالة الطلب */
.tb-status-t{margin:8px 0 4px}
.tb-status-p{font-size:14px;margin-bottom:0}
.tb-time{font-size:15px;font-weight:700;color:var(--green);margin:2px 0 8px}
.card .ai-status[hidden]{display:none}
.tb-back{margin:18px 0 6px}
.tb-back .ghost{width:100%;justify-content:center}
/* اختيار مقسّم (أيوه/لأ · ١–٥) — نفس لغة .auth-tabs */
.tb-seg{display:flex;gap:6px;background:var(--cream);padding:4px;border-radius:999px;flex-wrap:wrap}
.tb-seg-o{flex:1 1 auto;min-width:54px;position:relative;text-align:center;font-weight:600;font-size:13.5px;
  color:var(--n62);border-radius:999px;cursor:pointer;transition:background .16s,color .16s}
.tb-seg-o>span{display:flex;align-items:center;justify-content:center;padding:11px 12px;border-radius:999px;min-height:46px;line-height:1.4}
.tb-seg-o>input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.tb-seg-o:has(input:checked){background:var(--white);color:var(--navy);box-shadow:var(--sh-1)}
.tb-seg-o:has(input:focus-visible){outline:2px solid var(--gold);outline-offset:2px}
/* أسئلة التقييم */
.tb-q{margin-bottom:18px}
.tb-q-k{font-weight:600;font-size:13.5px;color:var(--navy);margin-bottom:6px;line-height:1.7}
.tb-q-k .lt{color:var(--goldText);font-weight:700;margin-inline-end:4px}
.tb-q-h{font-size:12px;color:var(--n62);margin-bottom:8px}
.tb-q .fld{margin-bottom:0}
.tb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* لوحة الإدارة */
.tb-counts{margin:0 0 6px}
.tb-counts .ascount{flex:1 1 138px;text-align:center;padding:12px 10px}
.tb-counts .ascount b{display:block;font-size:20px;line-height:1.3;font-variant-numeric:tabular-nums}
.tb-counts .ascount span{display:block;font-size:12px;color:var(--n62);margin-top:2px}
/* «طلبات جديدة» فيها شغل مستني — تمييز ذهبي هادي، مش تحذير */
.tb-counts .ascount.tb-hot{background:linear-gradient(135deg,rgba(200,169,107,.20),rgba(200,169,107,.07));border-color:rgba(200,169,107,.55)}
.tb-counts .ascount.tb-hot b{color:var(--goldText)}
/* فلاتر: chips واضحة — مفيش radio خام */
.tb-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.tb-chip{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:10px 15px;border-radius:999px;
  font-family:inherit;font-weight:600;font-size:13px;color:var(--navy);background:var(--white);
  border:1.5px solid var(--border);cursor:pointer;transition:border-color .16s,background .16s,color .16s,transform .16s}
.tb-chip:hover{border-color:var(--goldText);transform:translateY(-1px)}
.tb-chip:active{transform:scale(.98)}
.tb-chip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.tb-chip.on{background:var(--navy);border-color:var(--navy);color:var(--white)}
.tb-chip-n{font-size:12px;font-weight:700;color:var(--n62);background:var(--cream);border-radius:999px;padding:1px 8px;min-width:22px;text-align:center}
.tb-chip.on .tb-chip-n{background:color-mix(in srgb,var(--white) 18%,transparent);color:var(--white)}
.tb-empty-card{margin:6px auto 12px;max-width:520px}
.tb-empty-card h3{margin-bottom:6px}
.tb-empty-card .prose{margin:0 auto 14px;max-width:44ch}
.tb-app{margin-bottom:12px}
.tb-app h3{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.tb-app .tb-meta{font-size:12.5px;color:var(--n62);line-height:1.9;margin-bottom:4px}
.tb-app .tb-meta b{color:var(--navy)}
.tb-reason{background:var(--soft);border-radius:12px;padding:11px 13px;font-size:13px;line-height:1.8;margin:8px 0}
.tb-fb{border-inline-start:3px solid var(--gold);padding-inline-start:12px;font-size:12.5px;line-height:1.9;margin:10px 0}
.tb-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.tb-actions .cta,.tb-actions .ghost{flex:1 1 150px;justify-content:center;margin:0}
.tb-foot{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 6px}
.tb-foot .ghost{flex:1 1 180px;justify-content:center}
/* الصفحة العامة للتجربة */
.tb-pilots{margin-top:2px;gap:10px}
.tb-pilots li{font-size:13.5px;padding:11px 16px}
.tb-list{margin-bottom:6px}
/* نداء الإجراء: زرار واحد واضح، والسطر المساعد تحته بمسافة مريحة */
.tb-cta{margin:30px 0 0;text-align:center}
.tb-cta .cta{width:min(100%,340px);justify-content:center;padding:15px 24px;font-size:15px}
.tb-note{margin:12px auto 6px;max-width:38ch;text-align:center;font-size:12.5px;line-height:1.9;color:var(--n62)}
.tb-fine{list-style:none;display:grid;gap:10px;font-size:13px;color:var(--n70);line-height:1.85;margin-bottom:8px}
.tb-fine li{padding-inline-start:18px;position:relative}
.tb-fine li::before{content:"◆";position:absolute;inset-inline-start:0;top:0;color:var(--gold);font-size:9px;line-height:24px}
@media(max-width:480px){
  .tb-seg{gap:4px;padding:3px}
  .tb-seg-o{min-width:44px;font-size:13px}
  .tb-seg-o>span{padding:11px 6px;min-height:46px}
  .tb-actions .cta,.tb-actions .ghost{flex:1 1 100%}
  .tb-counts .ascount{flex:1 1 calc(50% - 5px);padding:11px 8px}
  .tb-counts .ascount b{font-size:18px}
  .tb-chips{gap:7px}
  .tb-chip{font-size:12.5px;padding:9px 12px}
  .tb-foot .ghost{flex:1 1 100%}
  .tb-cta{margin-top:24px}
  .tb-cta .cta{width:100%}
}

/* لوحة إدارة الذكاء — نفس مكوّنات الموقع، شبكة أرقام بدل سطور خام */
.tb-kill .tb-kill-state{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:14px;font-weight:600;margin-bottom:6px}
.tb-kill .cta.danger,.tb-danger .ghost.danger{flex:1 1 200px}
.tb-counts .ascount.tb-stop{background:rgba(214,40,57,.07);border-color:rgba(214,40,57,.45)}
.tb-counts .ascount.tb-stop b{color:var(--red)}
.tb-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;margin-bottom:6px}
.tb-metric{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--white);
  border:1px solid var(--border);border-radius:12px;padding:11px 14px;font-size:13px;color:var(--n70)}
.tb-metric b{font-size:15px;color:var(--navy);font-variant-numeric:tabular-nums}
.tb-day{margin-bottom:10px}
.tb-day h3{font-size:14px;color:var(--goldText);margin-bottom:8px}
.tb-daynums{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.tb-daynums>div{background:var(--soft);border-radius:12px;padding:9px 11px;min-width:0}
.tb-daynums span{display:block;font-size:11.5px;color:var(--n62)}
.tb-daynums b{font-size:14px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.tb-evs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tb-ev{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--navy);
  background:var(--cream);border-radius:999px;padding:5px 11px}
.tb-ev .lt{color:var(--goldText)}
.tb-raw{margin-top:10px;font-size:12px;color:var(--n62)}
.tb-raw summary{cursor:pointer;font-weight:600;color:var(--goldText);min-height:34px;display:flex;align-items:center}
.tb-raw summary:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:8px}
.tb-raw p{margin-top:6px;line-height:1.9;overflow-wrap:anywhere}
.tb-elig{display:grid;gap:8px;margin-top:14px}
.tb-elig-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap;border-top:1px dashed var(--border);padding-top:9px;font-size:12.5px}
.tb-elig-id{color:var(--n62);overflow-wrap:anywhere;min-width:0}
.tb-elig-note{color:var(--n70)}
.tb-danger{border-color:rgba(214,40,57,.35)}
.tb-danger h3{color:var(--red)}
@media(max-width:480px){
  .tb-metrics{grid-template-columns:1fr}
  .tb-daynums{grid-template-columns:repeat(2,1fr)}
  .tb-kill .cta.danger,.tb-danger .ghost.danger{flex:1 1 100%}
}

/* ✉️ لوحة التواصل: قسم عادي آخر الصفحة — وزن بصري أخف (مش بتنافس هدف الصفحة) */
footer .cpanel{box-shadow:none;background:var(--soft);border-color:rgba(200,169,107,.28);margin:0 0 28px}
.cp-contact,.cp-help{padding:18px 16px}
.cp-title{font-size:16.5px}
.cp-lead{font-size:13.5px;margin-top:4px;max-width:52ch}
.cp-mail{margin-top:10px;font-size:13px}
.cp-mail-a{font-size:14px;min-height:38px}
.cp-help{background:transparent;border-top:1px solid rgba(200,169,107,.32)}
.cp-help-title{font-size:14.5px}
.cp-help p{font-size:13px}
.cp-help-cta,.cp-open{margin-top:12px;padding:10px 16px;font-size:12.5px}
@media(min-width:760px){
  footer .cpanel{margin-bottom:30px}
  .cp-contact,.cp-help{padding:20px 22px}
  .cp-help{border-top:0;border-inline-start:1px solid rgba(200,169,107,.32)}
}

/* إقرار السن في طلب البيتا — checkbox بنفس مكوّن .chk، بمساحة لمس مريحة */
.tb-age{align-items:flex-start;gap:10px;margin:4px 0 2px;font-weight:600;padding:10px 0;line-height:1.7}
.tb-age input{margin-top:3px;width:20px;height:20px}
.tb-age:focus-within{outline:2px solid var(--gold);outline-offset:4px;border-radius:10px}
.tb-age-h{font-size:12px;color:var(--n62);line-height:1.9;margin:0 0 14px;padding-inline-start:30px}

/* ═══════════════════════════════════════════════════════════════
   🌙 الوضع الليلي — بلوك التوكنز (ثيمات ٢٠٢٦-١٠-١١)
   ① [data-theme="dark"] = اختيار يدوي · ② media = «حسب الجهاز» (من غير data-theme أو بـsystem)
   🖨️ الاتنين `screen` بس — الطباعة (زي صفحة طباعة الأثر) دايمًا نهاري: الخلفيات مابتتطبعش،
      ونص فاتح على ورق أبيض كان هيختفي.
   ⚠️ البلوكين لازم يفضلوا متطابقين بالحرف — حارس tools/check-theme-tokens.mjs.
   ═══════════════════════════════════════════════════════════════ */
@media screen{
:root[data-theme="dark"]{
  color-scheme:dark;
  /* الأسطح: كحلي أثر بطبقات (مش أسود) — الصفحة ⇐ البطاقات ⇐ الأسطح الناعمة */
  --beige:#0A1829;--white:#10233A;--cream:#162D47;
  /* النص: بيج دافي بدل الأبيض الحاد */
  --navy:#F2EBDD;--navy2:#E3D9C6;
  --border:rgba(226,216,198,.14);--border-warm:rgba(226,216,198,.18);
  --n72:rgba(242,235,221,.80);--n70:rgba(242,235,221,.78);--n66:rgba(242,235,221,.74);
  --n62:rgba(242,235,221,.70);--n55:rgba(242,235,221,.60);--n35:rgba(242,235,221,.40);
  /* الذهبي كنص على الغامق محتاج يفتح (نفس منطق --goldText جوّه الأقسام الكحلية) */
  --goldText:#D9BD84;--gold-tx:#D9BD84;--gold-tx2:#E5CD98;
  --red:#FF6F7D;--green:#46C48F;--amber:#E8B54E;
  --soft:rgba(239,230,214,.05);--soft2:rgba(239,230,214,.09);--hover-warm:#1A3352;
  --warn-bg:rgba(255,111,125,.12);--warn-bg2:rgba(255,111,125,.18);--warn-tx:#FFB4BC;--warn-tx2:#F4A0A9;--warn-tx3:#F4A0A9;
  --tip-bg:rgba(70,196,143,.12);--tip-tx:#9BE3C2;--ok-tx:#5ED6A1;--ok-tx2:#5ED6A1;
  --note-bg:rgba(232,181,78,.12);--note-bd:rgba(232,181,78,.35);--note-tx:#F0C674;--cr-warn-bg:rgba(232,181,78,.10);--del-tx:#FF8A80;
  --glass-bg:rgba(16,35,58,.92);--glass-bd:rgba(226,216,198,.14);--glass-hover:rgba(239,230,214,.08);
  --wa-tx:#3DDC84;--tg-tx:#4FB7EC;
  --red-solid:#C42B3B;--green-solid:#167049;
  /* 🎨 الكحلي كهوية مش كخلفية: في الليل الصفحة نفسها كحلي، فالعناصر اللي كانت «اللحظة الكحلية»
     في النهار بتبقى سطح أعلى بوضوح + حافة ذهبي هادية ⇒ نفس الترتيب: صفحة ⇐ بطاقة ⇐ مميّز */
  --feature-bg:linear-gradient(160deg,#183456 0%,#132C4C 55%,#0F2544 100%);
  --feature-band:linear-gradient(165deg,#163253 0%,#112848 60%,#0D2140 100%);
  --band-ring:rgba(200,169,107,.32);--band-edge:rgba(200,169,107,.26);--frame-bd:rgba(226,207,166,.26);
  /* الصور تحت طبقة كحلي: الطبقة فاضلة (بتوحّد الصور) بس بدرجة الكحلي المرفوع، والحافة ذهبي كاملة */
  --ov-rgb:19,44,76;--hero-hairline:linear-gradient(90deg,rgba(200,169,107,.22),rgba(200,169,107,.62),rgba(200,169,107,.22));
  --sh-1:0 1px 2px rgba(0,0,0,.35);--sh-2:0 10px 24px -16px rgba(0,0,0,.65);--sh-3:0 18px 44px -18px rgba(0,0,0,.75);
  --sh-card:0 1px 2px rgba(0,0,0,.30), 0 12px 26px -18px rgba(0,0,0,.60);
  --sh-card-hi:0 2px 4px rgba(0,0,0,.35), 0 22px 44px -20px rgba(0,0,0,.70);
}
}
@media screen and (prefers-color-scheme: dark){
:root:not([data-theme="light"]){
  color-scheme:dark;
  /* الأسطح: كحلي أثر بطبقات (مش أسود) — الصفحة ⇐ البطاقات ⇐ الأسطح الناعمة */
  --beige:#0A1829;--white:#10233A;--cream:#162D47;
  /* النص: بيج دافي بدل الأبيض الحاد */
  --navy:#F2EBDD;--navy2:#E3D9C6;
  --border:rgba(226,216,198,.14);--border-warm:rgba(226,216,198,.18);
  --n72:rgba(242,235,221,.80);--n70:rgba(242,235,221,.78);--n66:rgba(242,235,221,.74);
  --n62:rgba(242,235,221,.70);--n55:rgba(242,235,221,.60);--n35:rgba(242,235,221,.40);
  /* الذهبي كنص على الغامق محتاج يفتح (نفس منطق --goldText جوّه الأقسام الكحلية) */
  --goldText:#D9BD84;--gold-tx:#D9BD84;--gold-tx2:#E5CD98;
  --red:#FF6F7D;--green:#46C48F;--amber:#E8B54E;
  --soft:rgba(239,230,214,.05);--soft2:rgba(239,230,214,.09);--hover-warm:#1A3352;
  --warn-bg:rgba(255,111,125,.12);--warn-bg2:rgba(255,111,125,.18);--warn-tx:#FFB4BC;--warn-tx2:#F4A0A9;--warn-tx3:#F4A0A9;
  --tip-bg:rgba(70,196,143,.12);--tip-tx:#9BE3C2;--ok-tx:#5ED6A1;--ok-tx2:#5ED6A1;
  --note-bg:rgba(232,181,78,.12);--note-bd:rgba(232,181,78,.35);--note-tx:#F0C674;--cr-warn-bg:rgba(232,181,78,.10);--del-tx:#FF8A80;
  --glass-bg:rgba(16,35,58,.92);--glass-bd:rgba(226,216,198,.14);--glass-hover:rgba(239,230,214,.08);
  --wa-tx:#3DDC84;--tg-tx:#4FB7EC;
  --red-solid:#C42B3B;--green-solid:#167049;
  /* 🎨 الكحلي كهوية مش كخلفية: في الليل الصفحة نفسها كحلي، فالعناصر اللي كانت «اللحظة الكحلية»
     في النهار بتبقى سطح أعلى بوضوح + حافة ذهبي هادية ⇒ نفس الترتيب: صفحة ⇐ بطاقة ⇐ مميّز */
  --feature-bg:linear-gradient(160deg,#183456 0%,#132C4C 55%,#0F2544 100%);
  --feature-band:linear-gradient(165deg,#163253 0%,#112848 60%,#0D2140 100%);
  --band-ring:rgba(200,169,107,.32);--band-edge:rgba(200,169,107,.26);--frame-bd:rgba(226,207,166,.26);
  /* الصور تحت طبقة كحلي: الطبقة فاضلة (بتوحّد الصور) بس بدرجة الكحلي المرفوع، والحافة ذهبي كاملة */
  --ov-rgb:19,44,76;--hero-hairline:linear-gradient(90deg,rgba(200,169,107,.22),rgba(200,169,107,.62),rgba(200,169,107,.22));
  --sh-1:0 1px 2px rgba(0,0,0,.35);--sh-2:0 10px 24px -16px rgba(0,0,0,.65);--sh-3:0 18px 44px -18px rgba(0,0,0,.75);
  --sh-card:0 1px 2px rgba(0,0,0,.30), 0 12px 26px -18px rgba(0,0,0,.60);
  --sh-card-hi:0 2px 4px rgba(0,0,0,.35), 0 22px 44px -20px rgba(0,0,0,.70);
}
}

/* 🏷️ الشعار في الهيدر حسب السطح: نسخة الكحلي على أي خلفية غامقة (الوضع الليلي، أو فوق الهيرو قبل النزول) */
@media screen{
:root[data-theme="dark"] .hdr .brand .mk-l{display:none}
:root[data-theme="dark"] .hdr .brand .mk-d{display:block}
}
@media screen and (prefers-color-scheme: dark){
:root:not([data-theme="light"]) .hdr .brand .mk-l{display:none}
:root:not([data-theme="light"]) .hdr .brand .mk-d{display:block}
}

/* 📱 /app/ — صفحة إطلاق التطبيق (إحساس إطلاق منتج: الرسالة والزر أول حاجة، والتفاصيل التقنية مقفولة) */
.app-hero{padding:34px 26px 30px;text-align:start}
.app-hero .app-ic{display:block;width:72px;height:72px;border-radius:18px;margin-bottom:16px;box-shadow:0 14px 30px -14px rgba(0,0,0,.55),0 0 0 1px rgba(200,169,107,.35)}
.app-hero h1{font-size:clamp(28px,6vw,42px)}
.app-hero p.lead{font-size:15.5px;max-width:52ch}
.app-hero .btns{margin-top:22px}
.app-dl{font-size:16px;padding:14px 30px;min-height:54px}
.app-meta{font-size:12.5px;color:var(--cream70);margin-top:12px;line-height:1.8}
.app-h{font-size:19px;font-weight:700;line-height:1.5;margin:30px 0 14px}
.app-feats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.app-feat{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:16px 16px 15px;box-shadow:var(--sh-1)}
.app-feat .fi{width:40px;height:40px;border-radius:12px;background:var(--cream);display:flex;align-items:center;justify-content:center;font-size:19px;margin-bottom:10px}
.app-feat b{display:block;font-size:15px;line-height:1.5;margin-bottom:4px}
.app-feat p{font-size:13.5px;color:var(--n62);line-height:1.75}
@media(max-width:430px){.app-feats{grid-template-columns:1fr}.app-hero .btns .cta,.app-hero .btns .ghosty{flex:1 1 100%}}
.app-again{display:flex;justify-content:center;margin:18px 0 6px}
.app-more{margin-top:28px}
.app-more details.acc .li{display:flex;gap:10px;margin-bottom:9px}
.app-more details.acc .li::before{content:"\25C6";color:var(--goldText);font-size:8px;margin-top:9px;flex:none;opacity:.75}
.app-tech{display:grid;gap:12px;margin:0}
.app-tech dt{font-size:12.5px;color:var(--n62);margin-bottom:2px}
.app-tech dd{margin:0;font-size:14px}
.app-tech code{font-size:12px;word-break:break-all;line-height:1.7}
.app-fb{text-align:center;font-size:14px;color:var(--n62);line-height:1.85;margin:24px auto 0;max-width:56ch}
.app-links{display:flex;gap:8px 18px;flex-wrap:wrap;justify-content:center;margin:14px 0 8px;font-size:13.5px}
.app-links a{color:var(--goldText);text-decoration:underline;text-underline-offset:3px}