/*!
 * مدد — تخطيط الموقع العام (site.css)
 * الهيدر والقائمة (همبرغر عند 1024px وأقل — بدون كلاسات Bootstrap المتجاوبة، الخطة 10.9)،
 * أقسام الصفحة الرئيسية، الرسوم التوضيحية، والفوتر.
 * نقاط الانكسار: 480 / 768 / 1024 / 1280.
 */

/* ===== اللوحة: الموقع العام على أبيض نقي (الاتجاه A — 10.0)؛ اللوحات بتعلّم body[data-jb-app] ===== */
body:not([data-jb-app]) { --jb-section-bg: var(--jb-canvas); background-color: var(--jb-canvas); }

/* ===== الحاوية ===== */
.jb-container {
  width: 100%;
  max-width: calc(var(--jb-container) + 48px);
  margin-inline: auto;
  padding-inline: 16px;
}
@media (min-width: 769px) {
  .jb-container { padding-inline: 24px; }
}

/* =========================================================
   الهيدر
   ========================================================= */
.jb-site-header {
  position: sticky;
  top: 0;
  z-index: 1030;
  height: var(--jb-header-h);
  background: transparent;
  border-block-end: 1px solid transparent;
  transition: background-color var(--mo-base) var(--mo-ease), border-color var(--mo-base) var(--mo-ease),
    box-shadow var(--mo-base) var(--mo-ease);
}
.jb-site-header.is-scrolled {
  background: color-mix(in srgb, var(--jb-surface) 88%, transparent);
  border-block-end-color: var(--jb-border);
  box-shadow: var(--sh-xs);
  -webkit-backdrop-filter: saturate(160%) blur(12px);
  backdrop-filter: saturate(160%) blur(12px);
}
.jb-site-header__inner {
  height: 100%;
  display: flex;
  align-items: center;
  gap: var(--sp-4);
}

/* الشعار: نسخة حسب لغة الواجهة، والكلمة بلون النص */
.jb-brand {
  display: inline-flex;
  align-items: center;
  flex: none;
  color: var(--jb-text);
  text-decoration: none;
  border-radius: var(--r-md);
}
.jb-brand:hover { color: var(--jb-text); }
.jb-logo { display: block; height: 44px; width: auto; }
/* شعار «مدد» الأصلي مصمّم على الأسود (ظلاله جزء من شكله): يُعرض كما هو على «لوحة» سوداء بإطار ذهبي رفيع فوق الخلفيات الفاتحة،
   وتختفي اللوحة على الخلفيات السوداء (الوضع الداكن، القائمة الجانبية). الارتفاع يشمل اللوحة (border-box). */
.jb-logo--plate { box-sizing: border-box; padding: 5px 12px; border-radius: 12px; background: #0F1F3D; box-shadow: inset 0 0 0 1px rgba(46, 196, 206, .38), 0 1px 2px rgba(15, 31, 61, .12); }
[data-bs-theme="dark"] .jb-logo--plate, .jb-side .jb-logo--plate { padding: 0; background: none; box-shadow: none; border-radius: 0; }
.jb-logo.jb-logo--stacked { height: 118px; }

/* القائمة الأفقية */
.jb-site-nav { flex: 1; display: flex; justify-content: center; }
.jb-site-nav__list {
  display: flex;
  align-items: center;
  gap: var(--sp-1);
  margin: 0;
  padding: 0;
  list-style: none;
}
.jb-site-nav__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 .85rem;
  border-radius: var(--r-md);
  color: var(--jb-text-muted);
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--mo-fast) var(--mo-ease), background-color var(--mo-fast) var(--mo-ease);
}
.jb-site-nav__link:hover { color: var(--jb-primary); background: rgba(var(--jb-primary-rgb), .06); }
.jb-site-nav__link.active { color: var(--jb-primary); background: var(--jb-primary-subtle); font-weight: 600; }

.jb-site-header__actions {
  display: flex;
  align-items: center;
  gap: var(--sp-1);
  margin-inline-start: auto;
}
.jb-lang-btn { --bs-btn-padding-x: .75rem; font-weight: 600; }
.jb-site-header__cta { margin-inline-start: var(--sp-2); }
.jb-site-header__cta, .jb-site-header__login, .jb-lang-btn { white-space: nowrap; }
.jb-site-nav { min-width: 0; }
/* «ريدكس برو» أعرض من الخط السابق (D25-18): روابط أصغر قليلاً وأقرب، وتنتقل القائمة للهمبرغر تحت 1200px بدل أن تتداخل مع الشعار والأزرار */
.jb-site-nav__link { padding: 0 .6rem; font-size: .9375rem; }
@media (max-width: 1399px) { .jb-site-nav__list { gap: 0; } .jb-site-nav__link { padding: 0 .5rem; font-size: .875rem; } .jb-site-header__inner { gap: var(--sp-3); } }
@media (max-width: 1199px) { .jb-site-nav, .jb-site-header__login { display: none; } .jb-menu-toggle { display: inline-flex; } }

/* أيقونة الثيم حسب الوضع الحالي */
[data-bs-theme="dark"] .jb-theme-icon--to-dark,
[data-bs-theme="light"] .jb-theme-icon--to-light { display: none; }

.jb-menu-toggle { display: none; }

/* ≤ 1024px: همبرغر بدل القائمة الأفقية */
@media (max-width: 1024px) {
  .jb-site-nav,
  .jb-site-header__login { display: none; }
  .jb-menu-toggle { display: inline-flex; }
}
@media (max-width: 600px) {
  .jb-site-header__cta { display: none; }
  .jb-logo { height: 36px; }
}
@media (max-width: 380px) {
  .jb-lang-btn .bi { display: none; }
  .jb-lang-btn { --bs-btn-padding-x: .5rem; }
}

/* ===== لوحة القائمة على الموبايل (Offcanvas خاص) ===== */
.jb-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1040;
  background: rgba(15, 31, 61, .5);
  opacity: 0;
  transition: opacity var(--mo-base) var(--mo-ease);
}
.jb-menu-backdrop.is-open { opacity: 1; }

.jb-menu-panel {
  position: fixed;
  inset-block: 0;
  inset-inline-end: 0;
  z-index: 1050;
  width: min(88vw, 360px);
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  padding: var(--sp-4);
  background: var(--jb-surface);
  box-shadow: var(--sh-lg);
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform var(--mo-base) var(--mo-ease);
}
[dir="rtl"] .jb-menu-panel { transform: translateX(-100%); }
.jb-menu-panel.is-open,
[dir="rtl"] .jb-menu-panel.is-open { transform: none; }

.jb-menu-panel__head { display: flex; align-items: center; justify-content: space-between; }
.jb-menu-panel__title { font-size: var(--fs-h3); margin: 0; }
.jb-menu-panel__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-1); }
.jb-menu-panel__link {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  min-height: 48px;
  padding: 0 var(--sp-3);
  border-radius: var(--r-md);
  color: var(--jb-text);
  font-weight: 500;
  text-decoration: none;
}
.jb-menu-panel__link .bi { color: var(--jb-text-muted); font-size: 1.15rem; }
.jb-menu-panel__link:hover { background: var(--jb-surface-2); color: var(--jb-primary); }
.jb-menu-panel__link.active { background: var(--jb-primary-subtle); color: var(--jb-primary); font-weight: 600; }
.jb-menu-panel__link.active .bi { color: var(--jb-primary); }
.jb-menu-panel__actions { margin-block-start: auto; display: grid; gap: var(--sp-2); }

body.jb-menu-open { overflow: hidden; }

/* =========================================================
   الأقسام العامة
   ========================================================= */
#main:focus { outline: none; }

.jb-section { padding-block: clamp(4.5rem, 3rem + 5vw, 7.5rem); }
.jb-section--alt { --jb-section-bg: var(--jb-band); background: var(--jb-band); border-block: 1px solid var(--jb-border); }

.jb-section__head {
  max-width: 720px;
  margin-inline: auto;
  margin-block-end: clamp(2.5rem, 2rem + 2vw, 3.5rem);
  text-align: center;
}
.jb-section__title {
  font-size: var(--fs-section);
  line-height: 1.25;
  margin-block-end: var(--sp-3);
}
.jb-section__lead { color: var(--jb-text-muted); font-size: clamp(1.0625rem, 1rem + .25vw, 1.1875rem); max-width: 40rem; margin: 0 auto; }
.jb-section__more { text-align: center; margin: var(--sp-6) 0 0; }

/* =========================================================
   رأس الصفحات الداخلية للموقع العام (P02 → P09)
   ========================================================= */
/* الاتجاه A: هالة رئيسية خفيفة جداً بالأعلى + شبكة نقاط باهتة بتتلاشى (بدل البقع الملوّنة) */
.jb-page-hero {
  position: relative;
  isolation: isolate;
  padding-block: clamp(3.5rem, 2.5rem + 4vw, 6.5rem) clamp(2.5rem, 1.5rem + 3vw, 4rem);
  background: radial-gradient(48rem 20rem at 50% -8rem, rgba(var(--jb-primary-rgb), .10), transparent 70%);
}
.jb-page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: radial-gradient(rgba(var(--jb-text-rgb), .10) 1px, transparent 1.4px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 50% 0%, #000 20%, transparent 75%);
  mask-image: radial-gradient(ellipse 70% 80% at 50% 0%, #000 20%, transparent 75%);
  pointer-events: none;
}
.jb-page-hero__inner { max-width: 880px; text-align: center; }
.jb-page-hero__title { font-size: var(--fs-display); line-height: 1.2; margin-block-end: var(--sp-4); text-wrap: balance; }
.jb-page-hero__lead { color: var(--jb-text-muted); font-size: clamp(1.0625rem, 1rem + .3vw, 1.1875rem); max-width: 46rem; margin: 0 auto var(--sp-6); }
.jb-page-hero__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-3); }
.jb-page-hero__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-2) var(--sp-3); margin: var(--sp-6) 0 0; padding: 0; list-style: none; }
.jb-page-hero__facts li { display: inline-flex; align-items: center; gap: var(--sp-2); padding: .3rem .25rem; color: var(--jb-text-muted); font-size: var(--fs-sm); font-weight: 500; }
.jb-page-hero__facts .bi { color: var(--jb-primary); }
@media (max-width: 480px) {
  .jb-page-hero__actions .btn { flex: 1 1 100%; }
}

