.elementor-kit-5{--e-global-color-primary:#F5A623;--e-global-color-secondary:#1A1A1A;--e-global-color-text:#4D4D4D;--e-global-color-accent:#F4F4F4;--e-global-color-8681986:#FFFFFF;--e-global-color-a9156d7:#F5A623;--e-global-color-3180987:#1A1A1A;--e-global-color-ea508db:#4D4D4D;--e-global-color-d7864a3:#7A7A7A;--e-global-color-26f4f08:#F4F4F4;--e-global-color-ef11ef1:#27AE60;--e-global-color-010098d:#25D366;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-size:40px;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//*
==========================================================
dentEKİP — نظام الألوان الصحيح
مستخرج من الشعار الأصلي مباشرة
==========================================================
الخطوة: افتح Elementor → Site Settings → Custom CSS
والصق هذا الكود كاملاً
==========================================================
*/

/* ── المتغيرات الأساسية ── */
:root {
  --de-orange:       #F5A623;   /* البرتقالي — حرف E في الشعار */
  --de-orange-dark:  #D4891A;   /* Hover للبرتقالي */
  --de-orange-light: #FEF3E0;   /* خلفيات البرتقالي الشفافة */
  --de-gray-dark:    #4D4D4D;   /* حرف d في الشعار — للعناوين الرئيسية */
  --de-gray-mid:     #6B6B6B;   /* للنصوص الثانوية */
  --de-gray-soft:    #9A9A9A;   /* للـ Captions والتفاصيل */
  --de-gray-light:   #F2F2F2;   /* خلفيات الأقسام الفاتحة */
  --de-gray-border:  #E0E0E0;   /* الحدود والفواصل */
  --de-white:        #FFFFFF;   /* الخلفية الرئيسية */
  --de-dark-bg:      #2E2E2E;   /* للأقسام الداكنة — رمادي داكن بدلاً من أسود */
  --de-text-main:    #333333;   /* النص الأساسي */
  --de-success:      #27AE60;   /* الإيجابيات */
  --de-danger:       #E74C3C;   /* السلبيات */
  --de-whatsapp:     #25D366;   /* زر واتساب */
}

/* ══════════════════════════════════════
   1. إصلاح العناوين — لا أسود
══════════════════════════════════════ */
h1, h2, h3, h4, h5, h6 {
  color: var(--de-gray-dark);
}

/* عنوان الـ Hero على الخلفية الداكنة */
.hero-section h1,
.section-dark h1,
.section-dark h2 {
  color: var(--de-white) !important;
}

/* ══════════════════════════════════════
   2. الأزرار — برتقالي لا أسود
══════════════════════════════════════ */

/* زر CTA الرئيسي */
.elementor-button.btn-primary,
.btn-primary,
a.btn-orange {
  background-color: var(--de-orange) !important;
  color: var(--de-white) !important;
  border: none !important;
  border-radius: 6px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  padding: 16px 38px !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 4px 15px rgba(245, 166, 35, 0.30) !important;
}

.elementor-button.btn-primary:hover,
.btn-primary:hover {
  background-color: var(--de-orange-dark) !important;
  box-shadow: 0 6px 20px rgba(245, 166, 35, 0.45) !important;
  transform: translateY(-2px) !important;
}

/* زر واتساب */
.btn-whatsapp,
a.whatsapp-cta {
  background-color: var(--de-whatsapp) !important;
  color: var(--de-white) !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  padding: 16px 38px !important;
  transition: all 0.25s ease !important;
}

.btn-whatsapp:hover {
  background-color: #1EAF55 !important;
  transform: translateY(-2px) !important;
}

/* زر ثانوي شفاف */
.btn-outline {
  background: transparent !important;
  border: 2px solid var(--de-orange) !important;
  color: var(--de-orange) !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  padding: 14px 36px !important;
}

.btn-outline:hover {
  background: var(--de-orange) !important;
  color: var(--de-white) !important;
}

/* ══════════════════════════════════════
   3. الـ Hero Section — رمادي داكن لا أسود
══════════════════════════════════════ */
.hero-section,
section.hero {
  background: linear-gradient(
    135deg,
    var(--de-dark-bg) 0%,
    #3A3A3A 100%
  ) !important;
}

/* overlay للصورة في الـ Hero */
.hero-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    rgba(46,46,46,0.92) 0%,
    rgba(46,46,46,0.70) 60%,
    rgba(46,46,46,0.40) 100%
  );
  z-index: 1;
}

.hero-section > * {
  position: relative;
  z-index: 2;
}

/* ══════════════════════════════════════
   4. الأقسام — تناوب أبيض / رمادي فاتح
══════════════════════════════════════ */
section.bg-white,
.section-white {
  background-color: var(--de-white) !important;
}

