/* ══════════════════════════════════════════════════════════════════
   صفحة «الخطط والأسعار» — كسوة خاصة بالصفحة وحدها (site/pages/plans)
   ─ كل القيم من توكنات site-home-sixth.css — لا لون خارج المنظومة.
   ─ قاعدة النظام: الوان صلبة، لا تدرجات.
   ─ كل الاصناف بادئتها h6p- فلا تسرب لاي صفحة اخرى.
   ─ الخصائص منطقية (inline/block) لان الصفحة RTL.
   ══════════════════════════════════════════════════════════════════ */

/* ══════ الاقسام والراس ══════ */
.h6p-sec{background:var(--surface);}
.h6p-sec.alt{background:var(--paper);}
/* راس الصفحة h1 بايقاع h2 رؤوس الاقسام (قاعدة .h6-sec-head تخص h2 وحده) */
.h6p-sec .h6-sec-head h1{font-size:clamp(29px,4vw,44px);margin-block:16px 12px;}
.h6p-sec .h6-sec-head{max-width:720px;}

/* ══════ بطاقات الخطط ══════ */
.h6p-plans{
  display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));
  gap:18px;align-items:stretch;max-width:980px;margin-inline:auto;
}
@media(max-width:900px){.h6p-plans{grid-template-columns:1fr;max-width:560px;}}

.h6p-plan{
  position:relative;display:flex;flex-direction:column;gap:12px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:26px;box-shadow:var(--sh-1);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.h6p-plan:hover{transform:translateY(-4px);box-shadow:var(--sh-2);}
.h6p-plan.is-here{border-color:var(--tq);}
/* البطاقة المميزة داكنة كلوحة النداء في الهبوط: حبر ابيض بشفافيات */
.h6p-plan.hot{background:var(--night-surface);color:#fff;border:2px solid rgba(45,212,191,.35);box-shadow:var(--sh-2);}
.h6p-plan.hot.is-here{border-color:var(--tq-accent);}

.h6p-plan-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.h6p-plan-name{font-size:21px;font-weight:800;line-height:1.3;}
.h6p-plan.hot .h6p-plan-name{color:#fff;}
.h6p-plan-for{font-size:14.5px;color:var(--ink-2);line-height:1.65;}
.h6p-plan.hot .h6p-plan-for{color:rgba(255,255,255,.88);}

.h6p-price{display:flex;align-items:baseline;gap:7px;margin-block-start:6px;flex-wrap:wrap;}
.h6p-price b{font-size:46px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums;color:var(--tq-dark);}
.h6p-price i{font-style:normal;font-size:14px;font-weight:700;color:var(--ink-3);}
.h6p-price .h6p-price-per{font-weight:600;}
.h6p-plan.hot .h6p-price b{color:var(--tq-accent);}
.h6p-plan.hot .h6p-price i{color:rgba(255,255,255,.86);}
.h6p-price-sub{font-size:13px;color:var(--ink-3);line-height:1.7;}
.h6p-plan.hot .h6p-price-sub{color:rgba(255,255,255,.84);}

.h6p-plan-list{display:flex;flex-direction:column;gap:9px;margin-block-start:8px;padding-block-start:14px;border-block-start:1px solid var(--line);}
.h6p-plan.hot .h6p-plan-list{border-block-start-color:rgba(255,255,255,.12);}
.h6p-plan-list li{display:flex;align-items:flex-start;gap:9px;font-size:14px;line-height:1.6;color:var(--ink-2);}
.h6p-plan.hot .h6p-plan-list li{color:rgba(255,255,255,.9);}
.h6p-plan-list i{font-size:16px;color:var(--tq-dark);flex:0 0 auto;margin-block-start:3px;}
.h6p-plan.hot .h6p-plan-list i{color:var(--tq-accent);}

.h6p-plan-cta{margin-block-start:auto;padding-block-start:16px;}
.h6p-plan-cta .h6-btn{width:100%;}
.h6p-plan-note{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--ink-3);line-height:1.6;}
.h6p-plan-note i{font-size:16px;color:var(--amber);flex:0 0 auto;margin-block-start:2px;}

/* المشترك بين الخطط: شريط شرائح بنقطة فيروزية كشرائح المحطات في المميزات */
.h6p-common{
  display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;
  margin-block-start:26px;font-size:13.5px;font-weight:600;color:var(--ink-2);
}
.h6p-common li{display:inline-flex;align-items:center;gap:7px;}
.h6p-common li::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--tq);opacity:.7;flex:0 0 auto;}
.h6p-common li.is-head{font-weight:800;color:var(--ink);}
.h6p-common li.is-head::before{display:none;}

