@charset "UTF-8";
/* ═══════════════════════════════════════════════════════════════
   EchoVision — نظام التصميم
   المصدر الوحيد للحقيقة. كل لون وكل مقاس يبدأ من هنا.

   ٠١ الرموز (tokens)          ٠٦ الأزرار
   ٠٢ إعادة الضبط              ٠٧ المكوّنات
   ٠٣ السكّة والشبكات          ٠٨ الهيدر والفوتر
   ٠٤ الطباعة                  ٠٩ الأرشيفات
   ٠٥ الحركة                   ١٠ الوضع الفاتح
                               ١١ العربية RTL
                               ١٢ إمكانية الوصول
   ═══════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────
   ٠١ · الرموز
   ─────────────────────────────────────────────── */
:root{
  /* الألوان — الوضع الداكن هو الافتراضي */
  --ev-surface:   #050A12;
  --ev-alt:       #071019;
  --ev-card:      #0A1018;
  --ev-line:      rgba(148,169,194,.16);
  --ev-ink:       #FFFFFF;
  --ev-body:      #94A9C2;
  --ev-muted:     #6B819B;
  --ev-accent:    #47C4F2;
  --ev-deep:      #1369AB;
  --ev-glow:      rgba(71,196,242,.30);
  /* النص فوق اللون المميّز: داكن على السماوي، أبيض على الأزرق الغامق */
  --ev-on-accent: #03101E;

  /* يربط النظام بألوان Elementor العامة حين تتوفر */
  --ev-c-ink:     var(--e-global-color-primary,   var(--ev-ink));
  --ev-c-body:    var(--e-global-color-secondary, var(--ev-body));
  --ev-c-accent:  var(--e-global-color-text,      var(--ev-accent));
  --ev-c-deep:    var(--e-global-color-accent,    var(--ev-deep));

  /* الارتفاع — الداكن يضيء، الفاتح يرفع */
  --ev-lift-1: 0 0 0 1px var(--ev-line);
  --ev-lift-2: 0 0 0 1px var(--ev-line), 0 18px 40px rgba(2,8,15,.45);
  --ev-lift-3: 0 0 0 1px rgba(71,196,242,.45), 0 24px 56px rgba(2,8,15,.60);

  /* القياس */
  --ev-rail:    1240px;
  --ev-narrow:   760px;
  --ev-gutter:  clamp(20px, 4.5vw, 56px);
  --ev-gap:     clamp(16px, 2vw, 24px);
  --ev-radius:  18px;
  --ev-radius-sm: 12px;
  --ev-radius-pill: 100px;

  /* الإيقاع الرأسي */
  --ev-section: clamp(64px, 9vw, 128px);

  /* الخطوط */
  --ev-font-display: "Marcellus", "IBM Plex Sans Arabic", Georgia, serif;
  --ev-font-body:    "Outfit", "IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ev-font-mono:    ui-monospace, "SF Mono", Menlo, monospace;

  /* الحركة */
  --ev-ease:  cubic-bezier(.22, 1, .36, 1);
  --ev-fast:  .2s;
  --ev-base:  .35s;
  --ev-slow:  .85s;
}

/* العربية: عائلة واحدة تحمل العنوان والجسم معاً */
:root:lang(ar),
[dir="rtl"]:root,
html[lang^="ar"]{
  --ev-font-display: "IBM Plex Sans Arabic", "Tajawal", system-ui, sans-serif;
  --ev-font-body:    "IBM Plex Sans Arabic", "Tajawal", system-ui, sans-serif;
}

/* ───────────────────────────────────────────────
   ٠٢ · إعادة الضبط
   ─────────────────────────────────────────────── */
*, *::before, *::after{ box-sizing: border-box; }

html{
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  /* clip وليس hidden — hidden يقتل position:sticky */
  overflow-x: clip;
}