/* =========================================================
   Hero — سلايدر صور (D1-02)
   ========================================================= */
.jb-hero { padding: 0; }

/* بعرض الشاشة كاملة وارتفاعها (ناقص الهيدر)، والمحتوى محاذي لحدود حاوية الصفحة */
.jb-hero-slider {
  --jb-slider-interval: 6500ms;
  --jb-edge: max(16px, calc((100% - var(--jb-container)) / 2));
  position: relative;
  display: flex;
  min-height: calc(100vh - var(--jb-header-h));
  min-height: calc(100svh - var(--jb-header-h));
  overflow: hidden;
  background: #0F1F3D;
  isolation: isolate;
}
@media (min-width: 769px) {
  .jb-hero-slider { --jb-edge: max(24px, calc((100% - var(--jb-container)) / 2)); }
}

/* المسرح: الصور والبطاقات */
.jb-hero-slider__stage { position: absolute; inset: 0; }
.jb-hero-slider__slides { position: absolute; inset: 0; }
.jb-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 900ms var(--mo-ease), visibility 0s linear 900ms;
}
.jb-slide.is-active { z-index: 1; opacity: 1; visibility: visible; transition: opacity 900ms var(--mo-ease), visibility 0s; }
.jb-slide__media { position: absolute; inset: 0; overflow: hidden; }
.jb-slide__media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
[dir="rtl"] .jb-slide--mirror-rtl,
[dir="ltr"] .jb-slide--mirror-ltr { transform: scaleX(-1); }
@media (prefers-reduced-motion: no-preference) {
  .jb-slide.is-active .jb-slide__media img { animation: jb-kenburns 9s var(--mo-ease) both; }
}
@keyframes jb-kenburns { from { transform: scale(1.08); } to { transform: scale(1); } }

/* تظليل من جهة النص (داخل كل شريحة، تحت بطاقة الواجهة) لضمان تباين النص الأبيض */
.jb-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(to left, rgba(15, 31, 61, .95) 0%, rgba(15, 31, 61, .86) 38%, rgba(15, 31, 61, .45) 62%, rgba(15, 31, 61, .08) 86%),
    linear-gradient(to top, rgba(15, 31, 61, .55), transparent 40%);
}
[dir="ltr"] .jb-slide::before {
  background:
    linear-gradient(to right, rgba(15, 31, 61, .95) 0%, rgba(15, 31, 61, .86) 38%, rgba(15, 31, 61, .45) 62%, rgba(15, 31, 61, .08) 86%),
    linear-gradient(to top, rgba(15, 31, 61, .55), transparent 40%);
}

/* اللوحة: العنوان والأزرار والتحكم (ألوان ثابتة فوق التظليل الداكن) */
.jb-hero-slider__panel {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  padding-block: clamp(2.5rem, 1.5rem + 4vh, 4.5rem);
  padding-inline: var(--jb-edge);
  color: #FFFFFF;
}
.jb-hero-slider__panel > * { max-width: min(600px, 52%); }
.jb-hero-slider__eyebrow {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: var(--sp-2);
  margin-block-end: var(--sp-4);
  padding: .35rem .9rem;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .18);
  color: #DCE8FD;
  font-size: var(--fs-sm);
  font-weight: 600;
}
.jb-hero-slider__title {
  color: #FFFFFF;
  font-size: clamp(1.9rem, 1.1rem + 2.4vw, 3rem);
  line-height: 1.22;
  margin-block-end: var(--sp-4);
  text-wrap: balance;
}
.jb-hero-slider__title > span { display: block; }
.jb-hero-slider__accent { color: #9CC3FF; }
.jb-hero-slider__lead { color: #DFE6F0; font-size: clamp(1.0625rem, 1rem + .3vw, 1.2rem); margin-block-end: var(--sp-5); max-width: 34rem; }
.jb-hero-slider__cta { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-block-end: var(--sp-5); }
.jb-hero-slider__trust {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-5);
  margin: 0;
  padding: 0;
  list-style: none;
  color: #CED7E5;
  font-size: var(--fs-sm);
}
.jb-hero-slider__trust li { display: inline-flex; align-items: center; gap: var(--sp-2); }
.jb-hero-slider__trust .bi { color: #9CC3FF; }
.jb-hero-slider :focus-visible { outline-color: #FFFFFF; }

/* التحكم: إيقاف/تشغيل + مؤشرات بأسماء + السابق/التالي (WCAG 2.2.2) */
.jb-hero-slider__controls {
  margin-block-start: var(--sp-6);
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: var(--sp-2);
}
.jb-hero-slider__picks { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.jb-hero-slider__pick,
.jb-hero-slider__btn {
  position: relative;
  min-height: 44px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: var(--r-pill);
  background: rgba(15, 31, 61, .55);
  color: #DFE6F0;
  font-family: var(--jb-font);
  font-weight: 600;
  font-size: var(--fs-sm);
  overflow: hidden;
  cursor: pointer;
  transition: background-color var(--mo-fast) var(--mo-ease), color var(--mo-fast) var(--mo-ease);
}
.jb-hero-slider__pick { padding: 0 .85rem; white-space: nowrap; }
.jb-hero-slider__btn { width: 44px; display: inline-grid; place-items: center; padding: 0; font-size: 1.1rem; }
.jb-hero-slider__pick:hover,
.jb-hero-slider__btn:hover { background: rgba(255, 255, 255, .16); color: #FFFFFF; }
.jb-hero-slider__pick.is-active { background: #FFFFFF; color: #0F1F3D; border-color: #FFFFFF; }
/* شريط تقدّم العرض التلقائي داخل المؤشر النشط */
.jb-hero-slider__pick.is-active::after {
  content: "";
  position: absolute;
  inset-block-end: 0;
  inset-inline-start: 0;
  height: 3px;
  width: 0;
  background: #2EC4CE;
}
.jb-hero-slider.is-playing .jb-hero-slider__pick.is-active::after { animation: jb-slider-progress var(--jb-slider-interval) linear forwards; }
.jb-hero-slider.is-hold .jb-hero-slider__pick.is-active::after { animation-play-state: paused; }
@keyframes jb-slider-progress { to { width: 100%; } }
.jb-hero-slider__arrows { display: flex; gap: var(--sp-2); }
/* على الديسكتوب المؤشرات بأسمائها كافية للتنقل؛ الأسهم للشاشات الأصغر */
@media (min-width: 1025px) { .jb-hero-slider__arrows { display: none; } }
.jb-hero-slider:not(.is-playing) .jb-slider-icon--pause,
.jb-hero-slider.is-playing .jb-slider-icon--play { display: none; }

/* بطاقة الواجهة فوق الصورة (رسم توضيحي للنظام) */
.jb-ui-card {
  position: absolute;
  z-index: 3;
  inset-block-end: clamp(2rem, 10vh, 6rem);
  inset-inline-end: var(--jb-edge);
  width: min(370px, 34%);
  padding: var(--sp-4);
  border-radius: var(--r-lg);
  background: var(--jb-surface);
  border: 1px solid var(--jb-border);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
  color: var(--jb-text);
  font-size: var(--fs-sm);
  line-height: 1.5;
  opacity: 0;
  translate: 0 14px;
  transition: opacity 600ms var(--mo-ease) 250ms, translate 600ms var(--mo-ease) 250ms;
}
.jb-slide.is-active .jb-ui-card { opacity: 1; translate: 0 0; }
.jb-ui-card__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); margin-block-end: var(--sp-3); }
.jb-ui-card__title { display: inline-flex; align-items: center; gap: var(--sp-2); font-weight: 700; font-size: .95rem; }
.jb-ui-card__title .bi { color: var(--jb-primary); }
.jb-ui-card__muted { color: var(--jb-text-muted); font-size: var(--fs-xs); font-weight: 600; }
.jb-ui-card__rows { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); }
.jb-ui-card__rows li {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--sp-2);
  padding: .45rem .6rem;
  border: 1px solid var(--jb-border);
  border-radius: var(--r-md);
}
.jb-ui-card__time { font-weight: 700; }
.jb-ui-card__who { display: flex; flex-direction: column; min-width: 0; }
.jb-ui-card__who b,
.jb-ui-card__who small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jb-ui-card__who small { color: var(--jb-text-muted); font-size: var(--fs-xs); }
.jb-ui-card__foot {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin: var(--sp-3) 0 0;
  padding: .5rem .7rem;
  border-radius: var(--r-md);
  font-size: var(--fs-xs);
}
.jb-ui-card__foot small { color: var(--jb-text-muted); }
.jb-ui-card__foot--wa { background: var(--jb-st-completed-bg); }
.jb-ui-card__foot--wa .bi { color: var(--jb-st-completed); font-size: 1.1rem; }
.jb-ui-card__methods { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-2); margin-block-end: var(--sp-3); }
.jb-ui-card__methods span {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .2rem;
  padding: .5rem .25rem;
  border: 1px solid var(--jb-border);
  border-radius: var(--r-md);
  color: var(--jb-text-muted);
  font-weight: 600;
  font-size: var(--fs-xs);
  text-align: center;
}
.jb-ui-card__methods .bi { color: var(--jb-primary); font-size: 1.1rem; }
.jb-ui-card__methods .is-active { border-color: var(--jb-primary); background: var(--jb-primary-subtle); color: var(--jb-primary); }
.jb-ui-card__note { padding: .6rem .75rem; border: 1px solid var(--jb-border-input); border-radius: var(--r-sm); text-align: left; font-size: var(--fs-xs); }
.jb-ui-card__note p { margin: 0; }
.jb-ui-card__note p + p { margin-block-start: .25rem; }
.jb-ui-card__patient { display: flex; align-items: center; gap: var(--sp-3); margin-block-end: var(--sp-3); }
.jb-ui-card__patient > span:last-child { display: flex; flex-direction: column; }
.jb-ui-card__patient small { color: var(--jb-text-muted); font-size: var(--fs-xs); }
.jb-ui-card__alert {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin: 0 0 var(--sp-2);
  padding: .4rem .65rem;
  border-radius: var(--r-md);
  font-weight: 600;
  font-size: var(--fs-xs);
}
.jb-ui-card__alert--danger { background: var(--jb-st-no-show-bg); color: var(--jb-st-no-show); }
.jb-ui-card__alert--info { background: var(--jb-st-confirmed-bg); color: var(--jb-st-confirmed); }
.jb-ui-card__facts,
.jb-ui-card__bill { margin: var(--sp-3) 0 0; display: grid; gap: var(--sp-2); }
.jb-ui-card__facts div,
.jb-ui-card__bill div { display: flex; justify-content: space-between; gap: var(--sp-3); }
.jb-ui-card__facts dt,
.jb-ui-card__bill dt { font-weight: 500; color: var(--jb-text-muted); }
.jb-ui-card__facts dd,
.jb-ui-card__bill dd { margin: 0; font-weight: 600; text-align: end; }
.jb-ui-card__bill .is-total { padding-block-start: var(--sp-2); border-block-start: 1px dashed var(--jb-border-input); }
.jb-ui-card__bill .is-total dt,
.jb-ui-card__bill .is-total dd { color: var(--jb-text); font-weight: 700; font-size: .95rem; }
.jb-ui-card__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  margin: var(--sp-3) 0 0;
  padding: .55rem;
  border-radius: var(--r-md);
  background: var(--jb-primary);
  color: var(--jb-on-primary);
  font-weight: 600;
}

