/* ==========================================================================
   EgyHosting — Homepage 2026
   كل الكلاسات هنا تبدأ بـ eh- لتجنّب أي تعارض مع bootstrap / main.css / custom.css
   RTL هو الوضع الافتراضي، و [dir="ltr"] يعالج النسخة الإنجليزية.
   ========================================================================== */

/* -------------------------------------------------- 1. التوكنز (متغيرات التصميم) */
:root {
  --eh-red: #d11e2b;
  --eh-red-dark: #a3151f;
  --eh-red-soft: #fdeceD;
  --eh-blue: #0088cc;
  --eh-blue-dark: #005f90;
  --eh-blue-soft: #e8f5fc;
  --eh-green: #12a150;
  --eh-green-soft: #e6f6ed;
  --eh-amber: #f0a000;

  --eh-ink: #0f2438;
  --eh-ink-2: #34495e;
  /* غُمِّق من #64798d في 20 سبتمبر 2026: كان تباينه 4.23 على خلفية
     #f5f8fb و4.51 على الأبيض — الأول رسوبٌ في WCAG AA (المطلوب 4.5).
     مقيس على الصفحة الحيّة: 47 عنصرًا يستعمله، كلها على خلفيات فاتحة
     (لا استعمال واحد على داكن)، فالتغميق يحسّنها جميعًا بلا ضرر.
     بعده: 5.18 و5.52. */
  --eh-muted: #566b7f;
  --eh-line: #e4ebf2;
  --eh-bg: #f5f8fb;
  --eh-white: #ffffff;

  --eh-r-sm: 10px;
  --eh-r: 16px;
  --eh-r-lg: 24px;
  --eh-r-pill: 999px;

  --eh-sh-sm: 0 2px 10px rgba(15, 36, 56, .06);
  --eh-sh: 0 6px 24px rgba(15, 36, 56, .08);
  --eh-sh-lg: 0 18px 48px rgba(15, 36, 56, .14);

  --eh-container: 1180px;
  --eh-gap: 24px;
}

/* -------------------------------------------------- 2. أساسيات مشتركة */
.eh-section {
  padding: 68px 0;
  position: relative;
}

.eh-section--tight { padding: 44px 0; }
.eh-section--bg    { background: var(--eh-bg); }
.eh-section--ink   { background: var(--eh-ink); color: #fff; }

.eh-container {
  width: 100%;
  max-width: var(--eh-container);
  margin: 0 auto;
  padding: 0 18px;
}

.eh-head {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 44px;
}

.eh-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--eh-red-soft);
  color: var(--eh-red);
  font-size: 13px;
  font-weight: 700;
  padding: 7px 16px;
  border-radius: var(--eh-r-pill);
  margin-bottom: 14px;
}

.eh-eyebrow--blue { background: var(--eh-blue-soft); color: var(--eh-blue-dark); }

.eh-h2 {
  font-size: clamp(26px, 3.4vw, 38px);
  line-height: 1.35;
  font-weight: 800;
  color: var(--eh-ink);
  margin: 0 0 14px;
}

.eh-section--ink .eh-h2 { color: #fff; }

.eh-sub {
  font-size: 17px;
  line-height: 1.85;
  color: var(--eh-muted);
  margin: 0;
}

.eh-section--ink .eh-sub { color: rgba(255, 255, 255, .78); }

/* الأزرار */
.eh-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 14px 28px;
  border-radius: var(--eh-r-sm);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
}

.eh-btn:hover,
.eh-btn:focus { text-decoration: none; transform: translateY(-2px); }

.eh-btn:focus-visible { outline: 3px solid var(--eh-blue); outline-offset: 3px; }

