/* ═══════════════════════════════════════════════════════════
   الصفحة الرئيسية + مكوّنات مشتركة إضافية
   Home page + shared extras
   ═══════════════════════════════════════════════════════════ */

/* ── ظهور عند التمرير ──
   تحسين تدريجي: المحتوى ظاهر افتراضياً، وجافاسكربت هي التي تُخفيه
   قبل الكشف. لو تعطّلت، يبقى كل شيء مقروءاً. */
.reveal{transition:opacity .7s var(--ease), transform .7s var(--ease)}
.reveal.armed{opacity:0; transform:translateY(18px)}
.reveal.armed.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){.reveal.armed{opacity:1; transform:none}}

/* ── لماذا ابن سينا ── */
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.why{
  background:var(--surface); padding:30px 26px 26px; display:flex; flex-direction:column; gap:11px;
  position:relative; transition:background .24s var(--ease)}
.why:hover{background:var(--surface-2)}
.why-n{
  font-family:'Tajawal'; font-weight:800; font-size:12px; letter-spacing:.08em;
  color:var(--brass); font-variant-numeric:tabular-nums}
.why h3{font-size:18.5px; line-height:1.35}
.why p{font-size:15px; color:var(--ink-2); flex:1; line-height:1.82}

/* ══ صفّ هيئة التدريس — بطاقات بورتريه قابلة للضغط ══ */
.people-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:18px}
.pcard{
  position:relative; display:block; width:100%; text-align:start; cursor:pointer;
  padding:0; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
  background:var(--surface); color:inherit;
  transition:box-shadow .28s var(--ease), transform .28s var(--ease), border-color .28s var(--ease);
}
.pcard:hover{box-shadow:var(--shadow-3); transform:translateY(-4px); border-color:var(--brass-line)}
.pcard-photo{position:relative; display:block; aspect-ratio:1/1; overflow:hidden; background:var(--surface-3)}
.pcard-photo img{width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform .6s var(--ease)}
.pcard:hover .pcard-photo img{transform:scale(1.05)}
.pcard-photo .empty-av{
  width:100%; height:100%; display:grid; place-items:center;
  background:linear-gradient(160deg, var(--surface-2), var(--surface-3));
  color:var(--ink-3); font-family:'Tajawal'; font-weight:800; font-size:52px;
}
/* تدرّج سفلي يحمل الاسم */
.pcard-photo::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(16,23,32,.88) 0%, rgba(16,23,32,.32) 34%, transparent 62%);
}
.pcard-cap{
  position:absolute; z-index:2; inset-block-end:0; inset-inline:0;
  padding:16px 18px; display:flex; flex-direction:column; gap:3px; color:#fff;
}
.pcard-cap b{font-family:'Tajawal'; font-weight:800; font-size:16px; line-height:1.35}
.pcard-cap .role{font-size:12.5px; color:#E4BC78; font-weight:600}
.pcard-cap .dept{font-size:11.5px; color:rgba(242,245,248,.68)}
.pcard-cap .cert{display:block; margin-top:2px; font-size:10.5px; color:rgba(228,188,120,.92); font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.college-table .dean-cert{display:block; margin-top:2px; font-size:12px; font-weight:600; color:var(--brass-2)}
.pcard-go{
  position:absolute; z-index:3; inset-block-start:12px; inset-inline-start:12px;
  width:30px; height:30px; display:grid; place-items:center; border-radius:50%;
  background:rgba(255,255,255,.16); backdrop-filter:blur(8px); color:#fff;
  border:1px solid rgba(255,255,255,.26);
  opacity:0; transform:scale(.85); transition:opacity .24s var(--ease), transform .24s var(--ease);
}
.pcard:hover .pcard-go{opacity:1; transform:scale(1)}
.pcard-go svg{width:14px; height:14px}
[dir="rtl"] .pcard-go svg{transform:scaleX(-1)}

/* ── تشويقة الجولة ── */
.tour-teaser{position:relative; overflow:hidden; background:var(--ink); color:var(--on-dark)}
.tour-teaser-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.34}
.tour-teaser::before{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to left, rgba(16,23,32,.96) 0%, rgba(16,23,32,.74) 55%, rgba(16,23,32,.42) 100%);
}
[dir="ltr"] .tour-teaser::before{background:linear-gradient(to right, rgba(16,23,32,.96) 0%, rgba(16,23,32,.74) 55%, rgba(16,23,32,.42) 100%)}
.tour-teaser canvas{position:absolute; inset:0; width:100%; height:100%; opacity:.4; z-index:1}
.tour-teaser-in{position:relative; z-index:2; padding-block:76px; display:grid; grid-template-columns:1.35fr .65fr; gap:40px; align-items:center}
.tour-marks{display:grid; gap:1px; background:rgba(242,245,248,.14); border:1px solid rgba(242,245,248,.14); border-radius:var(--r); overflow:hidden}
.tour-marks div{background:var(--ink-solid); padding:18px 20px}
.tour-marks b{display:block; font-family:'Tajawal'; font-weight:800; font-size:26px; color:var(--brass-2); font-variant-numeric:tabular-nums}
.tour-marks span{font-size:12.5px; color:rgba(242,245,248,.6)}