section.bg-light,
.section-light,
.section-gray {
  background-color: var(--de-gray-light) !important;
}

/* الأقسام الداكنة — رمادي داكن لا أسود */
section.bg-dark,
.section-dark {
  background: linear-gradient(
    135deg,
    var(--de-dark-bg) 0%,
    #383838 100%
  ) !important;
}

/* ══════════════════════════════════════
   5. البطاقات (Cards)
══════════════════════════════════════ */
.de-card {
  background: var(--de-white);
  border: 1px solid var(--de-gray-border);
  border-radius: 12px;
  padding: 32px;
  transition: all 0.3s ease;
  border-top: 3px solid var(--de-orange);
}

.de-card:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,0.10);
  transform: translateY(-4px);
}

/* بطاقة بدون بوردر علوي */
.de-card-flat {
  background: var(--de-white);
  border: 1px solid var(--de-gray-border);
  border-radius: 12px;
  padding: 28px;
  transition: box-shadow 0.3s ease;
}

.de-card-flat:hover {
  box-shadow: 0 8px 30px rgba(0,0,0,0.08);
}

/* ══════════════════════════════════════
   6. بطاقات الأطباء
══════════════════════════════════════ */
.doctor-card {
  background: var(--de-white);
  border: 1px solid var(--de-gray-border);
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.doctor-card:hover {
  box-shadow: 0 16px 50px rgba(0,0,0,0.12);
  transform: translateY(-5px);
}

.doctor-card .card-top-bar {
  height: 4px;
  background: var(--de-orange);
  width: 100%;
}

.doctor-card img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  object-position: top center;
}

.doctor-card .doctor-badge {
  display: inline-block;
  background: var(--de-orange);
  color: var(--de-white);
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 16px 20px 8px;
}

.doctor-card .doctor-name {
  font-family: 'Montserrat', sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: var(--de-gray-dark);
  padding: 0 20px 4px;
}

.doctor-card .doctor-title {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--de-orange);
  padding: 0 20px 10px;
}

.doctor-card .doctor-focus {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  color: var(--de-gray-mid);
  padding: 0 20px 16px;
  line-height: 1.6;
}

.doctor-card .doctor-schedule {
  background: var(--de-gray-light);
  font-size: 12px;
  color: var(--de-gray-soft);
  padding: 10px 20px;
  border-top: 1px solid var(--de-gray-border);
}

/* ══════════════════════════════════════
   7. شريط الإحصاءات
══════════════════════════════════════ */
.stats-bar {
  background: var(--de-orange) !important;
  padding: 30px 0;
}

.stats-bar .stat-number {
  font-family: 'Playfair Display', serif;
  font-size: 44px;
  font-weight: 700;
  color: var(--de-white);
  display: block;
}

.stats-bar .stat-label {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  color: rgba(255,255,255,0.80);
}

.stats-bar .stat-divider {
  width: 1px;
  height: 50px;
  background: rgba(255,255,255,0.30);
  margin: 0 auto;
}

/* ══════════════════════════════════════
   8. جدول المقارنة
══════════════════════════════════════ */
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}

.comparison-table thead th {
  background: var(--de-gray-dark);
  color: var(--de-white);
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 16px 20px;
  text-align: left;
}

.comparison-table tbody tr:nth-child(even) {
  background: var(--de-gray-light);
}

.comparison-table tbody tr:nth-child(odd) {
  background: var(--de-white);
}

.comparison-table tbody td {
  padding: 14px 20px;
  font-size: 14px;
  color: var(--de-gray-mid);
  border-bottom: 1px solid var(--de-gray-border);
  font-family: 'Open Sans', sans-serif;
}

.comparison-table tbody td.highlight {
  color: var(--de-orange);
  font-weight: 700;
  background: var(--de-orange-light);
}

/* ══════════════════════════════════════
   9. بطاقات الشهادات
══════════════════════════════════════ */
.testimonial-card {
  background: var(--de-white);
  border: 1px solid var(--de-gray-border);
  border-radius: 12px;
  border-left: 4px solid var(--de-orange);
  padding: 32px;
  position: relative;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}

.testimonial-card .quote-mark {
  font-family: 'Playfair Display', serif;
  font-size: 80px;
  color: var(--de-orange-light);
  position: absolute;
  top: 10px;
  right: 20px;
  line-height: 1;
  pointer-events: none;
}

.testimonial-card .stars {
  color: var(--de-orange);
  font-size: 18px;
  margin-bottom: 14px;
}

.testimonial-card .testimonial-text {
  font-family: 'Open Sans', sans-serif;
  font-size: 15px;
  font-style: italic;
  color: var(--de-gray-mid);
  line-height: 1.8;
  margin-bottom: 20px;
}