body{
  margin: 0;
  overflow-x: clip;
  background: var(--ev-surface);
  color: var(--ev-c-body);
  font-family: var(--ev-font-body);
  font-size: 1rem;
  line-height: 1.65;
  font-synthesis-weight: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg, video, canvas, iframe{ max-width: 100%; }
img, video{ height: auto; display: block; }

/* أيقونات سطرية لا تتمدد لملء الحاوية */
p > svg, a > svg, button > svg, li > svg{
  width: 1.05em; height: 1.05em;
  flex: 0 0 auto;
  vertical-align: -.15em;
}

a{ color: var(--ev-c-accent); text-decoration-thickness: 1px; text-underline-offset: .22em; }
a:hover{ color: var(--ev-c-ink); }

button, input, select, textarea{ font: inherit; color: inherit; }

/* ───────────────────────────────────────────────
   ٠٣ · السكّة والشبكات
   ─────────────────────────────────────────────── */
.ev-rail{
  width: 100%;
  max-width: var(--ev-rail);
  margin-inline: auto;
  padding-inline: var(--ev-gutter);
}
.ev-rail--narrow{ max-width: var(--ev-narrow); }

.ev-section{ padding-block: var(--ev-section); }
.ev-section--alt{ background: var(--ev-alt); }

/* شبكات ثابتة: الفجوة محسوبة تلقائياً فلا يحدث التفاف غير مقصود */
.ev-grid{ display: grid; gap: var(--ev-gap); align-items: stretch; }
.ev-grid--2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
.ev-grid--3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
.ev-grid--4{ grid-template-columns: repeat(4, minmax(0,1fr)); }

@media (max-width: 1024px){
  .ev-grid--3, .ev-grid--4{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 680px){
  .ev-grid--2, .ev-grid--3, .ev-grid--4{ grid-template-columns: 1fr; }
}

.ev-stack > * + *{ margin-block-start: var(--ev-gap); }

/* ───────────────────────────────────────────────
   ٠٤ · الطباعة
   ─────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6, .ev-h1, .ev-h2, .ev-h3{
  margin: 0 0 .5em;
  font-family: var(--ev-font-display);
  font-weight: 400;
  line-height: 1.14;
  letter-spacing: -.015em;
  color: var(--ev-c-ink);
  text-wrap: balance;
}
h1, .ev-h1{ font-size: clamp(2.3rem, 5.4vw, 4rem); }
h2, .ev-h2{ font-size: clamp(1.9rem, 3.8vw, 2.9rem); }
h3, .ev-h3{ font-size: clamp(1.3rem, 2.2vw, 1.6rem); }
h4{ font-size: 1.15rem; }

/* العربية لا تملك حالة أحرف — نرفع الوزن بدل ذلك */
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3,
html[lang^="ar"] h1, html[lang^="ar"] h2, html[lang^="ar"] h3{
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.3;
}

p{ margin: 0 0 1.1em; max-width: 68ch; }
.ev-lead{ font-size: clamp(1.05rem, 1.6vw, 1.22rem); color: var(--ev-c-body); }

/* الكلمة المميّزة داخل العنوان
   ───────────────────────────────
   هذه القاعدة كانت على `h1 em, h2 em` — أي على كل عنوان في كل
   صفحة Elementor بالموقع. والتقنية نفسها خطرة: ملء النص شفاف
   والتدرّج هو ما يُظهره، فإن سقط التدرّج لأي سبب اختفى النص
   كلياً بدل أن يعود إلى لون عادي.

   العلاج طبقتان:
   ١ · النطاق: أصناف القالب فقط، لا وسوم عامة تتسلّل إلى محتوى
       كتبه المحرّر في Elementor.
   ٢ · الفشل الآمن: اللون مضبوط أولاً، والشفافية داخل @supports.
       أسوأ حالة الآن = نص بلون واحد، لا نص غائب. */
.ev-h1 em,
.ev-h2 em,
.ev-accent-text,
.elementor-widget-heading .ev-accent-text{
  font-style: normal;
  color: var(--ev-c-accent);
}

/* لا تدرّج هنا. الاختبار أثبت أن @supports لا يحمي: فهو ينجح في
   كروم، فيبقى الملء شفافاً ويختفي النص متى سقطت صورة الخلفية.
   التدرّج زينة، واختفاء النص عطل — فالمقايضة محسومة. */

/* العين الصغيرة فوق العنوان */
.ev-eyebrow{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  font-family: var(--ev-font-body);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ev-c-accent);
}
.ev-eyebrow::before{
  content: "";
  width: 34px; height: 1px;
  background: currentColor;
  flex: 0 0 34px;
}
[dir="rtl"] .ev-eyebrow,
html[lang^="ar"] .ev-eyebrow{ letter-spacing: 0; text-transform: none; }

/* ───────────────────────────────────────────────
   ٠٥ · الحركة
   ─────────────────────────────────────────────── */
[data-rv]{
  opacity: 0;
  will-change: transform, opacity;
  transition: opacity var(--ev-slow) var(--ev-ease),
              transform var(--ev-slow) var(--ev-ease);
}
[data-rv="up"]    { transform: translate3d(0, 40px, 0); }
[data-rv="down"]  { transform: translate3d(0, -30px, 0); }
[data-rv="left"]  { transform: translate3d(-44px, 0, 0); }
[data-rv="right"] { transform: translate3d(44px, 0, 0); }
[data-rv="fade"]  { transform: none; }
[data-rv="scale"] { transform: scale(.94); }

[data-rv].is-in{ opacity: 1; transform: none; will-change: auto; }

[data-rv-d="1"]{ transition-delay: .08s; }
[data-rv-d="2"]{ transition-delay: .16s; }
[data-rv-d="3"]{ transition-delay: .24s; }
[data-rv-d="4"]{ transition-delay: .32s; }
[data-rv-d="5"]{ transition-delay: .40s; }
[data-rv-d="6"]{ transition-delay: .48s; }

/* في RTL تنعكس الجهة */
[dir="rtl"] [data-rv="left"] { transform: translate3d(44px, 0, 0); }
[dir="rtl"] [data-rv="right"]{ transform: translate3d(-44px, 0, 0); }

/* ───────────────────────────────────────────────
   ٠٦ · الأزرار
   ─────────────────────────────────────────────── */
.ev-btn{
  --_bg: var(--ev-c-accent);
  --_fg: var(--ev-on-accent);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  /* ٤٨px ارتفاع أدنى — هدف لمس مريح */
  min-height: 48px;
  padding: 13px 28px;
  border: 1px solid transparent;
  border-radius: var(--ev-radius-pill);
  background: var(--_bg);
  color: var(--_fg);
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  overflow: hidden;
  transition: transform var(--ev-fast) var(--ev-ease),
              box-shadow var(--ev-base) var(--ev-ease),
              background-color var(--ev-base);
}
.ev-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 30px var(--ev-glow);
  color: var(--_fg);
}
.ev-btn:active{ transform: translateY(0); }