.eh-btn--primary { background: var(--eh-red); color: #fff; box-shadow: 0 6px 18px rgba(209, 30, 43, .28); }
.eh-btn--primary:hover, .eh-btn--primary:focus { background: var(--eh-red-dark); color: #fff; }

.eh-btn--blue { background: var(--eh-blue); color: #fff; box-shadow: 0 6px 18px rgba(0, 136, 204, .28); }
.eh-btn--blue:hover, .eh-btn--blue:focus { background: var(--eh-blue-dark); color: #fff; }

.eh-btn--ghost { background: transparent; color: var(--eh-ink); border-color: var(--eh-line); }
.eh-btn--ghost:hover, .eh-btn--ghost:focus { border-color: var(--eh-blue); color: var(--eh-blue-dark); }

.eh-btn--white { background: #fff; color: var(--eh-ink); }
.eh-btn--white:hover, .eh-btn--white:focus { background: #f2f6fa; color: var(--eh-ink); }

.eh-btn--outline-white { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .45); }
.eh-btn--outline-white:hover, .eh-btn--outline-white:focus { background: rgba(255, 255, 255, .12); color: #fff; }

.eh-btn--block { width: 100%; }

.eh-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  margin-top: 26px;
}

/* -------------------------------------------------- 3. شريط الثقة (تحت البحث مباشرة) */
/* شريط الثقة — حمل الخلفية الداكنة بدلًا من شريط الإحصائيات المُخفى
   (19 سبتمبر 2026). النسخة البيضاء السابقة محفوظة أسفله: إن أُعيد تفعيل
   ehShowStats في homepage.tpl فأعِد تلك الكتلة، وإلا ظهر شريطان داكنان.

   التدرّج مطابق لـ.eh-stats حرفًا بحرف — تعمّدًا لا صدفةً: هو التدرّج الذي
   يربط الصفحة بهوية الهيدر، ونقله كما هو يُبقي الإيقاع اللوني دون إعادة
   معايرة. */
.eh-trustbar {
  background: linear-gradient(135deg, var(--eh-blue-dark) 0%, #0a3d5c 55%, var(--eh-ink) 100%);
  color: #fff;
  padding: 40px 0;
  position: relative;
  overflow: hidden;
}

/* وهج ناعم يكسر رتابة المساحة الداكنة ويُبرز العمود الأول.
   inset-inline يجعله يتبع اتجاه الصفحة تلقائيًا في RTL وLTR. */
.eh-trustbar::before {
  content: "";
  position: absolute;
  inset-inline-start: -12%;
  top: -60%;
  width: 46%;
  height: 220%;
  background: radial-gradient(closest-side, rgba(0, 136, 204, .30), transparent 72%);
  pointer-events: none;
}

.eh-trustbar .eh-container { position: relative; }

/* النسخة البيضاء السابقة — للرجوع:
.eh-trustbar { background:#fff; border-bottom:1px solid var(--eh-line); padding:18px 0; }
.eh-trustbar__item { color: var(--eh-ink-2); }
.eh-trustbar__icon { background: var(--eh-blue-soft); color: var(--eh-blue-dark); }
.eh-trustbar__item:nth-child(1) .eh-trustbar__icon { background: var(--eh-red-soft); color: var(--eh-red); }
.eh-trustbar__item:nth-child(3) .eh-trustbar__icon { background: var(--eh-green-soft); color: var(--eh-green); }
.eh-trustbar__t { color: var(--eh-ink); }
.eh-trustbar__d { color: var(--eh-muted); }
*/

.eh-trustbar__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.eh-trustbar__item {
  display: flex;
  align-items: center;
  gap: 13px;
  min-height: 44px;
  padding: 12px;
  border-radius: var(--eh-r);
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .82);
  text-decoration: none;
  border: 1px solid rgba(255, 255, 255, .10);
  background: rgba(255, 255, 255, .045);
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.eh-trustbar__item:hover {
  text-decoration: none;
  color: #fff;
  background: rgba(255, 255, 255, .09);
  border-color: rgba(255, 255, 255, .22);
  transform: translateY(-2px);
}

/* الأيقونات: خلفيات شفّافة لا باستيل. الباستيل الفاتح على خلفية داكنة
   يتحوّل إلى بقع بيضاء تسحب الانتباه من النص. */
.eh-trustbar__icon {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(255, 255, 255, .14);
  color: #fff;
  font-size: 18px;
}

/* لمسة لون على الأيقونات فقط — نُسخ فاتحة من ألوان الهوية، لأن الدرجات
   الأصلية (‎#d11e2b‎ و‎#12a150‎) تفقد تباينها على هذه الخلفية. */
.eh-trustbar__item:nth-child(1) .eh-trustbar__icon { color: #ff8a93; background: rgba(209, 30, 43, .22);  border-color: rgba(255, 138, 147, .32); }
.eh-trustbar__item:nth-child(2) .eh-trustbar__icon { color: #7cd2ff; background: rgba(0, 136, 204, .26);  border-color: rgba(124, 210, 255, .32); }
.eh-trustbar__item:nth-child(3) .eh-trustbar__icon { color: #5fe0a0; background: rgba(18, 161, 80, .24);  border-color: rgba(95, 224, 160, .32); }
.eh-trustbar__item:nth-child(4) .eh-trustbar__icon { color: #ffd07a; background: rgba(240, 160, 0, .22);  border-color: rgba(255, 208, 122, .32); }

.eh-trustbar__t { display: block; font-weight: 800; color: #fff; }
/* .78 لا .62: التدرّج يبدأ بـ#005f90، وعنده كان تباين الوصف 3.66 — رسوبٌ
   في AA لنص 12.5 بكسل. والبطاقة الواقعة على ذلك الطرف هي «أول موزّع معتمد
   لنطاقات .eg»، أي أن أهم إشارة ثقة كانت أقلّها وضوحًا.
   القيم مقيسة على نقاط التدرّج الثلاث: .74 تعطي 4.53 بالكاد، و.78 تعطي
   4.88 بهامش. العناوين البيضاء كانت سليمة أصلًا (6.91 فأعلى). */
.eh-trustbar__d { display: block; font-size: 12.5px; color: rgba(255, 255, 255, .78); }

@media (prefers-reduced-motion: reduce) {
  .eh-trustbar__item { transition: none; }
  .eh-trustbar__item:hover { transform: none; }
}

/* -------------------------------------------------- 4. شريط الإحصائيات */
.eh-stats {
  background: linear-gradient(135deg, var(--eh-blue-dark) 0%, #0a3d5c 55%, var(--eh-ink) 100%);
  color: #fff;
  padding: 46px 0;
}

.eh-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  text-align: center;
}

.eh-stat__n {
  display: block;
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 900;
  line-height: 1.1;
  color: #fff;
  /* عزل اتجاهي: بدونه تضع RTL علامة + على يسار الرقم فتُقرأ 17+ كأنها 17- */
  direction: ltr;
  unicode-bidi: isolate;
}

.eh-stat__n small { font-size: .55em; font-weight: 800; }

.eh-stat__l {
  display: block;
  margin-top: 7px;
  font-size: 14px;
  color: rgba(255, 255, 255, .8);
}

/* -------------------------------------------------- 5. الباقات */
.eh-plans__switchnote {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: -22px 0 36px;
  font-size: 14.5px;
  color: var(--eh-muted);
}

.eh-plans__savepill {
  background: var(--eh-green-soft);
  color: var(--eh-green);
  font-weight: 800;
  padding: 5px 14px;
  border-radius: var(--eh-r-pill);
}

.eh-plans__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  align-items: stretch;
}

.eh-plan {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r-lg);
  padding: 32px 26px 28px;
  box-shadow: var(--eh-sh-sm);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.eh-plan:hover {
  transform: translateY(-6px);
  box-shadow: var(--eh-sh-lg);
  border-color: rgba(209, 30, 43, .25);
}

.eh-plan--featured {
  border: 2px solid var(--eh-red);
  box-shadow: var(--eh-sh);
}

.eh-plan__tag {
  position: absolute;
  top: -14px;
  inset-inline-start: 50%;
  transform: translateX(50%);
  background: var(--eh-red);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  padding: 6px 20px;
  border-radius: var(--eh-r-pill);
  white-space: nowrap;
  box-shadow: 0 6px 16px rgba(209, 30, 43, .35);
}

[dir="ltr"] .eh-plan__tag { transform: translateX(-50%); }

.eh-plan__name {
  font-size: 22px;
  font-weight: 800;
  color: var(--eh-ink);
  margin: 6px 0 4px;
}

.eh-plan__for {
  font-size: 14px;
  color: var(--eh-muted);
  min-height: 42px;
  margin: 0 0 20px;
  line-height: 1.7;
}

.eh-plan__price {
  border-top: 1px dashed var(--eh-line);
  border-bottom: 1px dashed var(--eh-line);
  padding: 20px 0;
  margin-bottom: 22px;
}

.eh-plan__permonth {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.eh-plan__amount {
  font-size: 40px;
  font-weight: 900;
  color: var(--eh-red);
  line-height: 1;
  direction: ltr;
  unicode-bidi: isolate;
}

.eh-plan__cycle { font-size: 15px; color: var(--eh-muted); font-weight: 600; }

.eh-plan__yearly {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
  font-size: 14.5px;
  color: var(--eh-ink-2);
}

.eh-plan__old {
  color: #9aabb9;
  text-decoration: line-through;
  font-size: 14px;
}

.eh-plan__save {
  background: var(--eh-green-soft);
  color: var(--eh-green);
  font-size: 12.5px;
  font-weight: 800;
  padding: 4px 11px;
  border-radius: var(--eh-r-pill);
}

/* سطر التجديد أسفل السعر */
.eh-plan__renew {
  margin: 10px 0 0;
  font-size: 12.5px;
  color: var(--eh-muted);
}

/* الباقة التي لا سعر شهري لها */
.eh-plan.is-unavailable .eh-plan__amount { color: var(--eh-line); }
.eh-plan.is-unavailable .eh-plan__price  { opacity: .75; }

.eh-plan__na {
  color: var(--eh-muted);
  font-size: 14px;
  font-weight: 700;
}

.eh-plan__feats {
  list-style: none;
  margin: 0 0 26px;
  padding: 0;
  flex: 1 1 auto;
}

.eh-plan__feats li {
  position: relative;
  padding-inline-start: 28px;
  padding-block: 7px;
  font-size: 15px;
  color: var(--eh-ink-2);
  line-height: 1.7;
}

.eh-plan__feats li::before {
  content: "\f058"; /* fa-check-circle */
  /* الترتيب مقصود: WHMCS يحمّل "Font Awesome 6 Pro" أصلًا (‏346 كيلوبايت،
     يرسم 64 أيقونة على هذه الصفحة). وضعه أولًا يعني أن علامات الصح تُرسم
     من ملف منزَّل سلفًا. الترتيب السابق كان يبدأ بـ"5 Free" فيجرّ ملفًا
     ثانيًا كاملًا (77 كيلوبايت) لأجل محرفين اثنين. والاسم "6 Free" كان
     خطأً مني: نسخة الموقع Pro لا Free، فلم يطابق شيئًا.
     المحرفان 058 و078 متطابقان في FA5 وFA6، والبدائل تبقى احتياطًا
     لو تغيّرت نسخة FontAwesome في WHMCS. */
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Free",
               "Font Awesome 5 Free", sans-serif;
  font-weight: 900;
  position: absolute;
  inset-inline-start: 0;
  top: 9px;
  color: var(--eh-green);
  font-size: 14px;
}

.eh-plan__feats li b { color: var(--eh-ink); font-weight: 800; }

.eh-plan__note {
  margin: 12px 0 0;
  font-size: 12.5px;
  color: var(--eh-muted);
  text-align: center;
}

/* ضمانات أسفل الباقات */
.eh-guarantees {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 36px;
}

.eh-guarantee {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r-pill);
  padding: 11px 20px;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--eh-ink-2);
}

.eh-guarantee i { color: var(--eh-green); }

/* وسائل الدفع */
.eh-pay {
  margin-top: 26px;
  text-align: center;
}

.eh-pay__lbl {
  display: block;
  font-size: 14px;
  font-weight: 800;
  color: var(--eh-ink);
  margin-bottom: 14px;
}

.eh-pay__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

.eh-pay__m {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r-sm);
  padding: 10px 16px;
  font-size: 14px;
  font-weight: 700;
  color: var(--eh-ink-2);
}

.eh-pay__m i { color: var(--eh-blue); font-size: 15px; }

.eh-pay__m--hi {
  background: var(--eh-green-soft);
  border-color: rgba(18, 161, 80, .3);
  color: var(--eh-green);
}

.eh-pay__m--hi i { color: var(--eh-green); }

/* Trustpilot بجوار الأسعار */
.eh-proof__tp { margin: 30px auto 0; max-width: 460px; }

/* -------------------------------------------------- 5ب. مفتاح دورة الفوترة */
.eh-cycle {
  margin: -14px 0 34px;
  text-align: center;
}

.eh-cycle__tabs {
  display: inline-flex;
  gap: 4px;
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r-pill);
  padding: 5px;
  box-shadow: var(--eh-sh-sm);
}

.eh-cycle__tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  color: var(--eh-muted);
  font-family: inherit;
  font-size: 15px;
  font-weight: 800;
  padding: 11px 24px;
  border-radius: var(--eh-r-pill);
  cursor: pointer;
  min-height: 44px;
  transition: background-color .2s ease, color .2s ease;
}

.eh-cycle__tab:hover:not(:disabled):not(.is-on) { color: var(--eh-ink); }

.eh-cycle__tab.is-on {
  background: var(--eh-red);
  color: #fff;
  box-shadow: 0 4px 12px rgba(209, 30, 43, .3);
}

.eh-cycle__tab:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.eh-cycle__tab:focus-visible { outline: 3px solid var(--eh-blue); outline-offset: 2px; }

.eh-cycle__badge {
  background: var(--eh-green-soft);
  color: var(--eh-green);
  font-size: 11.5px;
  font-weight: 800;
  padding: 3px 10px;
  border-radius: var(--eh-r-pill);
}

.eh-cycle__tab.is-on .eh-cycle__badge {
  background: rgba(255, 255, 255, .92);
  color: var(--eh-red);
}

.eh-cycle__note {
  margin: 14px 0 0;
  font-size: 14px;
  color: var(--eh-muted);
  min-height: 20px;
}

/* -------------------------------------------------- 5ج. الحضور العالمي
   تخطيط عمودين مضغوط: الخريطة إلى جانب قائمة المواقع، بدل خريطة عريضة وبطاقات
   كبيرة تحتها. الارتفاع ~1416px ← ~520px على الديسكتوب. */
.eh-globe {
  background: radial-gradient(900px 480px at 62% 45%, #123f66 0%, #0d2740 50%, #081a2c 100%);
  color: #fff;
  overflow: hidden;
}

.eh-globe__grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 40px;
  align-items: center;
}

/* الخريطة */
.eh-globe__map { position: relative; line-height: 0; }

.eh-globe__map img {
  width: 100%;
  height: auto;
  /* النقاط الداكنة تُقلب إلى بيضاء باهتة — لا أصل جديد يُحمَّل */
  filter: brightness(0) invert(1);
  opacity: .22;
}

.eh-globe__arcs {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.eh-globe__arcs path {
  fill: none;
  stroke: #5cc8f5;
  stroke-width: .3;
  stroke-linecap: round;
  opacity: .5;
  stroke-dasharray: 2 3;
  animation: eh-flow 3.2s linear infinite;
}

@keyframes eh-flow { to { stroke-dashoffset: -25; } }

.eh-globe__pin {
  position: absolute;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
}

.eh-globe__pin--dc {
  width: 10px;
  height: 10px;
  background: #5cc8f5;
  box-shadow: 0 0 0 4px rgba(92, 200, 245, .2), 0 0 14px rgba(92, 200, 245, .9);
}

.eh-globe__pin--home {
  width: 13px;
  height: 13px;
  background: #ff5566;
  box-shadow: 0 0 0 5px rgba(255, 85, 102, .2), 0 0 20px rgba(255, 85, 102, .95);
  animation: eh-pulse 2.4s ease-in-out infinite;
}

@keyframes eh-pulse {
  0%, 100% { box-shadow: 0 0 0 5px rgba(255, 85, 102, .2), 0 0 20px rgba(255, 85, 102, .95); }
  50%      { box-shadow: 0 0 0 10px rgba(255, 85, 102, .05), 0 0 28px rgba(255, 85, 102, 1); }
}

.eh-globe__pin--cx {
  width: 5px;
  height: 5px;
  background: rgba(255, 255, 255, .8);
  box-shadow: 0 0 8px rgba(255, 255, 255, .5);
}

/* العمود النصّي */
.eh-globe__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(92, 200, 245, .14);
  border: 1px solid rgba(92, 200, 245, .35);
  color: #7fd4f7;
  font-size: 12.5px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: var(--eh-r-pill);
  margin-bottom: 12px;
}

.eh-globe__h2 {
  font-size: clamp(22px, 2.6vw, 29px);
  font-weight: 800;
  line-height: 1.4;
  color: #fff;
  margin: 0 0 10px;
}

.eh-globe__lead {
  font-size: 15px;
  line-height: 1.8;
  color: rgba(255, 255, 255, .75);
  margin: 0 0 20px;
}

/* قائمة المواقع */
.eh-globe__list {
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.eh-globe__list li {
  position: relative;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: var(--eh-r-sm);
  padding: 11px 14px 11px 14px;
  padding-inline-start: 30px;
  font-size: 13.5px;
  line-height: 1.5;
}

.eh-globe__list li::before {
  content: "";
  position: absolute;
  inset-inline-start: 13px;
  top: 16px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #5cc8f5;
  box-shadow: 0 0 8px rgba(92, 200, 245, .8);
}

.eh-globe__list li.is-home {
  background: rgba(255, 85, 102, .11);
  border-color: rgba(255, 85, 102, .3);
}

.eh-globe__list li.is-home::before {
  background: #ff5566;
  box-shadow: 0 0 8px rgba(255, 85, 102, .85);
}

.eh-globe__list b    { display: block; font-size: 14.5px; font-weight: 800; color: #fff; }
.eh-globe__list span { color: rgba(255, 255, 255, .66); }

/* مفتاح الرموز */
.eh-globe__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
  margin-bottom: 14px;
  font-size: 12.5px;
  color: rgba(255, 255, 255, .72);
}

.eh-globe__legend span { display: inline-flex; align-items: center; gap: 8px; }

.eh-globe__key { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.eh-globe__key--dc { background: #5cc8f5; box-shadow: 0 0 8px rgba(92, 200, 245, .8); }
.eh-globe__key--cx { background: rgba(255, 255, 255, .8); }

/* سطر الشركاء */
.eh-globe__partners {
  margin: 0;
  padding: 13px 16px;
  background: rgba(92, 200, 245, .09);
  border: 1px solid rgba(92, 200, 245, .28);
  border-radius: var(--eh-r-sm);
  font-size: 13.5px;
  line-height: 1.75;
  color: rgba(255, 255, 255, .8);
}

.eh-globe__partners i { color: #7fd4f7; margin-inline-end: 6px; }
.eh-globe__partners a { color: #7fd4f7; font-weight: 700; }

/* -------------------------------------------------- 6. شبكة الخدمات */
.eh-services__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.eh-service {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r);
  padding: 26px 22px;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.eh-service:hover,
.eh-service:focus {
  text-decoration: none;
  transform: translateY(-5px);
  box-shadow: var(--eh-sh);
  border-color: rgba(0, 136, 204, .35);
}

.eh-service__icon {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: var(--eh-blue-soft);
  color: var(--eh-blue-dark);
  font-size: 21px;
  margin-bottom: 16px;
}

.eh-service--hot .eh-service__icon { background: var(--eh-red-soft); color: var(--eh-red); }

.eh-service__t {
  font-size: 17px;
  font-weight: 800;
  color: var(--eh-ink);
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.eh-service__badge {
  background: var(--eh-red);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  padding: 3px 9px;
  border-radius: var(--eh-r-pill);
}

.eh-service__d {
  font-size: 14px;
  line-height: 1.75;
  color: var(--eh-muted);
  margin: 0 0 14px;
  flex: 1 1 auto;
}

.eh-service__more {
  font-size: 14px;
  font-weight: 800;
  color: var(--eh-blue-dark);
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.eh-service__more i { transition: transform .2s ease; font-size: 12px; }
.eh-service:hover .eh-service__more i { transform: translateX(-4px); }
[dir="ltr"] .eh-service:hover .eh-service__more i { transform: translateX(4px); }

/* -------------------------------------------------- 7. سيكشن اعتماد .eg */
.eh-eg {
  background: linear-gradient(135deg, #0f2438 0%, #123754 60%, #0b2e47 100%);
  color: #fff;
  overflow: hidden;
  position: relative;
}

.eh-eg::after {
  content: "";
  position: absolute;
  inset-inline-end: -120px;
  top: -120px;
  width: 420px;
  height: 420px;
  background: radial-gradient(circle, rgba(0, 136, 204, .3) 0%, transparent 70%);
  pointer-events: none;
}

.eh-eg__wrap {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 48px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.eh-eg__badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .22);
  color: #fff;
  font-size: 13.5px;
  font-weight: 700;
  padding: 8px 18px;
  border-radius: var(--eh-r-pill);
  margin-bottom: 18px;
}

.eh-eg__badge i { color: var(--eh-amber); }

.eh-eg h2 {
  font-size: clamp(27px, 3.6vw, 40px);
  font-weight: 900;
  line-height: 1.35;
  margin: 0 0 16px;
  color: #fff;
}

.eh-eg h2 span { color: #5cc8f5; }

.eh-eg p {
  font-size: 16.5px;
  line-height: 1.95;
  color: rgba(255, 255, 255, .8);
  margin: 0 0 22px;
}

.eh-eg__tlds {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.eh-tld {
  background: rgba(255, 255, 255, .07);
  border: 1px solid rgba(255, 255, 255, .15);
  border-radius: var(--eh-r);
  padding: 18px 16px;
  text-align: center;
  transition: background-color .2s ease, transform .2s ease;
}

.eh-tld:hover { background: rgba(255, 255, 255, .13); transform: translateY(-3px); }

.eh-tld__n {
  display: block;
  font-size: 24px;
  font-weight: 900;
  color: #fff;
  direction: ltr;
}

.eh-tld__p {
  display: block;
  margin-top: 6px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, .7);
}

/* -------------------------------------------------- 8. لماذا استضافة مصر */
.eh-why__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.eh-why__card {
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r);
  padding: 30px 26px;
  transition: transform .2s ease, box-shadow .2s ease;
}

.eh-why__card:hover { transform: translateY(-5px); box-shadow: var(--eh-sh); }

.eh-why__icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  font-size: 22px;
  margin-bottom: 18px;
  background: var(--eh-red-soft);
  color: var(--eh-red);
}

.eh-why__card:nth-child(2n) .eh-why__icon { background: var(--eh-blue-soft); color: var(--eh-blue-dark); }
.eh-why__card:nth-child(3n) .eh-why__icon { background: var(--eh-green-soft); color: var(--eh-green); }

.eh-why__t {
  font-size: 18.5px;
  font-weight: 800;
  color: var(--eh-ink);
  margin: 0 0 10px;
}

.eh-why__d {
  font-size: 15px;
  line-height: 1.9;
  color: var(--eh-muted);
  margin: 0;
}

/* -------------------------------------------------- 9. البنية التحتية */
.eh-infra__wrap {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 48px;
  align-items: center;
}

.eh-locs { display: grid; gap: 14px; }

.eh-loc {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r);
  padding: 18px 20px;
}

.eh-loc__flag {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--eh-blue-soft);
  color: var(--eh-blue-dark);
  font-size: 18px;
}

.eh-loc__t { font-size: 16px; font-weight: 800; color: var(--eh-ink); margin: 0 0 4px; }
.eh-loc__d { font-size: 14px; color: var(--eh-muted); margin: 0; }

.eh-infra__map { text-align: center; }

.eh-infra__map img {
  max-width: 100%;
  height: auto;
  opacity: .92;
}

/* شريط التقنيات */
.eh-tech {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 40px;
}

.eh-tech span {
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r-pill);
  padding: 9px 18px;
  font-size: 14px;
  font-weight: 700;
  color: var(--eh-ink-2);
  direction: ltr;
}

/* -------------------------------------------------- 10. شريط النقل المجاني */
.eh-migrate {
  background: linear-gradient(120deg, var(--eh-blue) 0%, var(--eh-blue-dark) 100%);
  color: #fff;
  border-radius: var(--eh-r-lg);
  padding: 44px 46px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 30px;
  align-items: center;
}

.eh-migrate h2 {
  font-size: clamp(23px, 3vw, 31px);
  font-weight: 900;
  margin: 0 0 10px;
  color: #fff;
}

.eh-migrate p {
  margin: 0;
  font-size: 16px;
  line-height: 1.85;
  color: rgba(255, 255, 255, .85);
}

/* -------------------------------------------------- 11. الدليل الاجتماعي */
.eh-proof__logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 18px 38px;
  margin-top: 8px;
}

/* شعارات ملوّنة لا رمادية، بقرار المستخدم (20 سبتمبر 2026).

   السبب: الفلتر الرمادي كان يناسب ستة شعارات كلها كلمات بخط واحد. لكن
   لوحة الشركاء الجديدة فيها شعاران يعتمدان على اللون والتفصيل:
   ختم المجلس الأعلى للجامعات (دائرة بكتابة عربية دقيقة) ووردة Huawei
   المتدرّجة. عند 40 بكسل ورمادي يتحوّلان إلى بقعة — وهما أهم شعارين في
   اللوحة: الأول يسند اعتماد نطاقات .eg والثاني اسم عالمي.

   ولذلك رُفع الارتفاع 40 ← 48: التفاصيل الدقيقة تحتاج البكسلات، ولا
   معنى لإعادة اللون ثم خنقه في مساحة صغيرة. */
.eh-proof__logos img {
  height: 48px;
  width: auto;
  max-width: 210px;      /* يمنع شعارًا عريضًا من ابتلاع الصف.
                            210 لا 190: عند 190 يُقصّ LiteSpeed (250×60) و
                            EDB (600×150) فيهبط ارتفاعهما الفعلي دون 48. */
  object-fit: contain;
  transition: transform .25s ease;
}

.eh-proof__logos img:hover { transform: scale(1.06); }

/* شعار دائري أو مربّع: أطول من شعارات الكلمات لتتعادل الكتلة البصرية.
   القاعدة العملية ‎1.33×‎ — قرص 64 يوازي بصريًا كلمة عرضها ~190 وارتفاعها 48. */
.eh-proof__logos img.is-mark { height: 64px; max-width: 64px; }

@media (prefers-reduced-motion: reduce) {
  .eh-proof__logos img { transition: none; }
  .eh-proof__logos img:hover { transform: none; }
}

.eh-proof__clients {
  display: block;
  margin: 34px auto 0;
  max-width: 1000px;
  width: 100%;
  height: auto;
  border-radius: var(--eh-r-lg);
}

.eh-proof__tp {
  margin: 30px auto 0;
  max-width: 420px;
}

/* -------------------------------------------------- 12. الأسئلة الشائعة */
.eh-faq {
  max-width: 880px;
  margin: 0 auto;
  display: grid;
  gap: 12px;
}

.eh-faq details {
  background: #fff;
  border: 1px solid var(--eh-line);
  border-radius: var(--eh-r);
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.eh-faq details[open] { border-color: rgba(0, 136, 204, .4); box-shadow: var(--eh-sh-sm); }

.eh-faq summary {
  list-style: none;
  cursor: pointer;
  padding: 20px 24px;
  font-size: 16.5px;
  font-weight: 800;
  color: var(--eh-ink);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.eh-faq summary::-webkit-details-marker { display: none; }

.eh-faq summary::after {
  content: "\f078"; /* fa-chevron-down */
  /* الترتيب مقصود: WHMCS يحمّل "Font Awesome 6 Pro" أصلًا (‏346 كيلوبايت،
     يرسم 64 أيقونة على هذه الصفحة). وضعه أولًا يعني أن علامات الصح تُرسم
     من ملف منزَّل سلفًا. الترتيب السابق كان يبدأ بـ"5 Free" فيجرّ ملفًا
     ثانيًا كاملًا (77 كيلوبايت) لأجل محرفين اثنين. والاسم "6 Free" كان
     خطأً مني: نسخة الموقع Pro لا Free، فلم يطابق شيئًا.
     المحرفان 058 و078 متطابقان في FA5 وFA6، والبدائل تبقى احتياطًا
     لو تغيّرت نسخة FontAwesome في WHMCS. */
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Free",
               "Font Awesome 5 Free", sans-serif;
  font-weight: 900;
  font-size: 13px;
  color: var(--eh-blue);
  flex: 0 0 auto;
  transition: transform .2s ease;
}

.eh-faq details[open] summary::after { transform: rotate(180deg); }

.eh-faq__a {
  padding: 0 24px 22px;
  font-size: 15.5px;
  line-height: 1.95;
  color: var(--eh-muted);
  margin: 0;
}

.eh-faq__a p { margin: 0 0 12px; }
.eh-faq__a p:last-child { margin-bottom: 0; }
.eh-faq__a b { color: var(--eh-ink-2); font-weight: 700; }

/* الروابط داخل الإجابات: هدف لمس مريح على الموبايل */
.eh-faq__a a {
  color: var(--eh-blue-dark);
  font-weight: 700;
  display: inline-block;
  padding: 4px 0;
  min-height: 24px;
}

/* -------------------------------------------------- 13. الـ CTA النهائي */
.eh-final {
  background: linear-gradient(135deg, var(--eh-red) 0%, #8f1119 100%);
  color: #fff;
  text-align: center;
  padding: 72px 0;
}

.eh-final h2 {
  font-size: clamp(27px, 3.6vw, 40px);
  font-weight: 900;
  margin: 0 0 14px;
  color: #fff;
}

.eh-final p {
  font-size: 17px;
  line-height: 1.85;
  color: rgba(255, 255, 255, .88);
  max-width: 640px;
  margin: 0 auto;
}

.eh-final__ways {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px 34px;
  margin-top: 30px;
  font-size: 15px;
}

.eh-final__ways a {
  color: #fff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-weight: 700;
  direction: ltr;
  min-height: 44px;          /* هدف لمس مطابق لإرشادات الموبايل */
  padding: 0 14px;
  border-radius: var(--eh-r-sm);
}

.eh-final__ways a:hover { background: rgba(255, 255, 255, .14); }

.eh-final__ways a:hover { text-decoration: underline; color: #fff; }

/* -------------------------------------------------- 14. الأخبار */
.eh-news {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
}

.eh-news__item {
  background: #fff;
  border: 1px solid var(--eh-line);
  border-inline-start: 4px solid var(--eh-red);
  border-radius: var(--eh-r);
  padding: 24px 26px;
}

.eh-news__date {
  font-size: 12.5px;
  font-weight: 800;
  color: var(--eh-red);
  background: var(--eh-red-soft);
  padding: 4px 12px;
  border-radius: var(--eh-r-pill);
  display: inline-block;
  margin-bottom: 12px;
}

.eh-news__t {
  font-size: 17.5px;
  font-weight: 800;
  line-height: 1.6;
  margin: 0 0 10px;
}

.eh-news__t a { color: var(--eh-ink); text-decoration: none; }
.eh-news__t a:hover { color: var(--eh-red); text-decoration: none; }

.eh-news__x {
  font-size: 14.5px;
  line-height: 1.85;
  color: var(--eh-muted);
  margin: 0;
}

/* -------------------------------------------------- 15. أدوات مساعدة */
.eh-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.eh-center { text-align: center; }

/* -------------------------------------------------- 16. الاستجابة للشاشات */
@media (max-width: 1100px) {
  .eh-services__grid { grid-template-columns: repeat(3, 1fr); }
  .eh-why__grid      { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 991px) {
  .eh-section { padding: 52px 0; }
  .eh-trustbar__grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .eh-stats__grid    { grid-template-columns: repeat(4, 1fr); gap: 14px; }
  .eh-plans__grid    { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; }
  .eh-plan--featured { order: -1; }
  .eh-eg__wrap,
  .eh-infra__wrap    { grid-template-columns: 1fr; gap: 34px; }
  .eh-migrate        { grid-template-columns: 1fr; text-align: center; padding: 36px 26px; }
  .eh-migrate .eh-btn { width: 100%; }
}

/* --------------------------------------------------------------------------
   الموبايل — الشريطان العلويان مضغوطان
   ---------------------------------------------------------------------------
   على 375×812 كان شريط الثقة يأخذ 298 بكسل وشريط الإحصائيات 234 بكسل، أي
   532 بكسل قبل أول باقة. النسخة أدناه تضغطهما إلى ما يقارب 150 بكسل معًا:
   شريط الثقة يصبح شريطًا أفقيًا قابلًا للسحب بإصبع واحد، والإحصائيات أربعة
   أعمدة مضغوطة. المحتوى كما هو — المساحة فقط هي ما تغيّر.
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  /* شريط الثقة: سحب أفقي بدل أربعة صفوف.
     الحشو أكبر من السابق (12px) لأن الشريط صار قسمًا بخلفية داكنة لا
     خطًّا فاصلًا رفيعًا — الحشو القديم يجعل التدرّج يبدو كخطأ عرض. */
  .eh-trustbar { padding: 26px 0; }

  .eh-trustbar .eh-container { padding: 0; }

  .eh-trustbar__grid {
    display: flex;
    grid-template-columns: none;
    gap: 10px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0 16px;
  }

  .eh-trustbar__grid::-webkit-scrollbar { display: none; }

  .eh-trustbar__item {
    flex: 0 0 auto;
    scroll-snap-align: start;
    max-width: 260px;
    gap: 10px;
    /* شفّاف لا var(--eh-bg): ذاك رمادي فاتح مصمَّم لخلفية بيضاء،
       وعلى التدرّج الداكن يصير مستطيلًا باهتًا يقطع الخلفية. */
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: var(--eh-r-sm);
    padding: 10px 13px;
    min-height: 48px;
  }

  .eh-trustbar__item:hover { transform: none; }   /* لا تحويم على اللمس */

  .eh-trustbar__icon { width: 30px; height: 30px; font-size: 13px; border-radius: 9px; }
  .eh-trustbar__t    { font-size: 13px; line-height: 1.45; }
  .eh-trustbar__d    { display: none; }   /* العنوان وحده كافٍ في هذه المساحة */

  /* الإحصائيات: أربعة أعمدة مضغوطة */
  .eh-stats { padding: 18px 0; }
  .eh-stats__grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .eh-stat__n { font-size: 21px; }
  .eh-stat__n small { font-size: .6em; }
  .eh-stat__l { font-size: 10.5px; margin-top: 4px; line-height: 1.4; }
}

@media (max-width: 991px) {
  .eh-globe__grid { grid-template-columns: 1fr; gap: 26px; }
  .eh-globe__map  { max-width: 560px; margin: 0 auto; }
}

@media (max-width: 767px) {
  .eh-section { padding: 44px 0; }
  .eh-head    { margin-bottom: 32px; }

  /* مفتاح دورة الفوترة */
  .eh-cycle        { margin: -8px 0 26px; }
  .eh-cycle__tabs  { width: 100%; }
  .eh-cycle__tab   { flex: 1 1 0; justify-content: center; padding: 11px 12px; font-size: 14px; }
  .eh-cycle__badge { font-size: 10.5px; padding: 3px 8px; }

  /* الحضور العالمي على الموبايل */
  .eh-globe__pin--dc   { width: 8px; height: 8px; }
  .eh-globe__pin--home { width: 11px; height: 11px; }
  .eh-globe__pin--cx   { width: 4px; height: 4px; }
  .eh-globe__list      { grid-template-columns: 1fr; gap: 8px; }
  .eh-globe__list li   { padding-block: 9px; font-size: 13px; }
  .eh-globe__legend    { font-size: 12px; gap: 6px 16px; }
  .eh-globe__partners  { font-size: 13px; padding: 12px 14px; }
  .eh-pay__m  { font-size: 13px; padding: 9px 13px; }
  .eh-plans__switchnote { flex-direction: column; gap: 8px; margin: -14px 0 28px; }
  .eh-services__grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .eh-why__grid      { grid-template-columns: 1fr; }
  .eh-service        { padding: 20px 16px; }
  .eh-service__d     { font-size: 13.5px; }
  .eh-proof__logos   { gap: 14px 24px; }

  /* 36 لا 30: القيمة القديمة كُتبت حين كان ارتفاع الديسكتوب 40 وكانت
     الشعارات كلمات بسيطة. صارت 48 ومعها شعارات ذات تفاصيل (وردة Huawei،
     ختم المجلس)، و30 تمحوها.

     و.is-mark تُقلَّص معها: بدونها يبقى الختم 64 بينما الباقي 30 — أي أكثر
     من الضعف، فينقلب المقصود ويصير الختم هو المهيمن بدل أن يكون متوازنًا.
     النسبة محفوظة: 48/64 على الديسكتوب ← 36/48 هنا. */
  .eh-proof__logos img { height: 36px; }
  .eh-proof__logos img.is-mark { height: 48px; max-width: 48px; }
  .eh-faq summary    { font-size: 15.5px; padding: 17px 18px; }
  .eh-faq__a         { padding: 0 18px 18px; font-size: 14.5px; }
  .eh-final__ways    { flex-direction: column; align-items: center; gap: 12px; }
  .eh-cta-row .eh-btn { width: 100%; }
}

@media (max-width: 480px) {
  /* شريط الثقة يبقى سحبًا أفقيًا — لا يتحول إلى عمود واحد */
  .eh-services__grid { grid-template-columns: 1fr; }
  .eh-eg__tlds       { grid-template-columns: 1fr; }
  .eh-plan           { padding: 28px 20px 24px; }
  .eh-plan__amount   { font-size: 34px; }
}

/* تقليل الحركة لمن يفضّلها */
@media (prefers-reduced-motion: reduce) {
  .eh-btn, .eh-plan, .eh-service, .eh-why__card, .eh-tld,
  .eh-service__more i, .eh-faq summary::after, .eh-cycle__tab {
    transition: none !important;
  }
  .eh-globe__arcs path, .eh-globe__pin--home { animation: none !important; }
  .eh-btn:hover, .eh-plan:hover, .eh-service:hover,
  .eh-why__card:hover, .eh-tld:hover { transform: none !important; }
}