.testimonial-card .patient-name {
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--de-gray-dark);
}

.testimonial-card .patient-location {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  color: var(--de-gray-soft);
}

.testimonial-card .treatment-badge {
  display: inline-block;
  background: var(--de-orange-light);
  color: var(--de-orange);
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 4px;
  margin-top: 8px;
}

/* ══════════════════════════════════════
   10. قسم FAQ — Accordion
══════════════════════════════════════ */
.faq-item {
  background: var(--de-white);
  border: 1px solid var(--de-gray-border);
  border-radius: 10px;
  margin-bottom: 12px;
  overflow: hidden;
  transition: border-color 0.2s;
}

.faq-item.active {
  border-left: 3px solid var(--de-orange);
}

.faq-item .faq-question {
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: var(--de-gray-dark);
  padding: 20px 24px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.faq-item .faq-icon {
  color: var(--de-orange);
  font-size: 20px;
  flex-shrink: 0;
}

.faq-item .faq-answer {
  font-family: 'Open Sans', sans-serif;
  font-size: 15px;
  color: var(--de-gray-mid);
  line-height: 1.8;
  padding: 0 24px 20px;
}

/* ══════════════════════════════════════
   11. بطاقات التكنولوجيا
══════════════════════════════════════ */
.tech-card {
  background: #F8F8F8;
  border: 1px solid var(--de-gray-border);
  border-top: 3px solid var(--de-orange);
  border-radius: 12px;
  padding: 28px;
  transition: all 0.3s ease;
}

.tech-card:hover {
  box-shadow: 0 10px 35px rgba(0,0,0,0.09);
  transform: translateY(-3px);
}

/* على الأقسام الداكنة */
.section-dark .tech-card {
  background: #3A3A3A;
  border-color: #4A4A4A;
}

.tech-card .tech-tag {
  display: inline-block;
  background: var(--de-orange-light);
  color: var(--de-orange);
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
}

.tech-card .tech-icon {
  font-size: 36px;
  margin-bottom: 14px;
  display: block;
}

.tech-card h3 {
  font-family: 'Montserrat', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--de-gray-dark);
  margin-bottom: 4px;
}

.section-dark .tech-card h3 {
  color: var(--de-white);
}

.tech-card .tech-subtitle {
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--de-orange);
  margin-bottom: 12px;
}

.tech-card p {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  line-height: 1.8;
  color: var(--de-gray-mid);
}

.section-dark .tech-card p {
  color: #AAAAAA;
}

/* ══════════════════════════════════════
   12. Label فوق العناوين
══════════════════════════════════════ */
.section-label {
  font-family: 'Montserrat', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--de-orange);
  letter-spacing: 3px;
  text-transform: uppercase;
  display: block;
  margin-bottom: 12px;
}

/* ══════════════════════════════════════
   13. نقاط الإيجابيات والسلبيات
══════════════════════════════════════ */
.pros-list li::before {
  content: "✅ ";
  color: var(--de-success);
}

.cons-list li::before {
  content: "❌ ";
  color: var(--de-danger);
}

.check-list li {
  font-family: 'Open Sans', sans-serif;
  font-size: 15px;
  color: var(--de-gray-mid);
  padding: 8px 0;
  border-bottom: 1px solid var(--de-gray-border);
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

/* ══════════════════════════════════════
   14. خطوات الرحلة
══════════════════════════════════════ */
.journey-step {
  position: relative;
  background: #F8F8F8;
  border: 1px solid var(--de-gray-border);
  border-radius: 12px;
  padding: 28px;
}

.section-dark .journey-step {
  background: #3A3A3A;
  border-color: #4A4A4A;
}

.journey-step .step-number {
  font-family: 'Playfair Display', serif;
  font-size: 54px;
  font-weight: 700;
  color: var(--de-orange);
  opacity: 0.25;
  position: absolute;
  top: 10px;
  right: 14px;
  line-height: 1;
}

.journey-step .step-timing {
  display: inline-block;
  background: var(--de-orange-light);
  color: var(--de-orange);
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
  margin-bottom: 10px;
}

.section-dark .journey-step .step-timing {
  background: rgba(245,166,35,0.20);
}

.journey-step h3 {
  font-family: 'Montserrat', sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: var(--de-gray-dark);
  margin-bottom: 8px;
}

.section-dark .journey-step h3 {
  color: var(--de-white);
}

.journey-step p {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  color: var(--de-gray-mid);
  line-height: 1.7;
}

.section-dark .journey-step p {
  color: #AAAAAA;
}

/* ══════════════════════════════════════
   15. CTA الختامي
══════════════════════════════════════ */
.final-cta-section {
  background: linear-gradient(
    135deg,
    var(--de-dark-bg) 0%,
    #383838 100%
  ) !important;
  padding: 100px 0;
  text-align: center;
}

.final-cta-section h2 {
  font-family: 'Playfair Display', serif;
  font-size: 48px;
  font-weight: 700;
  color: var(--de-white);
  margin-bottom: 16px;
}

.final-cta-section p {
  font-family: 'Open Sans', sans-serif;
  font-size: 18px;
  color: #CCCCCC;
  max-width: 580px;
  margin: 0 auto 48px;
  line-height: 1.8;
}

/* ══════════════════════════════════════
   16. الهيدر والنافيجيشن
══════════════════════════════════════ */
.site-header {
  background: var(--de-white) !important;
  border-bottom: 1px solid var(--de-gray-border) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06) !important;
}