/* لمعة تمر مرة واحدة عند المرور */
.ev-btn::before{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  transform: translateX(-120%);
  transition: transform .7s var(--ev-ease);
}
.ev-btn:hover::before{ transform: translateX(120%); }
[dir="rtl"] .ev-btn::before{ transform: translateX(120%); }
[dir="rtl"] .ev-btn:hover::before{ transform: translateX(-120%); }

/* الثانوي: مفرغ — يوضّح أن هناك مساراً واحداً أساسياً */
.ev-btn--ghost{
  --_bg: transparent;
  --_fg: var(--ev-c-ink);
  border-color: var(--ev-line);
}
.ev-btn--ghost:hover{
  border-color: var(--ev-c-accent);
  background: rgba(71,196,242,.08);
}

.ev-btn--sm{ min-height: 40px; padding: 9px 18px; font-size: .875rem; }

/* رابط بسهم */
.ev-more{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: .9rem;
  color: var(--ev-c-accent);
  text-decoration: none;
}
.ev-more svg{
  width: 17px; height: 17px;
  flex: 0 0 17px;
  transition: transform var(--ev-base) var(--ev-ease);
}
.ev-more:hover svg{ transform: translateX(5px); }
[dir="rtl"] .ev-more svg{ transform: scaleX(-1); }
[dir="rtl"] .ev-more:hover svg{ transform: scaleX(-1) translateX(5px); }

/* ───────────────────────────────────────────────
   ٠٧ · المكوّنات
   ─────────────────────────────────────────────── */
.ev-card{
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: clamp(22px, 2.6vw, 32px);
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius);
  background: var(--ev-card);
  overflow: hidden;
  transition: transform var(--ev-base) var(--ev-ease),
              border-color var(--ev-base),
              box-shadow var(--ev-base);
}
.ev-card:hover,
.ev-card:focus-within{
  transform: translateY(-6px);
  border-color: rgba(71,196,242,.45);
  box-shadow: var(--ev-lift-3);
}
.ev-card__title{ margin-block-end: .4em; font-size: 1.22rem; }
.ev-card__text{ margin: 0; color: var(--ev-c-body); font-size: .95rem; }
.ev-card__foot{ margin-block-start: auto; padding-block-start: 20px; }

/* رقم شبح خلف البطاقة */
.ev-card[data-ghost]::after{
  content: attr(data-ghost);
  position: absolute;
  inset-block-start: -.18em;
  inset-inline-end: .08em;
  font-family: var(--ev-font-display);
  font-size: 7rem;
  line-height: 1;
  color: var(--ev-c-ink);
  opacity: .04;
  pointer-events: none;
}

/* الأيقونة المؤطّرة */
.ev-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px; height: 46px;
  margin-block-end: 18px;
  border-radius: var(--ev-radius-sm);
  background: rgba(71,196,242,.10);
  color: var(--ev-c-accent);
  transition: background-color var(--ev-base), color var(--ev-base);
}
.ev-icon svg{ width: 20px; height: 20px; }
.ev-card:hover .ev-icon{ background: var(--ev-c-accent); color: var(--ev-on-accent); }