/* ≤ 1024px: الصورة تملأ الشاشة والنص فوقها من الأسفل */
@media (max-width: 1024px) {
  .jb-slide::before,
  [dir="ltr"] .jb-slide::before {
    background: linear-gradient(to top, rgba(15, 31, 61, .97) 0%, rgba(15, 31, 61, .9) 42%, rgba(15, 31, 61, .45) 70%, rgba(15, 31, 61, .2) 100%);
  }
  .jb-hero-slider__panel { justify-content: flex-end; }
  .jb-hero-slider__panel > * { max-width: 640px; }
  .jb-ui-card {
    inset-block: var(--sp-5) auto;
    inset-inline: 0;
    margin-inline: auto;
    width: min(340px, calc(100% - 2rem));
  }
  .jb-hero-slider__controls { margin-block-start: var(--sp-5); }
  .jb-hero-slider__arrows { margin-inline-start: auto; }
}
/* البطاقة بتنعرض بس إذا في مساحة فوق النص (تابلت طولي) */
@media (max-width: 600px), (max-width: 1024px) and (max-height: 999px) {
  .jb-ui-card { display: none; }
}
@media (max-width: 480px) {
  .jb-hero-slider__panel { padding-block: var(--sp-7) var(--sp-5); }
  .jb-hero-slider__cta .btn { width: 100%; }
  .jb-hero-slider__controls { flex-wrap: wrap; }
  .jb-hero-slider__picks { order: 3; width: 100%; }
  .jb-hero-slider__pick { flex: 1 1 calc(50% - var(--sp-2)); }
}

/* =========================================================
   رسم توضيحي لشاشة التوثيق (Mock) — مش لقطة حقيقية
   ========================================================= */
.jb-split__visual { position: relative; margin: 0; }
.jb-mock {
  position: relative;
  background: var(--jb-surface);
  border: 1px solid var(--jb-border);
  border-radius: var(--r-xl);
  box-shadow: var(--sh-lg);
  font-size: var(--fs-sm);
  line-height: 1.5;
}
.jb-mock--doc .jb-mock__body { padding: var(--sp-5); }
.jb-mock__patient {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-3);
  padding-block-end: var(--sp-4);
  margin-block-end: var(--sp-4);
  border-block-end: 1px solid var(--jb-border);
}
.jb-mock__patient > span:nth-child(2) { display: flex; flex-direction: column; }
.jb-mock__patient b { color: var(--jb-text); }
.jb-mock__patient small { color: var(--jb-text-muted); font-size: var(--fs-xs); }
.jb-mock__avatar {
  width: 40px;
  height: 40px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--jb-primary-subtle);
  color: var(--jb-primary);
  font-weight: 700;
}
.jb-mock__allergy {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .3rem .7rem;
  border-radius: var(--r-pill);
  background: var(--jb-st-no-show-bg);
  color: var(--jb-st-no-show);
  font-weight: 600;
  font-size: var(--fs-xs);
}
.jb-mock__label { margin: 0 0 var(--sp-2); color: var(--jb-text-muted); font-size: var(--fs-xs); font-weight: 600; }
.jb-mock__methods { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-2); margin-block-end: var(--sp-4); }
.jb-mock__method {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  padding: .75rem .5rem;
  border: 1px solid var(--jb-border);
  border-radius: var(--r-md);
  color: var(--jb-text-muted);
  font-weight: 600;
  text-align: center;
}
.jb-mock__method .bi { font-size: 1.25rem; color: var(--jb-primary); }
.jb-mock__method.is-active { border-color: var(--jb-primary); background: var(--jb-primary-subtle); color: var(--jb-primary); box-shadow: inset 0 0 0 1px var(--jb-primary); }
.jb-mock__method .jb-badge { position: absolute; inset-block-start: -10px; inset-inline-end: 6px; font-style: normal; }
.jb-mock__methods--4 { grid-template-columns: repeat(4, 1fr); }
/* ختم الاعتماد: السجل ثابت (FR-DOC-09) */
.jb-mock__stamp { display: flex; align-items: center; gap: .4rem; margin: var(--sp-3) 0 0; color: var(--jb-text-muted); font-size: var(--fs-xs); font-weight: 600; }
.jb-mock__stamp .bi { color: var(--jb-success); }
.jb-mock__note {
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--jb-border-input);
  border-radius: var(--r-sm);
  background: var(--jb-surface);
  color: var(--jb-text);
  text-align: left;
  font-size: var(--fs-sm);
}
.jb-mock__note p { margin: 0; }
.jb-mock__note p + p { margin-block-start: .35rem; }
.jb-mock__code {
  display: inline-block;
  padding: 0 .4rem;
  border-radius: var(--r-sm);
  background: var(--jb-surface-2);
  color: var(--jb-text-muted);
  font-size: var(--fs-xs);
  font-weight: 600;
}
.jb-mock__voice {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-block-start: var(--sp-3);
  padding: .55rem .75rem;
  border-radius: var(--r-pill);
  background: var(--jb-surface-2);
  direction: ltr;
}
.jb-mock__play {
  width: 32px;
  height: 32px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--jb-primary);
  color: var(--jb-on-primary);
}
.jb-mock__wave { flex: 1; display: flex; align-items: center; gap: 3px; height: 28px; }
.jb-mock__wave span { flex: 1; max-width: 5px; border-radius: 3px; background: rgba(var(--jb-primary-rgb), .55); height: 30%; }
.jb-mock__wave span:nth-child(3n) { height: 75%; }
.jb-mock__wave span:nth-child(3n+1) { height: 50%; }
.jb-mock__wave span:nth-child(4n) { height: 95%; }
.jb-mock__wave span:nth-child(-n+5) { background: var(--jb-primary); }
.jb-mock__dur { color: var(--jb-text-muted); font-weight: 600; font-size: var(--fs-xs); }
@media (max-width: 480px) {
  .jb-mock--doc .jb-mock__body { padding: var(--sp-4); }
  .jb-mock__methods { grid-template-columns: 1fr; }
  .jb-mock__methods--4 { grid-template-columns: repeat(2, 1fr); }
  .jb-mock__method { flex-direction: row; justify-content: flex-start; padding: .6rem .75rem; }
  .jb-mock__method .jb-badge { position: static; margin-inline-start: auto; }
  .jb-mock__allergy { margin-inline-start: 0; }
}

/* =========================================================
   لماذا مدد؟ — مصمَّم في الأردن لعيادات الأردن (D1-03 — التصميم ج)
   صورة حقيقية لوحدها + أربع ركائز + شريط السعر
   ========================================================= */