@media (max-width:900px){
  .tour-teaser-in{grid-template-columns:1fr; padding-block:56px}
  .why-grid{grid-template-columns:1fr}
}

/* ── الشبكة الرقمية للإحصاءات ── */
.stats-6{grid-template-columns:repeat(6,1fr)}
.stats-4{grid-template-columns:repeat(4,1fr)}
.stats-3{grid-template-columns:repeat(3,1fr)}
@media (max-width:940px){.stats-6{grid-template-columns:repeat(3,1fr)} .stats-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.stats-6,.stats-4,.stats-3{grid-template-columns:repeat(2,1fr)}}

/* ── قسم رأس الصفحات الداخلية بخلفية داكنة ── */
.page-head-dark{
  position:relative; overflow:hidden; background:var(--ink); color:var(--on-dark);
  padding-block:60px 54px}
.page-head-dark canvas{position:absolute; inset:0; width:100%; height:100%; opacity:.32; z-index:1}
.page-head-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.4}
.page-head-dark::after{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to left, rgba(16,23,32,.94) 0%, rgba(16,23,32,.72) 58%, rgba(16,23,32,.44) 100%);
}
[dir="ltr"] .page-head-dark::after{background:linear-gradient(to right, rgba(16,23,32,.94) 0%, rgba(16,23,32,.72) 58%, rgba(16,23,32,.44) 100%)}
.page-head-dark > .wrap{position:relative; z-index:2}
.page-head-dark h1{color:#fff}
.page-head-dark .lead{color:rgba(242,245,248,.78)}
.page-head-dark .crumb,.page-head-dark .crumb a{color:rgba(242,245,248,.55)}
.page-head-dark .crumb a:hover{color:var(--brass-2)}

/* ═══════════════════════════════════════════════════════════
   حركة تمرير أكثر حيويّة — الصفحة الرئيسية فقط (body.is-home)
   Livelier hover motion — homepage only.
   Overrides the calmer base rules (site.css / above) with a
   bigger lift, a warm brass glow and a smoother image zoom.
   Scoped to .is-home so every other page keeps the default.
   ═══════════════════════════════════════════════════════════ */
.is-home{
  /* توهّج نحاسي دافئ + حلقة رفيعة — يعمل في الوضعين الفاتح والداكن */
  --glow-brass:0 26px 52px -22px rgba(168,118,44,.42), 0 0 0 1px var(--brass-line);
}

/* بطاقات البرامج */
.is-home .prog{transition:box-shadow .34s var(--ease), transform .34s var(--ease), border-color .34s var(--ease)}
.is-home .prog:hover{transform:translateY(-8px); box-shadow:var(--glow-brass); border-color:var(--brass)}
.is-home .prog:hover .prog-img img{transform:scale(1.08)}

/* بطاقات الأخبار */
.is-home .news{transition:box-shadow .3s var(--ease), transform .3s var(--ease), border-color .3s var(--ease)}
.is-home .news:hover{transform:translateY(-6px); box-shadow:var(--glow-brass); border-color:var(--brass-line)}
.is-home .news:hover .news-img img{transform:scale(1.08)}

/* بطاقات هيئة التدريس */
.is-home .pcard:hover{transform:translateY(-8px); box-shadow:var(--glow-brass); border-color:var(--brass)}
.is-home .pcard:hover .pcard-photo img{transform:scale(1.08)}

/* بطاقات الشركاء (على لوح داكن — توهّج نحاسي أوضح) */
.is-home .partner{transition:box-shadow .3s var(--ease), transform .3s var(--ease), border-color .3s var(--ease), background .3s var(--ease)}
.is-home .partner:hover{transform:translateY(-6px);
  box-shadow:0 26px 52px -22px rgba(0,0,0,.5), 0 0 0 1px rgba(214,165,82,.6)}

/* بطاقات «لماذا ابن سينا» — الشبكة تقصّ الحواف، فبدل الرفع نمرّر شريطاً نحاسياً */
.is-home .why::before{content:''; position:absolute; inset-block:0; inset-inline-start:0;
  width:3px; background:var(--brass); transform:scaleY(0); transform-origin:top;
  transition:transform .26s var(--ease)}
.is-home .why:hover::before{transform:scaleY(1)}
.is-home .why-n{transition:color .24s var(--ease), transform .24s var(--ease)}
.is-home .why:hover .why-n{color:var(--brass-2); transform:translateY(-2px)}

/* الأزرار — رفعة + توهّج نحاسي (انزلاق السهم موروث من site.css) */
.is-home .btn{transition:background .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease)}
.is-home .btn-primary:hover{background:linear-gradient(120deg, var(--brass), var(--brass-2));
  box-shadow:0 14px 28px -12px rgba(168,118,44,.6)}