/* الإحصائيات */
.ev-stat b{
  display: block;
  font-family: var(--ev-font-display);
  font-size: clamp(2.2rem, 5vw, 3.4rem);
  font-variant-numeric: tabular-nums;
  line-height: 1;
  color: var(--ev-c-accent);
  letter-spacing: -.02em;
}

/* الرقم بلون صلب للسبب نفسه: رقم غائب أسوأ من رقم بلا تدرّج. */
.ev-stat span{
  display: block;
  margin-block-start: 10px;
  font-size: .8rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ev-c-body);
}
[dir="rtl"] .ev-stat span{ letter-spacing: 0; text-transform: none; }

/* شريط اللوغوهات */
.ev-marquee{
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
}
.ev-marquee__row{
  display: flex;
  width: max-content;
  animation: ev-slide var(--ev-marquee-dur, 52s) linear infinite;
}
.ev-marquee:hover .ev-marquee__row{ animation-play-state: paused; }
.ev-marquee__row img{
  height: 44px; width: auto;
  margin-inline: 34px;
  object-fit: contain;
  opacity: .55;
  filter: grayscale(1) brightness(1.7);
  transition: opacity var(--ev-base), filter var(--ev-base);
}
.ev-marquee__row img:hover{ opacity: 1; filter: none; }
@keyframes ev-slide{ to{ transform: translate3d(-50%, 0, 0); } }
[dir="rtl"] .ev-marquee__row{ animation-direction: reverse; }

/* قطاعات الخبرة — بديل القسم المزدحم */
.ev-industries{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  padding: 0; margin: 0;
  list-style: none;
}
.ev-industries li{
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 18px;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius-pill);
  background: var(--ev-card);
  color: var(--ev-c-ink);
  font-size: .92rem;
  transition: border-color var(--ev-base), background-color var(--ev-base);
}
.ev-industries li::before{
  content: "";
  width: 6px; height: 6px;
  flex: 0 0 6px;
  border-radius: 50%;
  background: var(--ev-c-accent);
}
.ev-industries li:hover{
  border-color: rgba(71,196,242,.45);
  background: rgba(71,196,242,.07);
}

/* ───────────────────────────────────────────────
   ٠٨ · الهيدر والفوتر
   ─────────────────────────────────────────────── */
.ev-header{
  position: sticky;
  inset-block-start: 0;
  z-index: 100;
  background: color-mix(in srgb, var(--ev-surface) 86%, transparent);
  backdrop-filter: saturate(160%) blur(14px);
  border-block-end: 1px solid transparent;
  transition: border-color var(--ev-base), background-color var(--ev-base);
}
.ev-header.is-stuck{ border-block-end-color: var(--ev-line); }

.ev-header__inner{
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 40px);
  min-height: 76px;
}
.ev-brand{ display: inline-flex; align-items: center; flex: 0 0 auto; }
.ev-brand img{ max-height: 40px; width: auto; }

.ev-nav{ margin-inline-start: auto; }
.ev-nav ul{ display: flex; gap: clamp(14px, 2vw, 28px); margin: 0; padding: 0; list-style: none; }
.ev-nav a{
  display: block;
  padding: 10px 2px;
  color: var(--ev-c-body);
  font-size: .95rem;
  text-decoration: none;
  transition: color var(--ev-fast);
}
.ev-nav a:hover,
.ev-nav .current-menu-item > a{ color: var(--ev-c-ink); }

.ev-header__actions{ display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }

/* زرّا الوضع واللغة — هدف لمس ٤٤px */
.ev-chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 44px; min-height: 44px;
  padding-inline: 12px;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius-pill);
  background: transparent;
  color: var(--ev-c-body);
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color var(--ev-fast), color var(--ev-fast);
}
.ev-chip:hover{ border-color: var(--ev-c-accent); color: var(--ev-c-ink); }
.ev-chip svg{ width: 17px; height: 17px; }

/* زر القائمة على الموبايل */
.ev-burger{ display: none; }

@media (max-width: 1024px){
  .ev-burger{ display: inline-flex; }
  .ev-nav{
    position: fixed;
    inset: 76px 0 auto 0;
    margin: 0;
    padding: 20px var(--ev-gutter) 32px;
    background: var(--ev-alt);
    border-block-end: 1px solid var(--ev-line);
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--ev-base), transform var(--ev-base), visibility var(--ev-base);
  }
  .ev-nav.is-open{ transform: none; opacity: 1; visibility: visible; }
  .ev-nav ul{ flex-direction: column; gap: 2px; }
  .ev-nav a{ padding: 13px 0; font-size: 1.05rem; }
}