.jb-why-section {
  background: radial-gradient(46rem 28rem at 78% 50%, rgba(var(--jb-primary-rgb), .10), transparent 70%), var(--jb-bg);
}
[dir="ltr"] .jb-why-section { background: radial-gradient(46rem 28rem at 22% 50%, rgba(var(--jb-primary-rgb), .10), transparent 70%), var(--jb-bg); }
.jb-why {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
  gap: clamp(2rem, 1.5rem + 3vw, 4rem);
  align-items: center;
}
.jb-why__photo {
  margin: 0;
  border-radius: 28px;
  overflow: hidden;
  aspect-ratio: 1200 / 1024;
  box-shadow: 0 30px 70px rgba(15, 31, 61, .22);
}
.jb-why__photo img { width: 100%; height: 100%; object-fit: cover; }
.jb-why__title { font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.6rem); line-height: 1.25; margin-block-end: var(--sp-4); }
.jb-why__title > span { display: block; }
.jb-why__accent { color: var(--jb-primary); }
.jb-why__lead { color: var(--jb-text-muted); font-size: 1.0625rem; margin-block-end: var(--sp-5); }
.jb-why__lead strong { color: var(--jb-text); font-weight: 600; }
.jb-why__pillars { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-3); }
.jb-why__pillar {
  padding: var(--sp-4);
  border-radius: 18px;
  background: var(--jb-surface);
  border: 1px solid var(--jb-border);
  box-shadow: var(--sh-xs);
  transition: transform var(--mo-base) var(--mo-ease), box-shadow var(--mo-base) var(--mo-ease), border-color var(--mo-base) var(--mo-ease);
}
.jb-why__pillar:hover { transform: translateY(-2px); box-shadow: var(--sh-md); border-color: rgba(var(--jb-primary-rgb), .35); }
.jb-why__pillar h3 { display: flex; align-items: center; gap: var(--sp-2); font-size: 1.05rem; margin: 0 0 var(--sp-1); }
.jb-why__pillar h3 .bi { color: var(--jb-primary); font-size: 1.2rem; }
.jb-why__pillar p { margin: 0; color: var(--jb-text-muted); font-size: .9rem; }
.jb-why__price {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  margin-block-start: var(--sp-4);
  padding: var(--sp-4) var(--sp-5);
  border-radius: 18px;
  background: #0F1F3D;
  border: 1px solid rgba(163, 163, 163, .2);
  color: #FFFFFF;
}
.jb-why__price p { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem .5rem; }
.jb-why__price small { color: #A3B1C8; font-size: var(--fs-sm); }
.jb-why__price p > small:first-child { flex-basis: 100%; }
.jb-why__price b { font-size: 1.5rem; }
@media (max-width: 1024px) {
  .jb-why { grid-template-columns: 1fr; }
  .jb-why__photo { max-width: 640px; width: 100%; margin-inline: auto; }
}
@media (max-width: 480px) {
  .jb-why__pillars { grid-template-columns: 1fr; }
  .jb-why__price .btn { width: 100%; }
}

/* =========================================================
   المزايا
   ========================================================= */
.jb-features { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
.jb-feature { display: flex; flex-direction: column; gap: var(--sp-3); }
.jb-feature .jb-card__title { font-size: 1.125rem; margin: 0; }
.jb-feature .jb-card__text { font-size: .9375rem; }
.jb-feature__link { display: inline-flex; align-items: center; gap: var(--sp-1); min-height: 44px; margin-block-start: auto; font-weight: 600; }
.jb-feature--ads { background: linear-gradient(135deg, rgba(46, 196, 206, .08), var(--jb-surface) 60%); }
@media (max-width: 1024px) { .jb-features { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .jb-features { grid-template-columns: 1fr; } }

/* =========================================================
   قسم مقسوم (نص + رسم)
   ========================================================= */
.jb-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(2rem, 1.5rem + 3vw, 4rem); align-items: center; }
.jb-split > * { min-width: 0; }
.jb-split .jb-section__title,
.jb-split .jb-section__lead { text-align: start; }
.jb-split .jb-section__lead { margin-block-end: var(--sp-5); }
@media (min-width: 1025px) { .jb-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* =========================================================
   الخطوات
   ========================================================= */
.jb-steps {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-5);
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}
.jb-steps::before {
  content: "";
  position: absolute;
  inset-block-start: 28px;
  inset-inline: 16%;
  border-block-start: 2px dashed var(--jb-border-input);
  opacity: .5;
}
.jb-step { position: relative; text-align: center; padding-inline: var(--sp-3); }
.jb-step__num {
  position: relative;
  width: 56px;
  height: 56px;
  margin: 0 auto var(--sp-4);
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--jb-primary);
  color: var(--jb-on-primary);
  font-size: 1.375rem;
  font-weight: 700;
  box-shadow: 0 0 0 8px var(--jb-section-bg, var(--jb-bg));
}
.jb-step__title { font-size: 1.125rem; margin-block-end: var(--sp-2); }
.jb-step__text { color: var(--jb-text-muted); margin: 0; }
@media (max-width: 768px) {
  .jb-steps { grid-template-columns: 1fr; gap: var(--sp-6); }
  .jb-steps::before { display: none; }
}

/* =========================================================
   الباقات
   ========================================================= */
.jb-plans {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-5);
  max-width: 900px;
  margin-inline: auto;
}
.jb-plan {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: var(--sp-6);
  border-radius: var(--r-xl);
  background: var(--jb-surface);
  border: 1px solid var(--jb-border);
  box-shadow: var(--sh-sm);
}
.jb-plan--featured {
  background: linear-gradient(180deg, var(--jb-primary-subtle), var(--jb-surface) 55%);
  border: 2px solid var(--jb-primary);
  box-shadow: var(--sh-md);
}
.jb-plan__ribbon { position: absolute; inset-block-start: -14px; inset-inline-start: var(--sp-6); padding: .35em .9em; }
.jb-plan__name { font-size: 1.375rem; margin-block-end: var(--sp-1); }
.jb-plan__desc { color: var(--jb-text-muted); margin-block-end: var(--sp-4); }
.jb-plan__price { display: flex; align-items: baseline; gap: var(--sp-2); margin-block-end: var(--sp-2); }
.jb-plan__amount { font-size: clamp(2.5rem, 2rem + 1.5vw, 3rem); font-weight: 700; line-height: 1.1; color: var(--jb-text); }
.jb-plan__unit { color: var(--jb-text-muted); font-weight: 500; }
.jb-plan__doctors {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-block-end: var(--sp-5);
  color: var(--jb-primary);
  font-weight: 600;
}
.jb-plan__list { margin-block-end: var(--sp-6); }
.jb-plan__list .bi { color: var(--jb-primary); }
.jb-plan .btn { margin-block-start: auto; }
@media (max-width: 768px) { .jb-plans { grid-template-columns: 1fr; max-width: 520px; } }

/* ===== ثلاث خطط — الاتجاه A (2.2): بطاقة هادئة، السعر والزر بالأعلى، الحدود ثم المزايا ===== */
.jb-plans--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: none; gap: var(--sp-4); align-items: stretch; }
.jb-plans--3 .jb-plan {
  padding: var(--sp-6) var(--sp-5);
  border-radius: var(--r-xl);
  box-shadow: var(--sh-xs);
  transition: box-shadow var(--mo-base) var(--mo-ease), border-color var(--mo-base) var(--mo-ease);
}
.jb-plans--3 .jb-plan--featured {
  border: 2px solid var(--jb-primary);
  background: linear-gradient(180deg, rgba(var(--jb-primary-rgb), .05), var(--jb-surface) 45%);
  box-shadow: var(--sh-md);
}
@media (max-width: 960px) { .jb-plans--3 { grid-template-columns: 1fr; max-width: 560px; } }

.jb-plan__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.jb-plans--3 .jb-plan__name { font-size: 1.25rem; margin: 0; }
.jb-plan__tag {
  display: inline-flex; align-items: center; gap: .35em;
  padding: .2em .7em; border-radius: var(--r-pill);
  background: rgba(var(--jb-accent-rgb), .16); color: var(--jb-accent-text);
  font-size: var(--fs-xs); font-weight: 700; white-space: nowrap;
}
.jb-plans--3 .jb-plan__desc { margin: var(--sp-2) 0 var(--sp-4); font-size: .9375rem; }
.jb-plans--3 .jb-plan__amount { font-size: clamp(2.75rem, 2.1rem + 1.8vw, 3.5rem); letter-spacing: 0; }
.jb-plans--3 .jb-plan .jb-plan__cta { margin-block: var(--sp-5) 0; }
.jb-plan__limits {
  display: grid; gap: var(--sp-3);
  margin: var(--sp-6) 0 0; padding: var(--sp-5) 0 0;
  list-style: none; border-block-start: 1px solid var(--jb-border);
  font-weight: 600; font-size: .9375rem;
}
.jb-plan__limits li { display: flex; align-items: center; gap: var(--sp-3); }
.jb-plan__limits .bi { flex: none; color: var(--jb-primary); font-size: 1.05rem; }
.jb-plan__includes { margin: var(--sp-5) 0 var(--sp-3); color: var(--jb-text-muted); font-size: var(--fs-sm); font-weight: 600; }
.jb-plans--3 .jb-plan__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); font-size: .9375rem; }
.jb-plans--3 .jb-plan__list li { display: flex; align-items: flex-start; gap: var(--sp-3); }
.jb-plans--3 .jb-plan__list .bi {
  flex: none; display: inline-grid; place-items: center;
  width: 20px; height: 20px; margin-block-start: .2rem; border-radius: 50%;
  background: var(--jb-primary-subtle); color: var(--jb-primary); font-size: .75rem;
}

.jb-trial-note {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  max-width: 900px;
  margin: var(--sp-6) auto 0;
  padding: var(--sp-4) var(--sp-5);
  border-radius: var(--r-lg);
  border: 1px dashed rgba(46, 196, 206, .7);
  background: rgba(46, 196, 206, .07);
}
.jb-trial-note p { margin: 0; flex: 1; color: var(--jb-text-muted); }
.jb-trial-note strong { display: block; color: var(--jb-text); }
/* تنبيه حذف بيانات التجربة (D25-20): سطر كامل تحت الدعوة */
.jb-trial-note { flex-wrap: wrap; }
.jb-trial-note > .jb-purge-note { flex: 1 1 100%; margin: 0; color: var(--jb-text); }
.jb-trial-note > .jb-purge-note strong, .jb-trial-note > .jb-purge-note b { display: inline; }
@media (max-width: 768px) {
  .jb-trial-note { flex-direction: column; align-items: flex-start; }
  .jb-trial-note .btn { width: 100%; }
}