.is-home .btn-ghost:hover{box-shadow:0 12px 26px -16px rgba(16,23,32,.34)}
.is-home .btn-primary:hover, .is-home .btn-ghost:hover, .is-home .btn-dark:hover{transform:translateY(-2px)}
.is-home .btn:active{transform:translateY(1px)}

/* احترام «تقليل الحركة»: أبقِ اللون والظل، واحذف الإزاحة والتكبير */
@media (prefers-reduced-motion:reduce){
  .is-home .prog:hover, .is-home .news:hover, .is-home .pcard:hover,
  .is-home .partner:hover, .is-home .why:hover .why-n,
  .is-home .btn-primary:hover, .is-home .btn-ghost:hover, .is-home .btn-dark:hover{transform:none}
  .is-home .prog:hover .prog-img img, .is-home .news:hover .news-img img,
  .is-home .pcard:hover .pcard-photo img{transform:none}
}


/* ── دخول ترويسة الصفحات الداخلية بتتابع ──
   Internal page-head heading entrance (staggered, RTL-neutral). */
html.ready .page-head-dark .wrap > *{animation:isumsRise .65s var(--ease-out) both}
html.ready .page-head-dark .wrap > .crumb{animation-delay:.02s}
html.ready .page-head-dark .wrap > .eyebrow{animation-delay:.10s}
html.ready .page-head-dark .wrap > h1{animation-delay:.18s}
html.ready .page-head-dark .wrap > .lead{animation-delay:.26s}

/* ── تتابع البطاقات داخل قسم يظهر بالتمرير ──
   Card stagger inside a scroll-revealed section. Opt-in via
   data-stagger; JS marks each card .rv-kid and sets --rvi index.
   Direction-neutral vertical motion; transform/opacity only. */
.reveal[data-stagger].armed{transform:none}
.reveal[data-stagger].armed .rv-kid{opacity:0; transform:translateY(12px)}
.reveal[data-stagger] .rv-kid{transition:opacity .55s var(--ease-out), transform .55s var(--ease-out); transition-delay:calc(var(--rvi,0) * 65ms)}
.reveal[data-stagger].in .rv-kid{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal[data-stagger].armed .rv-kid,.reveal[data-stagger] .rv-kid{opacity:1 !important; transform:none !important; transition:none !important}
}