.ev-footer{
  padding-block: clamp(48px, 7vw, 88px) 0;
  background: var(--ev-alt);
  border-block-start: 1px solid var(--ev-line);
}
.ev-footer__grid{
  display: grid;
  gap: clamp(28px, 4vw, 56px);
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
}
@media (max-width: 900px){ .ev-footer__grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .ev-footer__grid{ grid-template-columns: 1fr; } }

.ev-footer h2{ font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ev-c-body); }
[dir="rtl"] .ev-footer h2{ letter-spacing: 0; text-transform: none; }
.ev-footer ul{ margin: 0; padding: 0; list-style: none; }
.ev-footer li + li{ margin-block-start: 9px; }
.ev-footer a{ color: var(--ev-c-body); text-decoration: none; font-size: .93rem; }
.ev-footer a:hover{ color: var(--ev-c-accent); }

.ev-footer__bar{
  margin-block-start: clamp(32px, 4vw, 56px);
  padding-block: 22px;
  border-block-start: 1px solid var(--ev-line);
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
  align-items: center;
  justify-content: space-between;
  font-size: .85rem;
}

.ev-social{ display: flex; gap: 8px; }
.ev-social a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px; height: 44px;
  border: 1px solid var(--ev-line);
  border-radius: 50%;
  transition: border-color var(--ev-fast), color var(--ev-fast);
}
.ev-social a:hover{ border-color: var(--ev-c-accent); }
.ev-social svg{ width: 18px; height: 18px; }

/* الخريطة تُحمّل عند النقر — لا iframe قبل ذلك */
.ev-map{
  position: relative;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius);
  overflow: hidden;
  cursor: pointer;
}
.ev-map iframe{ width: 100%; height: 100%; border: 0; display: block; }

/* ───────────────────────────────────────────────
   ٠٩ · الأرشيفات والمقالات
   ─────────────────────────────────────────────── */
.ev-page-head{
  padding-block: clamp(56px, 8vw, 104px) clamp(32px, 4vw, 56px);
  background:
    radial-gradient(ellipse 70% 100% at 50% 0%, rgba(19,105,171,.26), transparent 70%),
    var(--ev-surface);
  border-block-end: 1px solid var(--ev-line);
}

.ev-tile{
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius);
  background: var(--ev-card);
  overflow: hidden;
  transition: transform var(--ev-base) var(--ev-ease), box-shadow var(--ev-base), border-color var(--ev-base);
}
.ev-tile:hover{ transform: translateY(-6px); border-color: rgba(71,196,242,.45); box-shadow: var(--ev-lift-3); }
.ev-tile__media{
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--ev-alt);
}
.ev-tile__media img{
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .7s var(--ev-ease);
}
.ev-tile:hover .ev-tile__media img{ transform: scale(1.05); }
.ev-tile__body{ padding: 22px 24px 26px; display: flex; flex-direction: column; flex: 1; }
.ev-tile__cat{
  font-size: .74rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ev-c-accent);
  margin-block-end: 9px;
}
[dir="rtl"] .ev-tile__cat{ letter-spacing: 0; text-transform: none; }
.ev-tile__title{ font-size: 1.14rem; margin-block-end: .4em; }
.ev-tile__title a{ color: inherit; text-decoration: none; }

/* رقم النتيجة على بطاقة المشروع */
.ev-tile__result{
  margin-block-start: auto;
  padding-block-start: 16px;
  font-family: var(--ev-font-display);
  font-size: 1.5rem;
  color: var(--ev-c-accent);
}
.ev-tile__result small{
  display: block;
  font-family: var(--ev-font-body);
  font-size: .78rem;
  color: var(--ev-c-body);
}

/* الفلاتر */
.ev-filters{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0; margin: 0 0 var(--ev-gap);
  list-style: none;
}
.ev-filters a{
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 20px;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius-pill);
  color: var(--ev-c-body);
  font-size: .88rem;
  text-decoration: none;
  transition: border-color var(--ev-fast), color var(--ev-fast), background-color var(--ev-fast);
}
.ev-filters a:hover,
.ev-filters [aria-current="true"]{
  border-color: var(--ev-c-accent);
  color: var(--ev-c-ink);
  background: rgba(71,196,242,.08);
}