/* ══════ جدول المقارنة ══════ */
/* الجدول يتمرر داخل غلافه على الشاشات الضيقة — الصفحة نفسها لا تتمرر افقيا */
.h6p-tablewrap{overflow-x:auto;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);}
.h6p-table{width:100%;min-width:640px;border-collapse:collapse;}
.h6p-table th,.h6p-table td{padding:13px 16px;text-align:start;vertical-align:middle;border-block-end:1px solid var(--line);}
.h6p-table tbody tr:last-child th,.h6p-table tbody tr:last-child td{border-block-end:0;}
.h6p-table thead th{background:var(--surface);font-size:13px;font-weight:700;color:var(--ink-2);vertical-align:top;}
.h6p-table thead th b{display:block;font-size:15px;color:var(--ink);}
.h6p-table thead th small{display:block;font-size:12px;font-weight:600;color:var(--ink-3);margin-block-start:2px;}
.h6p-table thead th .h6-tag{margin-block-start:6px;}
.h6p-table th.hot,.h6p-table td.hot{background:var(--tq-tint);}
.h6p-table thead th.hot b{color:var(--tq-ink);}
.h6p-table thead th.hot small{color:var(--tq-ink);opacity:.8;}
.h6p-table tbody th{font-weight:400;}
.h6p-th-l{width:34%;}

.h6p-row-l{display:flex;align-items:flex-start;gap:10px;}
.h6p-row-l > i{font-size:18px;color:var(--tq-dark);flex:0 0 auto;margin-block-start:2px;}
.h6p-row-l b{display:block;font-size:14.5px;font-weight:800;color:var(--ink);line-height:1.4;}
.h6p-row-l small{display:block;font-size:12px;color:var(--ink-3);line-height:1.55;margin-block-start:2px;}

.h6p-v{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap;}
.h6p-v i{font-size:15px;}
.h6p-v.inf,.h6p-v.yes{color:var(--tq-dark);}
.h6p-v.no{color:var(--ink-3);font-weight:600;}
/* قيمة نصية لا رقمية (صف البنك) — تلتف ولا تدفع العمود */
.h6p-v.txt{white-space:normal;font-weight:600;line-height:1.5;}
.h6p-table td.hot .h6p-v{color:var(--tq-ink);}
.h6p-table td.hot .h6p-v.no{color:var(--ink-3);}
/* عمود الزائر الحالي: خط علوي فيروزي بدل شارة نصية — الشارة على البطاقة وحدها */
.h6p-table thead th.is-here{box-shadow:inset 0 3px 0 var(--tq);}

.h6p-note{display:flex;align-items:flex-start;gap:8px;margin-block-start:14px;font-size:13px;color:var(--ink-3);line-height:1.7;max-width:76ch;}
.h6p-note i{font-size:16px;color:var(--tq-dark);flex:0 0 auto;margin-block-start:3px;}
.h6p-empty{text-align:center;font-size:15px;color:var(--ink-3);padding-block:20px;}