.jb-paymethods {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--sp-3) var(--sp-5);
  max-width: 900px;
  margin: var(--sp-5) auto 0;
  color: var(--jb-text-muted);
  font-size: var(--fs-sm);
}
.jb-paymethods__title { margin: 0; font-weight: 600; color: var(--jb-text); }
.jb-paymethods__list { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin: 0; padding: 0; list-style: none; }
.jb-paymethods__list li { display: inline-flex; align-items: center; gap: var(--sp-2); }
.jb-paymethods__list .bi { color: var(--jb-primary); }
.jb-paymethods__link { display: inline-flex; align-items: center; gap: var(--sp-1); font-weight: 600; min-height: 44px; }

/* =========================================================
   الأسئلة الشائعة
   ========================================================= */
.jb-faq { display: grid; grid-template-columns: 1fr; gap: var(--sp-6); }
@media (min-width: 1025px) {
  .jb-faq { grid-template-columns: 1fr 1.7fr; align-items: start; }
  .jb-faq__head { text-align: start; margin: 0; position: sticky; top: calc(var(--jb-header-h) + var(--sp-5)); }
  .jb-faq__head .jb-section__lead { margin-block-end: var(--sp-5); }
}
@media (max-width: 1024px) {
  .jb-faq__head .btn { margin-block-start: var(--sp-4); }
}
.jb-faq__list .accordion-item + .accordion-item { margin-block-start: 0; }

/* =========================================================
   دعوة أخيرة (ألوان ثابتة بالوضعين: أبيض فوق تيل غامق 5.47:1+)
   ========================================================= */
.jb-cta { padding-block: 0 clamp(3.5rem, 2rem + 5vw, 6rem); }
/* بطاقة دعوة بهوية مدد: تدرّج تيل عميق مع توهّجين ناعمين، خط «نبضة» (رمز الشعار) يعبر البطاقة،
   وحافة علوية لامعة رفيعة. الألوان ثابتة بالوضعين (أبيض فوق تيل غامق ≥ 7:1) */