/* المقال المفرد */
.ev-prose{ max-width: 72ch; }
.ev-prose > * + *{ margin-block-start: 1.15em; }
.ev-prose h2{ margin-block-start: 1.8em; }
.ev-prose h3{ margin-block-start: 1.5em; }
.ev-prose img, .ev-prose figure{ border-radius: var(--ev-radius); }
.ev-prose blockquote{
  margin: 1.6em 0;
  padding-inline-start: 22px;
  border-inline-start: 2px solid var(--ev-c-accent);
  font-size: 1.1rem;
  color: var(--ev-c-ink);
}
.ev-prose ul, .ev-prose ol{ padding-inline-start: 1.3em; }
.ev-prose li + li{ margin-block-start: .4em; }
.ev-prose code{ font-family: var(--ev-font-mono); font-size: .9em; }
.ev-prose table{ width: 100%; border-collapse: collapse; }
.ev-prose th, .ev-prose td{ padding: 10px 12px; border-block-end: 1px solid var(--ev-line); text-align: start; }

/* ترقيم الصفحات */
.ev-pagination{ display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-block-start: clamp(32px, 4vw, 56px); }
.ev-pagination .page-numbers{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px; min-height: 44px;
  padding-inline: 10px;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius-sm);
  color: var(--ev-c-body);
  text-decoration: none;
}
.ev-pagination .page-numbers:hover{ border-color: var(--ev-c-accent); color: var(--ev-c-ink); }
.ev-pagination .current{ background: var(--ev-c-accent); border-color: var(--ev-c-accent); color: var(--ev-on-accent); }

/* ───────────────────────────────────────────────
   ١٠ · الوضع الفاتح
   الفاتح يرتفع بالظلال، الداكن يضيء بالتوهّج.
   كل لون هنا يتجاوز WCAG AA على الأبيض.
   ─────────────────────────────────────────────── */
:root[data-theme="light"]{
  --ev-surface:   #FFFFFF;
  --ev-alt:       #EFF5FC;
  --ev-card:      #FFFFFF;
  --ev-line:      #C9DCEF;
  --ev-ink:       #08203D;  /* ١٦٫٣٥:١ */
  --ev-body:      #3F5A77;  /*  ٧٫١٤:١ */
  --ev-muted:     #5C7594;
  --ev-accent:    #1B6FC4;  /*  ٥٫١٠:١ — وليس 47C4F2 (٢٫٠١:١ راسب) */
  --ev-deep:      #0E4F96;  /*  ٨٫١٥:١ */
  --ev-glow:      rgba(8,32,61,.14);
  --ev-on-accent: #FFFFFF;  /*  ٥٫١٠:١ على #1B6FC4 — الداكن يعطي ٣٫٧٨:١ ويسقط */

  --ev-lift-1: 0 1px 2px rgba(8,32,61,.06), 0 4px 12px rgba(8,32,61,.05);
  --ev-lift-2: 0 2px 4px rgba(8,32,61,.07), 0 12px 28px rgba(8,32,61,.10);
  --ev-lift-3: 0 4px 8px rgba(8,32,61,.08), 0 24px 48px rgba(8,32,61,.14);
}

:root[data-theme="light"] .ev-card,
:root[data-theme="light"] .ev-tile{ box-shadow: var(--ev-lift-1); }
:root[data-theme="light"] .ev-card:hover,
:root[data-theme="light"] .ev-tile:hover{ box-shadow: var(--ev-lift-3); }

:root[data-theme="light"] .ev-marquee__row img{ filter: grayscale(1) brightness(.5); }

/* الرقم الشبح: ٤٪ من الأبيض يُقرأ على الداكن، لكن ٤٪ من الكحلي
   يختفي على الأبيض. الفاتح يحتاج ضعف الشدّة تقريباً. */
:root[data-theme="light"] .ev-card[data-ghost]::after{ opacity: .075; }

:root[data-theme="light"] .ev-page-head{
  background:
    radial-gradient(ellipse 70% 100% at 50% 0%, rgba(27,111,196,.10), transparent 70%),
    var(--ev-surface);
}

/* التدرّج داخل النص يحتاج إعادة تصريح في الفاتح */
/* الوضع الفاتح يرث اللون من --ev-c-accent، فلا يحتاج تجاوزاً. */

:root[data-theme="light"] .ev-icon{ background: rgba(27,111,196,.10); }

/* ───────────────────────────────────────────────
   ١١ · العربية RTL
   التخطيط كله بخصائص منطقية، فلا يحتاج قلباً يدوياً.
   هنا فقط ما لا تغطيه الخصائص المنطقية.
   ─────────────────────────────────────────────── */
[dir="rtl"] .ev-nav{ margin-inline-start: auto; }

/* الأرقام تبقى بالاتجاه اللاتيني داخل النص العربي */
[dir="rtl"] .ev-stat b,
[dir="rtl"] [data-count],
[dir="rtl"] .ev-tile__result{ direction: ltr; unicode-bidi: isolate; }