.site-header .nav-link {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--de-gray-dark) !important;
  transition: color 0.2s !important;
}

.site-header .nav-link:hover,
.site-header .nav-link.active {
  color: var(--de-orange) !important;
}

.site-header .nav-cta {
  background: var(--de-orange) !important;
  color: var(--de-white) !important;
  border-radius: 6px !important;
  padding: 10px 22px !important;
  font-weight: 700 !important;
}

/* ══════════════════════════════════════
   17. الفوتر
══════════════════════════════════════ */
.site-footer {
  background: #2E2E2E !important;
  color: #AAAAAA !important;
}

.site-footer .footer-title {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--de-white);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.site-footer a {
  color: #AAAAAA !important;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  transition: color 0.2s !important;
}

.site-footer a:hover {
  color: var(--de-orange) !important;
}

.site-footer .footer-bottom {
  background: #222222;
  border-top: 1px solid #3A3A3A;
  color: #666666;
  font-size: 12px;
  padding: 16px 0;
}

/* ══════════════════════════════════════
   18. الموبايل — Responsive
══════════════════════════════════════ */
@media (max-width: 768px) {

  .hero-section {
    padding: 60px 20px !important;
  }

  .final-cta-section h2 {
    font-size: 30px;
  }

  .stats-bar .stat-number {
    font-size: 32px;
  }

  .elementor-button.btn-primary {
    width: 100% !important;
    text-align: center !important;
    padding: 16px 20px !important;
  }

  .de-card {
    padding: 20px !important;
  }

  .testimonial-card {
    padding: 20px !important;
  }

  .comparison-table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ══════════════════════════════════════
   19. تصحيح الأخطاء الشائعة في Elementor
══════════════════════════════════════ */

/* إزالة أي أسود زرع عن طريق الخطأ */
.elementor-widget-wrap > .elementor-element {
  background-color: transparent;
}

/* ضمان أن الـ Widgets لا تحمل ألواناً مخالفة */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 1180px;
}

/* إصلاح Heading colors */
.elementor-heading-title {
  color: inherit;
}

/* Global heading override لإزالة الأسود المضبوط خطأً */
.elementor h1, .elementor h2, .elementor h3 {
  color: var(--de-gray-dark);
}

.elementor .hero-section h1,
.elementor .section-dark h1,
.elementor .section-dark h2,
.elementor .final-cta-section h2 {
  color: var(--de-white) !important;
}

/* ══════════════════════════════════════
   20. Trust Badges شريط الثقة
══════════════════════════════════════ */
.trust-bar {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  margin-top: 40px;
}

.trust-bar .trust-item {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  color: var(--de-gray-mid);
  display: flex;
  align-items: center;
  gap: 6px;
}

.hero-section .trust-bar .trust-item {
  color: rgba(255,255,255,0.75);
}

.trust-bar .trust-separator {
  color: var(--de-orange);
  font-size: 18px;
}
/* تنسيق ملصقات قبل وبعد */
.twentytwenty-before-label, 
.twentytwenty-after-label {
    color: #ffffff !important;
    font-weight: 800 !important;
    background: rgba(0, 0, 0, 0.5) !important; /* خلفية سوداء شفافة */
    padding: 8px 12px !important;
    border-radius: 4px;
}

/* تلوين الدائرة (المقبض) بالبرتقالي */
.twentytwenty-handle {
    border: 3px solid #f5a623 !important;
}

/* تدوير زوايا البطاقة */
.elementor-widget-image-before-after {
    border-radius: 20px !important;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08) !important;
}
/* جعل شعارات الماركات رمادية وتلوينها عند مرور الماوس */
.elementor-image-carousel-wrapper img {
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all 0.4s ease;
}
.elementor-image-carousel-wrapper img:hover {
    filter: grayscale(0%);
    opacity: 1;
}/* End custom CSS */