.jb-cta__box {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-6);
  padding: clamp(2.25rem, 1.5rem + 3.4vw, 4rem) clamp(1.5rem, 1rem + 3.4vw, 4rem);
  border-radius: calc(var(--r-xl) + 4px);
  background:
    radial-gradient(55% 120% at 100% 0%, rgba(110, 168, 255, .22), transparent 62%),
    radial-gradient(45% 110% at 0% 100%, rgba(46, 196, 206, .24), transparent 60%),
    linear-gradient(135deg, #1A3866 0%, #142C55 50%, #0F1F3D 100%);   /* زيتي «مدد» الداكن بتوهّج فيروزي وذهبي */
  color: #FFFFFF;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 24px 48px -20px rgba(0, 0, 0, .55), 0 2px 6px rgba(15, 31, 61, .08);
}
[dir="ltr"] .jb-cta__box {
  background:
    radial-gradient(55% 120% at 0% 0%, rgba(110, 168, 255, .22), transparent 62%),
    radial-gradient(45% 110% at 100% 100%, rgba(46, 196, 206, .24), transparent 60%),
    linear-gradient(225deg, #1A3866 0%, #142C55 50%, #0F1F3D 100%);
}
/* شبكة نقاط باهتة من جهة النص */
.jb-cta__box::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: radial-gradient(rgba(255, 255, 255, .16) 1px, transparent 1.4px);
  background-size: 22px 22px;
  -webkit-mask-image: linear-gradient(to left, #000, transparent 55%);
  mask-image: linear-gradient(to left, #000, transparent 55%);
  pointer-events: none;
}
[dir="ltr"] .jb-cta__box::before { -webkit-mask-image: linear-gradient(to right, #000, transparent 55%); mask-image: linear-gradient(to right, #000, transparent 55%); }
/* شريط منحنٍ ذهبي (من رمز «مدد») يعبر أسفل البطاقة ويتلاشى عند الطرفين */
.jb-cta__box::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0;
  z-index: -1;
  height: 30%;
  background: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 600 120%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0 96 C120 30 220 30 300 70 S470 112 600 40%27 fill=%27none%27 stroke=%27%23D4AF37%27 stroke-width=%272.4%27 stroke-linejoin=%27round%27 stroke-linecap=%27round%27 vector-effect=%27non-scaling-stroke%27/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  opacity: .32;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 25%, #000 75%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 25%, #000 75%, transparent);
  pointer-events: none;
}
.jb-cta__box > div:first-child { max-width: 38rem; }
.jb-cta__title { position: relative; color: #FFFFFF; font-size: clamp(1.625rem, 1.2rem + 1.6vw, 2.5rem); line-height: 1.25; margin-block-end: var(--sp-3); text-wrap: balance; }
.jb-cta__text { position: relative; color: #D0DCDF; margin: 0; font-size: 1.125rem; line-height: 1.75; text-wrap: pretty; }
.jb-cta__actions { position: relative; display: flex; flex-wrap: wrap; gap: var(--sp-3); flex: none; }
.jb-cta__actions .btn { min-height: 54px; padding-inline: var(--sp-5); border-radius: var(--r-md); font-weight: 700; }
.jb-cta__actions .btn-jb-accent { box-shadow: 0 10px 24px -10px rgba(46, 196, 206, .8); }
.jb-cta__actions .btn-jb-accent:hover { transform: translateY(-1px); }
.jb-cta__actions .jb-btn-on-dark { --bs-btn-bg: rgba(255, 255, 255, .08); --bs-btn-border-color: rgba(255, 255, 255, .45); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
@media (prefers-reduced-motion: reduce) { .jb-cta__actions .btn-jb-accent:hover { transform: none; } }
.jb-cta__box .btn:focus-visible { outline-color: #FFFFFF; }
@media (max-width: 900px) {
  .jb-cta__box { flex-direction: column; align-items: flex-start; gap: var(--sp-5); }
  .jb-cta__actions { width: 100%; }
  .jb-cta__actions .btn { flex: 1 1 auto; }
}

/* =========================================================
   الفوتر
   ========================================================= */
/* فوتر داكن بلون الهوية (نفس عائلة الشريط الجانبي باللوحات): الرموز مُعاد تعريفها داخله فقط،
   فالروابط والعناوين وحلقة التركيز تتكيّف تلقائياً. التباين: النص 13:1، الثانوي 7.6:1 على أفتح نقطة */
.jb-site-footer {
  --jb-text: #E7EDF7;
  --jb-text-muted: #A9B6CC;
  --jb-border: rgba(255, 255, 255, .1);
  --jb-primary: #5ED6DE;           /* روابط الفوتر ذهبية — 11:1 */
  --jb-gold-1: #5ED6DE; --jb-gold-2: #14A39A;   /* اسم «مدد» لامع على الزيتي الداكن */
  --jb-primary-rgb: 94, 214, 222;
  position: relative;
  padding-block: var(--sp-7) var(--sp-5);
  color: var(--jb-text);
  background:
    radial-gradient(60% 120% at 100% 0%, rgba(46, 196, 206, .12), transparent 60%),
    radial-gradient(50% 90% at 0% 100%, rgba(110, 168, 255, .08), transparent 60%),
    linear-gradient(180deg, #111C31 0%, #0F1F3D 100%);
  color-scheme: dark;
}
/* خط علوي رفيع متدرّج بلون الهوية */
.jb-site-footer::before {
  content: ""; position: absolute; inset-inline: 0; inset-block-start: 0; height: 3px;
  background: linear-gradient(90deg, transparent, rgba(46, 196, 206, .75), rgba(110, 168, 255, .6), transparent);
}
[data-bs-theme="dark"] .jb-site-footer { background: radial-gradient(60% 120% at 100% 0%, rgba(110, 168, 255, .1), transparent 60%), linear-gradient(180deg, #0C2229 0%, #08161B 100%); }
.jb-site-footer__grid {
  display: grid;
  grid-template-columns: 1.7fr repeat(3, 1fr);
  gap: var(--sp-6);
  padding-block-end: var(--sp-6);
}
.jb-site-footer .jb-brand { color: #FFFFFF; }
.jb-site-footer__about { color: var(--jb-text-muted); margin: var(--sp-4) 0 var(--sp-5); max-width: 26rem; font-size: .9375rem; line-height: 1.8; }
.jb-site-footer__contact { display: grid; gap: var(--sp-3); margin: 0; padding: 0; list-style: none; }
.jb-site-footer__contact li { display: flex; align-items: center; gap: var(--sp-2); color: var(--jb-text-muted); font-size: var(--fs-sm); }
.jb-site-footer__contact li > .bi { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--r-md); background: rgba(255, 255, 255, .06); color: var(--jb-primary); }
.jb-site-footer__contact li > a { color: var(--jb-text); text-decoration: none; font-weight: 600; }
.jb-site-footer__contact li > a:hover { color: var(--jb-primary); }
.jb-site-footer__wa {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  min-height: 44px; padding: 0 var(--sp-4);
  border: 1px solid rgba(110, 168, 255, .35); border-radius: var(--r-pill);
  background: rgba(110, 168, 255, .1); color: #FFFFFF !important;
  font-weight: 600; text-decoration: none;
  transition: background-color var(--mo-fast) var(--mo-ease), border-color var(--mo-fast) var(--mo-ease);
}
.jb-site-footer__wa .bi { color: var(--jb-primary); font-size: 1.1rem; }
.jb-site-footer__wa:hover { background: rgba(110, 168, 255, .18); border-color: rgba(110, 168, 255, .6); }
.jb-site-footer__heading { margin-block-end: var(--sp-4); color: #FFFFFF; font-size: 1rem; font-weight: 700; }
.jb-site-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-1); }
.jb-site-footer__col a {
  display: inline-flex; align-items: center; gap: .4rem;
  min-height: 36px;
  color: var(--jb-text-muted);
  text-decoration: none;
  transition: color var(--mo-fast) var(--mo-ease);
}
/* سهم صغير يظهر عند التمرير — يتجه حسب اللغة */
.jb-site-footer__col a::before {
  content: ""; width: 0; height: 2px; border-radius: 2px; background: var(--jb-primary);
  transition: width var(--mo-fast) var(--mo-ease);
}
.jb-site-footer__col a:hover { color: #FFFFFF; }
.jb-site-footer__col a:hover::before { width: 10px; }
@media (prefers-reduced-motion: reduce) { .jb-site-footer__col a::before, .jb-site-footer__wa { transition: none; } }
.jb-site-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-2) var(--sp-4);
  padding-block-start: var(--sp-5);
  border-block-start: 1px solid var(--jb-border);
  color: var(--jb-text-muted);
  font-size: var(--fs-sm);
}
.jb-site-footer__bottom p { margin: 0; }
.jb-site-footer__credit { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .35rem; }
.jb-site-footer__credit .bi { color: var(--jb-primary); }
.jb-site-footer__credit strong { color: #FFFFFF; font-weight: 600; }
@media (max-width: 1024px) { .jb-site-footer__grid { grid-template-columns: repeat(3, 1fr); } .jb-site-footer__brand { grid-column: 1 / -1; } }
@media (max-width: 480px) { .jb-site-footer__grid { grid-template-columns: 1fr 1fr; } }

/* =========================================================
   الصفحات الهيكلية (قيد الإنشاء) — مؤقت لحد بناء الصفحات
   ========================================================= */
.jb-stub {
  min-height: calc(100vh - var(--jb-header-h) - 220px);
  display: grid;
  place-items: center;
  padding-block: var(--sp-8);
}
.jb-stub__card {
  max-width: 560px;
  text-align: center;
  padding: clamp(2rem, 1.5rem + 2vw, 3rem);
  border-radius: var(--r-xl);
  background: var(--jb-surface);
  border: 1px solid var(--jb-border);
  box-shadow: var(--sh-md);
}
.jb-stub__icon { width: 64px; height: 64px; margin: 0 auto var(--sp-4); font-size: 1.75rem; }
.jb-stub__card h1 { margin-block-end: var(--sp-3); }
.jb-stub__card p { color: var(--jb-text-muted); }
.jb-stub__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-3); margin-block-start: var(--sp-5); }
.jb-stub-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  height: var(--jb-header-h);
}
.jb-stub-top__actions { display: flex; align-items: center; gap: var(--sp-1); }

/* =========================================================
   بانر الصفحات الداخلية للموقع العام (قرار العميل — 2.2)
   صورة حقيقية بعرض الشاشة تحاكي الصفحة + طبقة داكنة متدرجة + مسار التنقل + العنوان + الوصف.
   للموقع العام فقط (الأسعار، المزايا، من نحن…) — مش للوحات التحكم.
   ========================================================= */
.jb-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-height: clamp(320px, 24vw + 120px, 440px);
  padding-block: clamp(2.5rem, 2rem + 3vw, 4.5rem);
  background: #0F1F3D;
  color: #FFFFFF;
}
.jb-banner__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 40%; }
/* التدرّج من جهة النص (البداية) أغمق — بيضمن تباين النص الأبيض فوق أي صورة */
.jb-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(to left, rgba(15, 31, 61, .9) 0%, rgba(15, 31, 61, .76) 45%, rgba(15, 31, 61, .5) 100%),
    linear-gradient(to top, rgba(15, 31, 61, .35), transparent 55%);
}
[dir="ltr"] .jb-banner::after {
  background:
    linear-gradient(to right, rgba(15, 31, 61, .9) 0%, rgba(15, 31, 61, .76) 45%, rgba(15, 31, 61, .5) 100%),
    linear-gradient(to top, rgba(15, 31, 61, .35), transparent 55%);
}
@media (max-width: 768px) {
  .jb-banner::after, [dir="ltr"] .jb-banner::after { background: rgba(15, 31, 61, .8); }
}
.jb-banner__inner { position: relative; }
.jb-banner__title { max-width: 820px; margin: var(--sp-4) 0 var(--sp-3); color: #FFFFFF; font-size: clamp(2rem, 1.35rem + 2.6vw, 3.25rem); line-height: 1.2; }
.jb-banner__lead { max-width: 44rem; margin: 0; color: #DFE6F0; font-size: clamp(1.0625rem, 1rem + .3vw, 1.1875rem); }
.jb-banner__actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-block-start: var(--sp-5); }
.jb-banner :focus-visible { outline-color: #FFFFFF; }
@media (max-width: 480px) { .jb-banner__actions .btn { flex: 1 1 100%; } }

/* مسار التنقل (Breadcrumb) — جزء من البانر وخارج الأجزاء المشتركة (12.2) */
.jb-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); margin: 0; padding: 0; list-style: none; font-size: var(--fs-sm); font-weight: 500; }
.jb-crumbs li { display: inline-flex; align-items: center; gap: var(--sp-2); color: #FFFFFF; }
.jb-crumbs li + li::before { content: "/"; color: rgba(255, 255, 255, .6); }
.jb-crumbs a { display: inline-flex; align-items: center; gap: .35rem; min-height: 32px; color: #DFE6F0; text-decoration: none; }
.jb-crumbs a:hover { color: #FFFFFF; text-decoration: underline; }
.jb-crumbs [aria-current="page"] { color: #FFFFFF; font-weight: 600; }

/* =========================================================
   بطاقة الطبيب (الدليل P10 + "أطباء مدد" بالرئيسية) — الاتجاه A
   ========================================================= */
.jb-doctors { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); margin: 0; padding: 0; list-style: none; }
@media (max-width: 1024px) { .jb-doctors { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px) { .jb-doctors { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .jb-doctors { grid-template-columns: 1fr; } }
/* بطاقة «ملف تعريفي»: شريط علوي هادئ بلون الهوية، والصورة كبيرة بالوسط تتداخل معه، ثم الاسم والتخصص كوسم،
   والمعلومات بصندوق رمادي فاتح، والأزرار بالأسفل — كل البطاقات بنفس الارتفاع والإيقاع */
.jb-doctor {
  position: relative; display: flex; flex-direction: column; gap: var(--sp-3);
  padding: 0 0 var(--sp-4); overflow: hidden; text-align: center;
  border: 1px solid var(--jb-border); border-radius: var(--r-lg);
  background: var(--jb-surface); box-shadow: var(--sh-xs);
  transition: box-shadow var(--mo-base) var(--mo-ease), border-color var(--mo-base) var(--mo-ease), transform var(--mo-base) var(--mo-ease);
}
.jb-doctor::before {
  content: ""; display: block; flex: none; height: 72px;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(var(--jb-primary-rgb), .18), transparent 60%),
    linear-gradient(180deg, rgba(var(--jb-primary-rgb), .10), rgba(var(--jb-primary-rgb), .03));
  border-block-end: 1px solid rgba(var(--jb-primary-rgb), .10);
}
.jb-doctor:hover { box-shadow: var(--sh-md); border-color: rgba(var(--jb-primary-rgb), .3); transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .jb-doctor:hover { transform: none; } }
.jb-doctor__head { display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); min-width: 0; margin-block-start: -56px; padding-inline: var(--sp-4); }
.jb-doctor__head > div { display: grid; justify-items: center; gap: 6px; min-width: 0; }
.jb-doctor__name { margin: 0; font-size: 1.125rem; line-height: 1.35; overflow-wrap: anywhere; }
.jb-doctor__spec { display: inline-block; padding: 2px var(--sp-3); border-radius: var(--r-pill); background: var(--jb-primary-subtle); color: var(--jb-primary); font-size: var(--fs-xs); font-weight: 700; }
.jb-doctor__meta {
  display: grid; gap: 6px; margin: 0 var(--sp-4); padding: var(--sp-3);
  border-radius: var(--r-md); background: var(--jb-surface-2);
  list-style: none; text-align: start; color: var(--jb-text-muted); font-size: var(--fs-sm);
}
.jb-doctor__meta li { display: flex; align-items: flex-start; gap: var(--sp-2); min-width: 0; }
.jb-doctor__meta li > span { min-width: 0; overflow-wrap: anywhere; }
.jb-doctor__meta .bi { flex: none; margin-block-start: .2rem; color: var(--jb-primary); }
.jb-doctor__phone { direction: ltr; unicode-bidi: isolate; color: var(--jb-text); font-weight: 600; }
.jb-doctor__actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); margin-block-start: auto; padding-inline: var(--sp-4); }
.jb-doctor__actions .btn { --bs-btn-padding-x: .5rem; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; font-size: var(--fs-sm); }

/* الصورة الرمزية بالحرف الأول — أزواج ألوان مقاسة (10.2.2) */
.jb-avatar {
  flex: none; display: inline-grid; place-items: center;
  width: 52px; height: 52px; border-radius: 50%;
  font-size: 1.25rem; font-weight: 700;
  background: var(--jb-primary-subtle); color: var(--jb-primary);
}
.jb-avatar--photo { object-fit: cover; object-position: center 30%; background: var(--jb-surface-2); }
/* بالبطاقة: صورة (أو حرف) كبيرة بإطار بلون السطح يفصلها عن الشريط، وظل ناعم */
.jb-doctor .jb-avatar { width: 96px; height: 96px; font-size: 2rem; box-shadow: 0 0 0 4px var(--jb-surface), 0 6px 18px rgba(15, 31, 61, .12); }
.jb-avatar--1 { background: var(--jb-st-confirmed-bg); color: var(--jb-st-confirmed); }
.jb-avatar--2 { background: var(--jb-st-completed-bg); color: var(--jb-st-completed); }
.jb-avatar--3 { background: var(--jb-st-with-doctor-bg); color: var(--jb-st-with-doctor); }
.jb-avatar--4 { background: var(--jb-st-arrived-bg); color: var(--jb-st-arrived); }

/* =========================================================
   لقطة المنتج: إطار نافذة أنيق (10.0 — واجهات حقيقية بـ HTML)
   ========================================================= */
.jb-shot { border: 1px solid var(--jb-border); border-radius: var(--r-xl); background: var(--jb-surface); box-shadow: var(--sh-lg); overflow: hidden; }
.jb-shot__bar { display: flex; align-items: center; gap: 6px; padding: .6rem var(--sp-4); border-block-end: 1px solid var(--jb-border); background: var(--jb-surface-2); }
.jb-shot__bar > span { width: 10px; height: 10px; border-radius: 50%; background: var(--jb-border-input); opacity: .45; }
.jb-shot__bar > b { margin-inline-start: var(--sp-2); color: var(--jb-text-muted); font-size: var(--fs-xs); font-weight: 600; }
.jb-shot__body { padding: var(--sp-5); }

/* مخطط الأسنان المصغّر (عرض بالموقع العام) — ترقيم FDI، ما بينعكس بالعربي */
.jb-dchart { direction: ltr; display: grid; gap: var(--sp-2); }
.jb-dchart__row { display: grid; grid-template-columns: repeat(16, minmax(0, 1fr)); gap: 4px; }
.jb-dchart__row--upper { padding-block-end: var(--sp-2); border-block-end: 1px dashed var(--jb-border); }
.jb-tooth {
  display: grid; place-items: center; aspect-ratio: 3 / 4;
  border-radius: 6px 6px 10px 10px; border: 1px solid var(--jb-border-input);
  background: var(--jb-surface); color: var(--jb-text-muted);
  font-size: .625rem; font-weight: 600; font-variant-numeric: tabular-nums;
}
.jb-dchart__row--lower .jb-tooth { border-radius: 10px 10px 6px 6px; }
.jb-tooth--caries { background: var(--jb-st-no-show-bg); border-color: var(--jb-st-no-show); color: var(--jb-st-no-show); }
.jb-tooth--filling { background: var(--jb-st-confirmed-bg); border-color: var(--jb-st-confirmed); color: var(--jb-st-confirmed); }
.jb-tooth--root { background: var(--jb-st-with-doctor-bg); border-color: var(--jb-st-with-doctor); color: var(--jb-st-with-doctor); }
.jb-tooth--crown { background: var(--jb-st-arrived-bg); border-color: var(--jb-st-arrived); color: var(--jb-st-arrived); }
.jb-tooth--missing { background: transparent; border-style: dashed; color: var(--jb-text-muted); text-decoration: line-through; }
.jb-tooth--planned { border-style: dashed; border-width: 1.5px; }
.jb-dchart__legend { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin: var(--sp-3) 0 0; padding: 0; list-style: none; font-size: var(--fs-xs); color: var(--jb-text-muted); }
.jb-dchart__legend li { display: inline-flex; align-items: center; gap: .4rem; }
.jb-dchart__legend .jb-tooth { width: 14px; font-size: 0; }
.jb-dchart__note { display: flex; align-items: center; gap: var(--sp-2); margin: var(--sp-4) 0 0; padding: .6rem .8rem; border-radius: var(--r-md); background: var(--jb-surface-2); font-size: var(--fs-sm); }
.jb-dchart__note .bi { color: var(--jb-text-muted); }

/* قائمة النماذج التخصصية */
.jb-tplist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4) var(--sp-5); margin: var(--sp-5) 0 0; padding: 0; list-style: none; }
.jb-tplist li { display: flex; align-items: flex-start; gap: var(--sp-3); }
.jb-tplist .jb-icon-tile { width: 40px; height: 40px; font-size: 1.1rem; }
.jb-tplist b { display: block; font-size: .9375rem; }
.jb-tplist small { color: var(--jb-text-muted); font-size: var(--fs-sm); }
@media (max-width: 480px) { .jb-tplist { grid-template-columns: 1fr; } }

/* =========================================================
   مجتمع مدد (السوق + المنتدى + الإعلانات) بالرئيسية
   ثلاث بطاقات موحّدة: معاينة منتج واقعية على خلفية ملوّنة بلون البطاقة (السوق تيل، المنتدى نيلي،
   الشركات ذهبي) تُقصّ من الأسفل بتلاشٍ ناعم، ثم أيقونة وعنوان ووصف، وتذييل ثابت بالأسفل
   ========================================================= */
.hc-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-5); }
@media (max-width: 1100px) { .hc-cards { grid-template-columns: minmax(0, 1fr); max-width: 640px; margin-inline: auto; } }
.hc-card {
  --c: 31, 95, 214; --c-text: var(--jb-primary);
  display: flex; flex-direction: column; overflow: hidden;
  border-radius: var(--r-xl); border: 1px solid var(--jb-border); background: var(--jb-surface);
  box-shadow: 0 1px 2px rgba(15, 31, 61, .04), 0 12px 30px -18px rgba(15, 31, 61, .18);
  transition: transform var(--mo-base) var(--mo-ease), box-shadow var(--mo-base) var(--mo-ease), border-color var(--mo-base) var(--mo-ease);
}
.hc-card:hover { transform: translateY(-4px); border-color: rgba(var(--c), .35); box-shadow: 0 1px 2px rgba(15, 31, 61, .04), 0 24px 44px -20px rgba(var(--c), .45); }
@media (prefers-reduced-motion: reduce) { .hc-card, .hc-card:hover, .hc-card:hover .hc-window, .hc-card:hover .hc-ad { transition: none; transform: none; } }
.hc-card--forum { --c: 46, 196, 206; --c-text: #0A6B73; }
.hc-card--ads { --c: 217, 119, 6; --c-text: var(--jb-accent-text); }
[data-bs-theme="dark"] .hc-card--forum { --c-text: #5ED6DE; }
[data-bs-theme="dark"] .hc-card--market { --c-text: #9CC3FF; }

/* المعاينة: خلفية بلون البطاقة + شبكة نقاط خفيفة، والنافذة تطفو وتنقصّ من الأسفل */
.hc-card__preview {
  position: relative; isolation: isolate; flex: none; height: 268px; overflow: hidden;
  padding: var(--sp-5) var(--sp-5) 0;
  border-block-end: 1px solid var(--jb-border);
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(var(--c), .16), rgba(var(--c), .04) 70%),
    var(--jb-surface-2);
}
.hc-card__preview::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background-image: radial-gradient(rgba(var(--c), .22) 1px, transparent 1.4px);
  background-size: 16px 16px;
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 75%);
  mask-image: linear-gradient(180deg, #000, transparent 75%);
}
.hc-card__preview::after {
  content: ""; position: absolute; inset-inline: 0; inset-block-end: 0; height: 48px; pointer-events: none;
  background: linear-gradient(180deg, transparent, var(--jb-surface-2));
}

/* نافذة المعاينة (السوق والمنتدى) */
.hc-window {
  border: 1px solid var(--jb-border); border-radius: var(--r-lg); background: var(--jb-surface);
  box-shadow: 0 18px 40px -22px rgba(var(--c), .55), var(--sh-sm);
  font-size: var(--fs-sm); transition: transform var(--mo-base) var(--mo-ease);
}
.hc-card:hover .hc-window, .hc-card:hover .hc-ad { transform: translateY(-4px); }
.hc-window__bar {
  display: flex; align-items: center; gap: var(--sp-2); padding: .6rem var(--sp-3);
  border-block-end: 1px solid var(--jb-border); color: var(--jb-text); font-size: var(--fs-xs);
}
.hc-window__bar > .bi { color: var(--c-text); font-size: .95rem; }
.hc-window__count {
  margin-inline-start: auto; padding: .1em .55em; border-radius: var(--r-pill);
  background: rgba(var(--c), .12); color: var(--c-text); font-weight: 700;
}

/* عناصر السوق */
.hc-item { display: flex; align-items: center; gap: var(--sp-3); padding: .65rem var(--sp-3); }
.hc-item + .hc-item { border-block-start: 1px solid var(--jb-border); }
.hc-thumb { flex: none; display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-md); font-size: 1.15rem; }
.hc-thumb--teal { background: rgba(31, 95, 214, .12); color: #1F5FD6; }
.hc-thumb--gold { background: rgba(217, 119, 6, .14); color: #B45309; }
.hc-thumb--indigo { background: rgba(46, 196, 206, .16); color: #0A6B73; }   /* ذهبي «مدد» */
[data-bs-theme="dark"] .hc-thumb--teal { color: #9CC3FF; }
[data-bs-theme="dark"] .hc-thumb--gold { color: #FCD34D; }
[data-bs-theme="dark"] .hc-thumb--indigo { color: #5ED6DE; }
.hc-item__main { flex: 1; min-width: 0; }
.hc-item__main b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.hc-item__main small { display: flex; align-items: center; gap: .25rem; color: var(--jb-text-muted); font-size: var(--fs-xs); }
.hc-item__end { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.hc-price { font-weight: 700; white-space: nowrap; }
.hc-price small { color: var(--jb-text-muted); font-size: .7rem; font-weight: 600; }
.hc-price--free { color: var(--jb-success, #15803D); }
.hc-chip { padding: 0 .5em; border-radius: var(--r-pill); background: var(--jb-surface-2); color: var(--jb-text-muted); font-size: .6875rem; font-weight: 600; line-height: 1.6; }

/* منشور المنتدى + رد */
.hc-post { padding: var(--sp-3); }
.hc-post__head { display: flex; align-items: center; gap: var(--sp-2); }
.hc-post__head img, .hc-reply img { flex: none; border-radius: 50%; object-fit: cover; object-position: center 30%; background: var(--jb-surface-2); }
.hc-post__head img { width: 40px; height: 40px; box-shadow: 0 0 0 2px var(--jb-surface), 0 0 0 3px rgba(var(--c), .35); }
.hc-post__head > span, .hc-reply > span { min-width: 0; display: flex; flex-direction: column; }
.hc-post__head b, .hc-reply b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.hc-post__head small { color: var(--jb-text-muted); font-size: var(--fs-xs); }
.hc-post__text { margin: var(--sp-2) 0 0; color: var(--jb-text); line-height: 1.6; }
.hc-post__meta { display: flex; gap: var(--sp-4); margin-block-start: var(--sp-2); color: var(--jb-text-muted); font-size: var(--fs-xs); }
.hc-post__meta span { display: inline-flex; align-items: center; gap: .3rem; }
.hc-post__meta .bi { color: var(--c-text); }
.hc-reply {
  display: flex; align-items: flex-start; gap: var(--sp-2);
  margin: 0 var(--sp-3) var(--sp-3); margin-inline-start: var(--sp-6); padding: var(--sp-2) var(--sp-3);
  border-inline-start: 2px solid rgba(var(--c), .45); border-radius: var(--r-md); background: var(--jb-surface-2);
}
.hc-reply img { width: 32px; height: 32px; }
.hc-reply small { color: var(--jb-text-muted); font-size: var(--fs-xs); line-height: 1.5; }

/* بطاقة إعلان مصغّرة (بنفس روح jb-adcard) + وسم الاستهداف */
.hc-ad {
  display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--jb-border); border-radius: var(--r-lg); background: var(--jb-surface);
  box-shadow: 0 18px 40px -22px rgba(var(--c), .6), var(--sh-sm);
  transition: transform var(--mo-base) var(--mo-ease);
}
.hc-ad__media {
  position: relative; flex: none; display: grid; place-items: center; height: 60px; overflow: hidden;
  background: radial-gradient(circle at 25% 20%, #F7E3A1, #D4AF37 50%, #B45309);
}
/* خط نبض خفيف عبر صورة الإعلان */
.hc-ad__media::before {
  content: ""; position: absolute; inset-inline: 0; inset-block-start: 50%; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55) 20%, rgba(255, 255, 255, .55) 80%, transparent);
}
.hc-ad__media span { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .9); color: #B45309; font-size: 1.3rem; box-shadow: 0 6px 16px rgba(120, 53, 15, .3); }
.hc-ad__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: var(--sp-1); padding: var(--sp-3); }
.hc-ad__meta { display: flex; align-items: center; gap: var(--sp-2); margin: 0; min-width: 0; color: var(--jb-text-muted); font-size: var(--fs-xs); }
.hc-ad__meta > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-ad__label { flex: none; padding: 0 .45em; border-radius: 4px; background: rgba(var(--c), .14); color: var(--c-text); font-weight: 700; font-size: .6875rem; }
.hc-ad__title { font-size: var(--fs-sm); font-weight: 700; line-height: 1.45; }
.hc-ad__btns { display: flex; gap: 4px; margin-block-start: var(--sp-1); }
.hc-ad__btns > span {
  flex: 1 1 auto; min-width: 0; display: inline-flex; align-items: center; justify-content: center; gap: .25rem;
  padding: .3rem .4rem; border-radius: var(--r-sm, 6px); border: 1px solid var(--jb-border);
  font-size: .6875rem; font-weight: 600; white-space: nowrap; color: var(--jb-text);
}
.hc-ad__btns .bi-whatsapp { color: #16A34A; }
.hc-target {
  display: flex; align-items: center; gap: var(--sp-2); width: fit-content; max-width: 100%;
  margin: var(--sp-4) auto 0; padding: .35rem .85rem; position: relative; z-index: 1; border-radius: var(--r-pill);
  border: 1px dashed rgba(var(--c), .55); background: var(--jb-surface); color: var(--jb-text); font-size: var(--fs-xs); font-weight: 600;
}
.hc-target .bi { color: var(--c-text); }

/* بطاقة الإعلان قصيرة وتظهر كاملة: بلا تلاشٍ */
.hc-card--ads .hc-card__preview::after { display: none; }

/* جسم البطاقة */
.hc-card__body { display: flex; flex-direction: column; gap: var(--sp-2); flex: 1; padding: var(--sp-5) var(--sp-5) var(--sp-4); }
.hc-icon {
  display: inline-grid; place-items: center; width: 44px; height: 44px; margin-block: calc(-1 * var(--sp-5) - 22px) var(--sp-1);
  position: relative; z-index: 1;
  border-radius: var(--r-md); background: rgb(var(--c)); color: #fff; font-size: 1.25rem;
  box-shadow: 0 0 0 4px var(--jb-surface), 0 10px 20px -8px rgba(var(--c), .8);
}
.hc-card__title { margin: 0; font-size: 1.1875rem; font-weight: 700; }
.hc-card__text { margin: 0; color: var(--jb-text-muted); font-size: .9375rem; line-height: 1.75; }
.hc-card__foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-2) var(--sp-3);
  margin-block-start: auto; padding-block-start: var(--sp-4); border-block-start: 1px solid var(--jb-border);
}
.hc-card__body > .hc-card__text { margin-block-end: var(--sp-3); }
.hc-lock {
  display: inline-flex; align-items: center; gap: .35rem; padding: .25em .7em; border-radius: var(--r-pill);
  background: var(--jb-surface-2); color: var(--jb-text-muted); font-size: var(--fs-xs); font-weight: 600;
}
.hc-lock .bi { color: var(--jb-accent-text); }
.hc-more { display: inline-flex; align-items: center; gap: .35rem; color: var(--c-text); font-size: var(--fs-sm); font-weight: 700; text-decoration: none; }
.hc-more:hover { text-decoration: underline; text-underline-offset: 3px; }
.hc-more .bi { transition: transform var(--mo-fast) var(--mo-ease); }
.hc-more:hover .bi { transform: translateX(3px); }
[dir="rtl"] .hc-more .bi { transform: scaleX(-1); }
[dir="rtl"] .hc-more:hover .bi { transform: scaleX(-1) translateX(3px); }
.hc-card__foot--btns { justify-content: flex-start; }
.hc-card__foot--btns .btn { flex: 1 1 auto; }
@media (max-width: 400px) { .hc-card__preview { padding-inline: var(--sp-3); } .hc-card__body { padding-inline: var(--sp-4); } }
/* معاينات مصغّرة (صفحة المزايا) */
.jb-mini { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3); border: 1px solid var(--jb-border); border-radius: var(--r-md); background: var(--jb-surface); font-size: var(--fs-sm); }
.jb-mini + .jb-mini { margin-block-start: var(--sp-2); }
.jb-mini > div { min-width: 0; }
.jb-mini b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jb-mini small { color: var(--jb-text-muted); }
.jb-mini__thumb { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: var(--r-md); background: var(--jb-primary-subtle); color: var(--jb-primary); font-size: 1.2rem; }
.jb-mini__price { margin-inline-start: auto; font-weight: 700; white-space: nowrap; }
.jb-mini .jb-avatar { width: 36px; height: 36px; font-size: .95rem; }
.jb-mini__post { display: block; margin-block-start: 2px; color: var(--jb-text); font-weight: 400; white-space: normal; }
.jb-mini__meta { display: flex; gap: var(--sp-3); margin-block-start: 4px; color: var(--jb-text-muted); font-size: var(--fs-xs); }

/* ===== تحديث لقطات الرئيسية بآخر تعديلات اللوحات (2026-10-22) ===== */
/* طريقة الدفع بشريحة الفوترة: نقداً أو ذمم (D25-15) */
.jb-ui-card__methods--pay { margin-block-start: var(--sp-3); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.jb-ui-card__methods--pay > span { flex-direction: row; justify-content: center; gap: .35rem; padding: .35rem .5rem; }
.jb-ui-card__methods--pay > span > span { display: contents; }
.jb-ui-card__methods--pay .bi { font-size: .95rem; }
/* البازار والإعلان بصورهما الحقيقية */
.hc-thumb--img { overflow: hidden; background: var(--jb-surface-2); }
.hc-thumb--img img { width: 100%; height: 100%; object-fit: cover; }
.hc-ad__media--img::before { display: none; }
.hc-ad__media--img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 72% 40%; }
/* خطة علاج الأسنان بمراحلها (D25-09) */
.jb-dchart__plan { display: grid; gap: .4rem; margin: var(--sp-3) 0 0; padding: 0; list-style: none; font-size: var(--fs-xs); }
.jb-dchart__plan li { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; padding: .35rem .6rem; border: 1px solid var(--jb-border); border-radius: var(--r-md); background: var(--jb-surface); }
.jb-dchart__plan li > span:not(.jb-ph) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jb-dchart__plan b { flex: none; min-width: 1.8rem; color: var(--jb-text); font-weight: 700; text-align: center; }
.jb-ph { flex: none; padding: .05rem .55rem; border-radius: var(--r-pill); font-weight: 700; white-space: nowrap; }
.jb-ph--planned { background: rgba(217, 119, 6, .12); color: #92400E; }
.jb-ph--progress { background: rgba(3, 105, 161, .1); color: #0369A1; }
.jb-ph--done { background: rgba(21, 128, 61, .1); color: #166534; }
[data-bs-theme="dark"] .jb-ph--planned { color: #FCD34D; }
[data-bs-theme="dark"] .jb-ph--progress { color: #7DD3FC; }
[data-bs-theme="dark"] .jb-ph--done { color: #86EFAC; }