/* ══════ المقررات المعروضة ══════ */
.h6p-courses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
@media(max-width:1000px){.h6p-courses{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:600px){.h6p-courses{grid-template-columns:1fr;}}
.h6p-course{
  position:relative;display:flex;flex-direction:column;gap:10px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:18px 18px 16px;overflow:hidden;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s;
}
.h6p-course::after{content:'';position:absolute;inset-block-start:0;inset-inline:0;height:3px;background:var(--tq);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease);}
.h6p-course:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:transparent;}
.h6p-course:hover::after{transform:scaleX(1);}
/* التصفية تخفي بالصنف نفسه الذي يضعه site-home-sixth.js على بطاقات /courses */
.h6p-course.is-hide{display:none;}
.h6p-course h3{font-size:17px;font-weight:800;line-height:1.35;}
.h6p-course-meta{display:flex;flex-wrap:wrap;gap:6px;}
.h6p-chip{display:inline-flex;align-items:center;padding:3px 10px;border-radius:100px;font-size:12px;font-weight:700;background:var(--surface);border:1px solid var(--line);color:var(--ink-2);}
.h6p-chip.free{background:var(--tq-tint);border-color:rgba(28,163,144,.22);color:var(--tq-ink);}
.h6p-chip.disc{background:var(--amber-tint);border-color:transparent;color:var(--amber-ink);}
.h6p-course-q{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink-3);}
.h6p-course-q i{font-size:15px;color:var(--tq-dark);}
.h6p-course-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-block-start:auto;padding-block-start:12px;border-block-start:1px solid var(--line);}
.h6p-cprice{display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap;}
.h6p-cprice b{font-size:21px;font-weight:900;color:var(--tq-dark);font-variant-numeric:tabular-nums;}
.h6p-cprice i{font-style:normal;font-size:12px;font-weight:700;color:var(--ink-3);}
.h6p-cprice del{font-size:12.5px;color:var(--ink-3);}

/* ══════ المقرر بالنقاط ══════ */
.h6p-points{
  position:relative;overflow:hidden;
  display:grid;grid-template-columns:.9fr 1.6fr;gap:28px;align-items:center;
  background:var(--night-surface);color:#fff;
  border:1px solid rgba(255,255,255,.10);border-radius:var(--r-xl);
  padding:clamp(22px,3.2vw,36px);box-shadow:var(--sh-2);
}
@media(max-width:900px){.h6p-points{grid-template-columns:1fr;gap:20px;}}
/* هالة صلبة خافتة كلوحة التواصل — زخرفة لا تحمل معنى */
.h6p-points::before{content:'';position:absolute;inset-block-start:-120px;inset-inline-end:-90px;width:320px;height:320px;border-radius:50%;background:var(--tq-accent);opacity:.13;filter:blur(70px);pointer-events:none;}
.h6p-points > *{position:relative;z-index:1;}
.h6p-points-copy h2{color:#fff;font-size:clamp(22px,2.8vw,30px);margin-block:14px 8px;}
.h6p-points-copy p{color:rgba(255,255,255,.86);font-size:14.5px;line-height:1.7;margin-block-end:18px;max-width:40ch;}
.h6p-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;counter-reset:none;}
@media(max-width:700px){.h6p-steps{grid-template-columns:1fr;}}
.h6p-step{display:flex;align-items:flex-start;gap:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px;transition:.3s var(--ease);}
.h6p-step:hover{background:rgba(45,212,191,.10);border-color:rgba(45,212,191,.3);}
.h6p-step em{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto;background:rgba(45,212,191,.16);color:var(--tq-accent);font-style:normal;}
.h6p-step em i{font-size:19px;}
.h6p-step b{display:block;font-size:14.5px;font-weight:800;line-height:1.4;color:#fff;}
.h6p-step span span{display:block;font-size:13px;color:rgba(255,255,255,.84);line-height:1.6;margin-block-start:3px;}

/* ══════ الاسئلة الشائعة ══════ */
.h6p-faq{max-width:820px;margin-inline:auto;display:flex;flex-direction:column;gap:10px;}
.h6p-faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding-inline:18px;transition:border-color .25s,box-shadow .25s;}
.h6p-faq details[open]{border-color:rgba(28,163,144,.35);box-shadow:var(--sh-1);}
.h6p-faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:15px;font-weight:800;font-size:15.5px;color:var(--ink);}
.h6p-faq summary::-webkit-details-marker{display:none;}
.h6p-faq summary i{font-size:18px;color:var(--tq-dark);flex:0 0 auto;transition:transform .25s var(--ease);}
.h6p-faq details[open] summary i{transform:rotate(180deg);}
.h6p-faq p{padding-block:0 16px;font-size:14.5px;color:var(--ink-2);line-height:1.85;}
.h6p-faq p a{color:var(--tq-dark);font-weight:700;text-decoration:underline;text-underline-offset:3px;}