/* نص إنجليزي داخل سياق عربي والعكس */
.ev-bidi{ unicode-bidi: isolate; }
.ev-bidi-auto{ unicode-bidi: plaintext; text-align: start; }

/* ───────────────────────────────────────────────
   ١٢ · إمكانية الوصول
   ─────────────────────────────────────────────── */

/* رابط التخطي — أول ما يصله الكيبورد */
.ev-skip{
  position: absolute;
  inset-inline-start: -9999px;
  inset-block-start: 0;
  z-index: 10000;
  padding: 13px 22px;
  background: var(--ev-c-accent);
  color: var(--ev-on-accent);
  font-weight: 700;
  border-end-end-radius: 8px;
}
.ev-skip:focus{ inset-inline-start: 0; }

/* حلقة تركيز مرئية دائماً — لا تُزال أبداً */
:focus-visible{
  outline: 2px solid var(--ev-c-accent);
  outline-offset: 3px;
  border-radius: 4px;
}

/* مرئي لقارئ الشاشة فقط */
.screen-reader-text,
.ev-sr{
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.screen-reader-text:focus,
.ev-sr:focus{
  position: static !important;
  width: auto; height: auto;
  clip: auto; clip-path: none;
}

/* احترام تفضيل تقليل الحركة — إلزامي */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  [data-rv]{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .ev-marquee__row{ animation: none; }
  .ev-btn::before{ display: none; }
  *, *::before, *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* الطباعة الورقية */
@media print{
  .ev-header, .ev-footer, .ev-skip, .ev-marquee{ display: none; }
  body{ background: #fff; color: #000; }
}

/* ───────────────────────────────────────────────
   ١٣ · بقية المكوّنات
   ─────────────────────────────────────────────── */

.ev-main{ display: block; min-height: 40vh; }

/* ── زرّا الوضع واللغة ──────────────────────── */

/* يظهر رمز واحد فقط: الشمس في الداكن (ادعُني إلى الفاتح)،
   والقمر في الفاتح. */
.ev-chip--theme .ev-icon-sun{ display: block; }
.ev-chip--theme .ev-icon-moon{ display: none; }
:root[data-theme="light"] .ev-chip--theme .ev-icon-sun{ display: none; }
:root[data-theme="light"] .ev-chip--theme .ev-icon-moon{ display: block; }

.ev-chip--lang{ text-decoration: none; font-variant-numeric: tabular-nums; }

/* زر عرض السعر يختفي على الموبايل — الزر في القائمة يكفي */
@media (max-width: 680px){
  .ev-header__cta{ display: none; }
}

/* ── مسار التنقّل ───────────────────────────── */
.ev-crumbs{
  margin-block-end: 18px;
  font-size: .84rem;
  color: var(--ev-muted);
}
.ev-crumbs a{ color: var(--ev-muted); text-decoration: none; }
.ev-crumbs a:hover{ color: var(--ev-c-accent); }
.ev-crumbs span[aria-hidden]{ margin-inline: 6px; opacity: .5; }

/* ── الفلاتر ────────────────────────────────── */
.ev-filters-wrap{ margin-block-end: clamp(24px, 3vw, 40px); }

/* ── الفوتر: أعمدة ──────────────────────────── */
.ev-footer__brand > p:not([class]){ color: var(--ev-c-body); font-size: .95rem; max-width: 34ch; }
.ev-footer__brand .ev-h3{ color: var(--ev-c-ink); margin-block-end: .35em; }
.ev-footer__brand img{ max-height: 44px; width: auto; margin-block-end: 14px; }
.ev-footer__brand .ev-social{ margin-block-start: 18px; }
.ev-footer__contact ul{ color: var(--ev-c-body); font-size: .93rem; }
.ev-footer__legal ul{ display: flex; gap: 20px; margin: 0; padding: 0; list-style: none; }

/* ── المقال المفرد ──────────────────────────── */
.ev-single__hero,
.ev-project__hero{
  margin: 0 0 clamp(28px, 4vw, 48px);
  border-radius: var(--ev-radius);
  overflow: hidden;
}

.ev-project__facts{
  padding-block: clamp(24px, 3vw, 36px);
  margin-block-end: clamp(28px, 4vw, 48px);
  border-block: 1px solid var(--ev-line);
}
.ev-project__facts p{ margin: 0; }
.ev-project__facts .ev-tile__cat{ margin-block-end: 6px; }

/* التنقّل بين المقالات */
.ev-postnav{
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: space-between;
  margin-block-start: clamp(40px, 5vw, 64px);
  padding-block-start: 28px;
  border-block-start: 1px solid var(--ev-line);
}
.ev-postnav a{ text-decoration: none; font-weight: 500; }
.ev-postnav__prev::before{ content: "← "; color: var(--ev-muted); }
.ev-postnav__next::after{ content: " →"; color: var(--ev-muted); }
[dir="rtl"] .ev-postnav__prev::before{ content: "→ "; }
[dir="rtl"] .ev-postnav__next::after{ content: " ←"; }

/* ── البحث ──────────────────────────────────── */
.ev-search{
  display: flex;
  gap: 10px;
  max-width: 520px;
  margin-block-end: clamp(24px, 3vw, 40px);
}
.ev-search__field{
  flex: 1;
  min-height: 48px;
  padding: 12px 18px;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius-pill);
  background: var(--ev-card);
  color: var(--ev-c-ink);
}
.ev-search__field::placeholder{ color: var(--ev-muted); }
.ev-search__field:focus{ border-color: var(--ev-c-accent); }

/* ── التعليقات والنماذج ─────────────────────── */
.ev-comments__list{ margin: 0 0 32px; padding: 0; list-style: none; }
.ev-comments__list ol{ list-style: none; padding-inline-start: clamp(16px, 3vw, 40px); }
.ev-comments__list .comment-body{
  padding: 20px 0;
  border-block-end: 1px solid var(--ev-line);
}
.ev-comments__closed{ color: var(--ev-muted); }

.ev-form__note,
.comment-notes{ font-size: .88rem; color: var(--ev-muted); }

.ev-comments input[type="text"],
.ev-comments input[type="email"],
.ev-comments input[type="url"],
.ev-comments textarea{
  width: 100%;
  min-height: 48px;
  padding: 12px 16px;
  border: 1px solid var(--ev-line);
  border-radius: var(--ev-radius-sm);
  background: var(--ev-card);
  color: var(--ev-c-ink);
}
.ev-comments textarea{ min-height: 140px; resize: vertical; }
.ev-comments label{ display: block; margin-block-end: 6px; font-size: .9rem; color: var(--ev-c-body); }
.ev-comments .form-submit{ margin-block-start: 18px; }

/* ── ودجات الشريط الجانبي ───────────────────── */
.ev-widget + .ev-widget{ margin-block-start: 32px; }
.ev-widget__title{ font-size: 1rem; margin-block-end: 12px; }
.ev-widget ul{ margin: 0; padding: 0; list-style: none; }
.ev-widget li + li{ margin-block-start: 8px; }
.ev-widget a{ color: var(--ev-c-body); text-decoration: none; }
.ev-widget a:hover{ color: var(--ev-c-accent); }

/* ── الخريطة قبل التحميل ────────────────────── */
.ev-map[data-src]:not([data-loaded])::after{
  content: attr(data-label);
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: var(--ev-alt);
  color: var(--ev-c-accent);
  font-weight: 600;
}
.ev-map:focus-visible{ outline: 2px solid var(--ev-c-accent); outline-offset: 3px; }

/* ───────────────────────────────────────────────
   ١٤ · الشفافيات البيضاء الموروثة
   أبيض بشفافية ١٠٪ يُقرأ كحدّ خافت على خلفية داكنة،
   ويختفي تماماً على خلفية بيضاء. هذه العناصر تحمل
   القيمة داخل CSS الذي يولّده Elementor لكل عنصر،
   فلا يمكن ربطها بلون عام — تُعالَج هنا بمعرّفاتها.
   ─────────────────────────────────────────────── */
:root[data-theme="light"]{
  .elementor-element-27a6a6b9{ background-color: rgba(8,32,61,.04) !important; }
  .elementor-element-29636fd9{ background-color: rgba(8,32,61,.04) !important; }
  .elementor-element-29636fd9{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-2d38c11f{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-3196b84c{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-437b6bbe{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-582221fd{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-5efebd83{ background-color: rgba(8,32,61,.04) !important; }
  .elementor-element-5efebd83{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-66606a5f{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-6a9f6adc{ background-color: rgba(8,32,61,.04) !important; }
  .elementor-element-6a9f6adc{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-726668fc{ background-color: rgba(8,32,61,.04) !important; }
  .elementor-element-726668fc{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-7e42cf60{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
  .elementor-element-9b3396a{ border-color: var(--e-global-color-border, #C9DCEF) !important; }
}

/* رقم دراسة الحالة على بطاقة المشروع */
.ev-tile[data-number] .ev-tile__cat::before{
  content: attr(data-number) " ";
  opacity: .55;
}