/* ══════ النداء الختامي ══════ */
.h6p-end{text-align:center;}
.h6p-end p{font-size:17px;color:var(--ink-2);margin-block-end:20px;}
.h6p-end .h6-cta-btns{justify-content:center;}

/* ══════ النسخة البسيطة /plans-2 ══════
   البطاقات نفسها (.h6p-plan)، وما يخصها: راس بلا مسار، وسطر السقوف الصغير
   تحت البطاقات، ورف المقررات صفا لكل مادة بشرائح صفوفها. */
.h6p2-hero{max-width:720px;margin:0 auto;text-align:center;}
.h6p2-hero h1{font-size:clamp(30px,4.4vw,48px);margin-block:16px 12px;}
.h6p2-hero h1:only-child{margin-block:0;}
.h6p2-hero p{color:var(--ink-2);font-size:17.5px;}
/* راس النموذج الثاني قصير: القسم يحمل العنوان وحده والبطاقتان في اللوحة تحته */
.h6p2-top{padding-block:40px 34px;}

/* لوحة داكنة تحمل البطاقتين فاتحتين — عكس الصفحة الاولى (بطاقة داكنة على
   ارضية فاتحة)، فيقرا النموذجان مختلفين من اول نظرة. الشريط العلوي شفاف في
   قمة الصفحة ويفترض هيرو فاتحا، لذلك اللوحة ثانية لا اولى. */
.h6p2-band{background:var(--night-surface);color:#fff;padding-block:52px 48px;}
.h6p2-band .h6p-plan{border-color:transparent;box-shadow:var(--sh-3);}
.h6p2-band .h6p-plan.h6p2-hi{border:2px solid var(--tq-accent);}
.h6p2-ribbon{
  position:absolute;inset-block-start:-13px;inset-inline-start:22px;
  display:inline-flex;align-items:center;gap:6px;
  background:var(--tq-accent);color:var(--night);font-size:12px;font-weight:800;
  padding:4px 12px;border-radius:100px;box-shadow:0 8px 20px rgba(45,212,191,.35);
}
.h6p2-ribbon i{font-size:13px;}
.h6p2-band .h6p2-foot{color:rgba(255,255,255,.86);margin-block-start:26px;}
.h6p2-band .h6p2-foot li::before{background:var(--tq-accent);opacity:.9;}
.h6p2-band .h6p2-foot a{color:var(--tq-accent);}
.h6p2-band .h6p2-foot a:hover{color:#fff;}

.h6p2-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-block-start:22px;font-size:13px;font-weight:600;color:var(--ink-3);}
.h6p2-foot li{display:inline-flex;align-items:center;gap:7px;}
.h6p2-foot li::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--tq);opacity:.7;flex:0 0 auto;}
.h6p2-foot a{display:inline-flex;align-items:center;gap:5px;color:var(--tq-dark);font-weight:800;}
.h6p2-foot a:hover{color:var(--tq-ink);}

.h6p2-subjects{display:flex;flex-direction:column;gap:12px;max-width:920px;margin-inline:auto;}
.h6p2-subject{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 18px;box-shadow:var(--sh-1);}
.h6p2-subject > b{font-size:16px;font-weight:800;color:var(--ink);margin-inline-end:6px;}
.h6p2-grade{
  display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:6px 14px;border-radius:100px;
  background:var(--surface);border:1px solid var(--line);font-size:13.5px;font-weight:700;color:var(--ink-2);
  transition:background .2s,border-color .2s,color .2s;
}
.h6p2-grade:hover{background:var(--tq-tint);border-color:rgba(28,163,144,.35);color:var(--tq-ink);}
.h6p2-grade em{font-style:normal;font-size:11.5px;font-weight:800;padding:2px 8px;border-radius:100px;background:var(--amber-tint);color:var(--amber-ink);}
.h6p2-grade em.free{background:var(--tq);color:#fff;}
@media(max-width:600px){.h6p2-subject > b{width:100%;margin:0;}}
