.custom-1 {
  margin-bottom: 15px;
}
.custom-2 {
  margin-bottom: 41px !important;
}
.custom-3 {
  margin-bottom: 40px !important;
}
.custom-4 {
  margin-bottom: 51px;
}
.custom-5 {
  margin-bottom: 45px;
}
.custom-5 h2 {
  margin-bottom: 14px;
}
.custom-6 .wrapper {
  padding-bottom: 63px;
}
.custom-7 {
  margin-bottom: 88px;
}
.custom-7 h2 {
  margin-bottom: 14px;
}
.custom-8 .wrapper {
  padding: 94px 0 66px;
}
.custom-9 .wrapper {
  padding: 110px 0 58px;
}
.custom-9 .wrapper .section-title-box {
  margin-bottom: 62px;
}
.custom-9 .wrapper .section-title-box h2 {
  margin-bottom: 13px;
}
.custom-10 .wrapper {
  padding: 60px 0 14 !important;
}
a{
  color: #505050;
}
a:visited{
      text-decoration: none;
}
.b-s-desc::before,
.home-slider .b-s-desc::before,
.header-3 .b-s-desc::before {
  content: none !important;
  display: none !important;
}
.b-s-desc,
.b-s-desc::before {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
/* اخفِ سكشن الأدوات كاملاً */
/*section.tools-bg.border-top-line.dash-top-line {
  /*display: none !important;
/*}

/* احتياط: لو فيه أسنان/فواصل تحتها */
section.tools-bg .tooth-color-w {
  display: none !important;
}

/* تخلّص من أي مسافات عمودية قد يضيفها الثيم حول البلوك */
section.tools-bg {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* أبقِ السكشن والخلفية */
section.tools-bg.border-top-line.dash-top-line {
  display: block !important;
  position: relative;
  padding: 60px 0; /* مسافة مريحة للنص */
}

/* اخفِ المحتوى القديم تمامًا */
section.tools-bg .top-icon-block,
section.tools-bg .circle-box,
section.tools-bg .el-image-left,
section.tools-bg .el-image-right {
  display: none !important;
}

/* احتفظ بالسنّة/الفاصل إن تحب، أو اخفِه */
section.tools-bg .tooth-color-w {
  display: block; /* أو none لو لا تريده */
}

/* تنسيق رسالة الشركة الجديدة */
section.tools-bg .company-message {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
  color: #fff;            /* غالبًا الخلفية غامقة؛ عدّل لو لزم */
}

section.tools-bg .company-message h2 {
  margin-bottom: 16px;
  font-weight: 700;
}

section.tools-bg .company-message .lead {
  font-size: 18px;
  line-height: 1.8;
  opacity: .95;
}
section.tools-bg .company-message .title { margin-bottom: 16px; font-weight:700; }
section.tools-bg .company-message .lead { font-size:18px; }
/* Hide only the intro part inside this section (keep the 3 columns) */
/*section.b-row-3-el.custom-8 .section-title-box > h2,
section.b-row-3-el.custom-8 .section-title-box > h4,
section.b-row-3-el.custom-8 .section-title-box > br,
section.b-row-3-el.custom-8 .section-title-box > hr {
  display: none !important;*/
}

/* Optional: add a little space above the grid so it doesn't stick to the top */
section.b-row-3-el.custom-8 .section-title-box > .row {
  margin-top: 10px;
}
/* ===== Global LTR ===== */
html, body {
  direction: ltr;
  unicode-bidi: plaintext; /* يحسّن عرض النص المختلط (عربي/إنجليزي/أرقام) */
  text-align: left;
}

/* عناصر كثيرة في القالب معمولة يمين؛ نقلبها لليسار عندما يكون الاتجاه LTR */
[dir="ltr"] .text-right,
[dir="ltr"] [style*="text-align: right"] {
  text-align: left !important;
}

/* مسافات واتجاهات inline إن لزم (بدون كسر عناصر أخرى) */
[dir="ltr"] .pull-right { float: right !important; }
[dir="ltr"] .pull-left  { float: left  !important; }

/* في بعض الأقسام اتعملت بخواص يمين/يسار صريحة */
[dir="ltr"] .nav-footer,
[dir="ltr"] .cont-share {
  text-align: left;
}

/* لو فيه قوائم فيها arrows/chevrons مقلوبة على RTL، صححها هنا لو لاحظت انعكاساً */
[dir="ltr"] .ef.icon_right-open::before,
[dir="ltr"] .ef.icon-angle-right::before {
  transform: scaleX(1);
}
/* 1) اجعل المحاذاة الافتراضية لليسار */
html, body {
  text-align: left;
}

/* 2) أي عنصر مجبر على اليمين بـ inline style أو class من القالب */
[dir="ltr"] .text-right,
[dir="ltr"] [style*="text-align: right"] {
  text-align: left !important;
}

/* 3) عالج العناوين والفقرات الشائعة */
[dir="ltr"] h1, 
[dir="ltr"] h2, 
[dir="ltr"] h3, 
[dir="ltr"] h4, 
[dir="ltr"] h5, 
[dir="ltr"] h6, 
[dir="ltr"] p, 
[dir="ltr"] li {
  text-align: left;
}

/* 4) (اختياري) لو عندك أقسام فيها .title-box-center أو .text-center وعايزها برضه يسار */
[dir="ltr"] .title-box-center,
[dir="ltr"] .text-center.force-left {
  text-align: left !important;
}
/* Solid white button all the time */
section.tools-bg.mission-hero .company-message .btn.btn-border.color,
section.tools-bg.mission-hero .company-message .btn.btn-border.color span {
  background: #fff !important;
  color: #0b6dbd !important;
  border: 2px solid #fff !important;
}
section.tools-bg.mission-hero .company-message .btn.btn-border.color:hover,
section.tools-bg.mission-hero .company-message .btn.btn-border.color:focus {
  filter: brightness(0.96);
}
/* Center the "More" text perfectly inside the hero button */
section.tools-bg.mission-hero .company-message .btn.btn-border.color {
  display: inline-flex;            /* يفعّل المحاذاة المرنة */
  align-items: center;             /* توسيط عمودي */
  justify-content: center;         /* توسيط أفقي */
  min-height: 44px;                /* ارتفاع مريح للزر */
  padding: 0 24px;                 /* حواف أفقية فقط */
  line-height: 1;                  /* يمنع التمدد العمودي للنص */
  vertical-align: middle;          /* تحسّب مع عناصر inline مجاورة */
  border-radius: 999px;            /* شكل كبسولة */
}

section.tools-bg.mission-hero .company-message .btn.btn-border.color span {
  display: inline-block;
  line-height: 1;                  /* يمنع أي توارث يسبب عدم التوسيط */
}
/* === Owl Home Slider: اجعل الصور تستجيب والارتفاع تلقائي === */
#owl-home .item img {
  width: 100%;
  height: auto;
  display: block;
}

/* ألغِ أي ارتفاع ثابت من الثيم على اللفّاف */
#owl-home,
#owl-home .owl-wrapper-outer {
  height: auto !important;
  overflow: visible; /* يمنع قصّ المحتوى على الموبايل */
}

/* تحسّين بسيط للنص داخل الشريحة لو كان موجود */
#owl-home .b-s-desc {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
/* =========================
   Mission block (mobile)
   هوامش داخلية + تحسين خط
   ========================= */
@media (max-width: 767px) {

  /* رجّع حافة رأسية مريحة للسكشن */
  section.tools-bg {
    padding: 28px 0 !important;
  }

  /* حافة أفقية للنص ومنع الالتصاق بالحواف */
  section.tools-bg .company-message,
  section.tools-bg .wrapper,
  section.tools-bg .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
  }

  /* العنوان "Our Mission" */
  section.tools-bg .company-message h1,
  section.tools-bg .company-message h2 {
    font-size: 30px;         /* كان كبير قوي على الموبايل */
    line-height: 1.25;
    margin-bottom: 12px;
    text-align: left;        /* ثبّت الاتجاه */
  }

  /* الفقرات */
  section.tools-bg .company-message p,
  section.tools-bg .company-message .lead {
    font-size: 16.5px;
    line-height: 1.7;
    text-align: left;
    margin-bottom: 14px;
    word-break: break-word;  /* يمنع خروج الكلمات الطويلة */
  }

  /* زر "More" */
  section.tools-bg .company-message .btn.btn-border.color {
    margin-top: 14px;
    min-height: 42px;
    padding: 0 22px;
  }
}

/* على الشاشات المتوسطة ندي مسافة أكبر قليلًا */
@media (min-width: 768px) and (max-width: 991px) {
  section.tools-bg { padding: 36px 0 !important; }
  section.tools-bg .company-message h1,
  section.tools-bg .company-message h2 { font-size: 36px; }
  section.tools-bg .company-message p,
  section.tools-bg .company-message .lead { font-size: 17px; }
}

/* ثبّت الاتجاه لليسار في هذا البلوك تحديدًا حتى لو الصفحة RTL */
section.tools-bg .company-message,
section.tools-bg .company-message * {
  direction: ltr;
  text-align: left;
}
/* 1) ضبط أبعاد الزر وتخن السطر */
section.tools-bg.mission-hero .company-message .btn.btn-border.color {
  display: inline-flex;           /* للتوسيط داخل الزر */
  align-items: center;            /* توسيط عمودي */
  justify-content: center;        /* توسيط أفقي */
  min-height: 30px;               /* كان عالي؛ نخفضه */
  padding: 5px 16px;              /* حواف متوازنة */
  line-height: 1;                 /* يمنع تمدد عمودي */
  border-radius: 999px;           /* كبسولة */
  font-weight: 700;               /* نص سميك */
}

/* لو الثيم كان يضعف وزن الخط داخل span */
section.tools-bg.mission-hero .company-message .btn.btn-border.color span {
  font-weight: inherit;
}

/* 2) توسيط الزر نفسه في منتصف السطر */
section.tools-bg.mission-hero .company-message > p:last-of-type {
  text-align: center !important;  /* يوسّط محتوى الفقرة (الزر) فقط */
  margin: 0;                      /* إزالة أي مسافات مزعجة */
}

/* 3) لو عندك قاعدة عامة غيّرت .text-center لليسار، رجّع التوسيط هنا فقط */
section.tools-bg.mission-hero .company-message.text-center {
  text-align: center !important;
}
/****/
/* زر More في سكشن Our Mission فقط */
section.tools-bg.mission-hero .company-message > p:last-of-type {
  text-align: center !important; /* المربع كله في المنتصف */
  margin: 0;
}

section.tools-bg.mission-hero .company-message .btn.btn-border.color {
  display: inline-block;                 /* زر عادي */
  height: 32px !important;              /* ارتفاع الزر */
  line-height: 25px !important;         /* يوسّط النص عموديًا */
  padding: 0 20px !important;           /* حواف أفقية فقط */
  border-radius: 999px;                 /* كبسولة */
  font-weight: 700 !important;          /* الكلمة سميكة */
  background: #fff !important;          /* نفس الشكل اللي عجبك */
  color: #0b6dbd !important;            /* أزرق للنص */
  border: 2px solid #fff !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.18);
}

section.tools-bg.mission-hero .company-message .btn.btn-border.color span {
  display: inline-block;
  line-height: inherit !important;      /* يمنع تمدد غريب للنص */
}

/* تأثير بسيط عند المرور */
section.tools-bg.mission-hero .company-message .btn.btn-border.color:hover,
section.tools-bg.mission-hero .company-message .btn.btn-border.color:focus {
  filter: brightness(0.96);
}
/* ترتيب الهيدر في الموبايل + تقليل الفراغ فوق السلايدر */
@media (max-width: 767px) {

  /* الهيدر فوق السلايدر مباشرة بدون فراغ زائد */
  #header {
    margin-bottom: 0;
  }

  #owl-home {
    margin-top: 0 !important;
  }

  /* ترتيب اللوجو يمين والمنيو شمال */
  #header .header-nav .wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;   /* اللوجو يمين – المنيو شمال */
    padding: 8px 12px;
  }

  #header .header-nav .col-lg-2.col-md-2.col-sm-2.col-xs-6 {
    flex: 0 0 auto;
    padding: 0;
  }

  #header .header-nav .logo {
    text-align: right;
  }

  #header .header-nav .logo img {
    position: static !important;   /* يلغي top:-22px */
    max-height: 48px;
    width: auto;
    margin: 0;
    display: block;
  }

  #header .header-nav .nav-box {
    flex: 1 1 auto;
    text-align: left;
    padding: 0;
  }

  #toggle-nav {
    font-size: 26px;
    cursor: pointer;
  }
}
/* === ضبط الشريط الأزرق العلوي + إخفاء السوشيال في الموبايل === */
@media (max-width: 767px) {

  /* قلّل ارتفاع .header-top من فوق وتحت */
  #header .header-top {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
  }

  #header .header-top .wrapper {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  /* داخل البلوك الأزرق: لغِ أي مسافات زائدة */
  #header .header-top .header-info {
    margin: 0 !important;
    padding: 0 !important;
  }

  #header .header-top .header-info > * {
    margin: 0 0 2px !important;   /* مسافة بسيطة فقط بين السطور */
  }

  #header .header-top .description-header {
    margin-top: 0 !important;
  }

  /* إخفاء أيقونات السوشيال في الهيدر (تظل في الفوتر لو نقلت الكود هناك) */
  #header .header-top .cont-share {
    display: none !important;
  }
}

/*****************/
/* حذف الفراغ الأبيض بين الهيدر والسلايدر على الموبايل */
@media (max-width: 767px) {

  /* ألغِ أي هوامش/حشوات في شريط الناف */
  #header .header-nav {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: none !important;
  }

  /* هذا هو السبب الرئيسي للفراغ: container فاضي */
  #header .header-nav > .container {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }
}
/************************/
/* إزالة الفراغ الأبيض تحت اللوجو في الموبايل */
@media (max-width: 959px) {
  #header {
    padding-top: 0 !important;
  }
}

@media (max-width: 480px) {
  #header {
    padding-top: 0 !important;
  }
}
/* الوضع الافتراضي = موبايل: العناصر تحت بعض */
.row-2-blocks-2 {
    direction: ltr;              /* النص الإنجليزي من الشمال لليمين */
}

.r-block-1,
.r-block-2 {
    width: 100%;
}

.r-block-2 {
    text-align: center;          /* الزر في المنتصف على الموبايل */
    margin-top: 15px;
}

/* من الشاشات الكبيرة نخليهم جنب بعض */
@media (min-width: 992px) {
    .row-2-blocks-2 {
        display: flex;
        flex-direction: row;
        align-items: center;
    }

    .r-block-1,
    .r-block-2 {
        width: auto;
        flex: 1;
    }

    .r-block-2 {
        display: flex;
        justify-content: center; /* الزر في المنتصف أفقياً */
        margin-top: 0;
        text-align: center;
    }
}
.r-block-2 a.btn {
    display: inline-block;   /* أو block لو حابب */
}
/* تأكد أن الكونتينر لا يمنع الضغط */
.r-block-2,
.r-block-2 a.btn,
.r-block-2 .btn {
    position: relative;
    z-index: 20;
    pointer-events: auto !important;
    display: inline-block;
}

/* لو في ستايل عام معطّل الأزرار */
.btn.big-circle {
    pointer-events: auto !important;
}
/* افتراضيًا: الديسكتوب */
.btn-mobile-only {
    display: none;
}

.btn-desktop-only {
    display: block;
}
.offer-cards {
    margin-top: 40px;
}

.offer-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 25px 20px;
    margin-bottom: 30px;
    text-align: left;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.offer-card h3 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    color: #0070b8; /* تقدّر تحذفها لو عندك لون ثابت في الثيم */
}

.offer-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
}
/* الكروت نفسها */
.offer-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 25px 20px;
    margin-bottom: 30px;
    text-align: left;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    color: #333; /* لون النص داخل الكرت */
}

/* عنوان كل كرت */
.offer-card h3 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    color: #0070b8;  /* تقدر تغيّره للون البراند عندك */
}

/* النص داخل الكرت */
.offer-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #555;
}
.offer-card,
.offer-card h3,
.offer-card p {
    color: #333 !important;
}
/* Reliable Frozen Export Solutions – من الشمال */
.b-row-3-el.custom-8,
.b-row-3-el.custom-8 * {
    direction: ltr;
    text-align: left !important;
}
/* عنوان What We Offer في المنتصف */
section.tools-bg.mission-hero .company-message {
    text-align: center !important;
}

section.tools-bg.mission-hero .company-message .title {
    display: block;
    text-align: center !important;
}

/* نص الكروت نفسه يفضل يسار */
section.tools-bg.mission-hero .offer-card {
    text-align: left !important;
}
/* مركز العنوان والجملة التي تحته في سكشن Reliable Frozen Export Solutions */
.b-row-3-el.custom-8 .section-title-box {
    text-align: center !important;
}

/* العنوان */
.b-row-3-el.custom-8 .section-title-box h2 {
    font-weight: 700;
    margin-bottom: 8px;
}

/* الجملة تحت العنوان – Bold وفي المنتصف */
.b-row-3-el.custom-8 .section-title-box span {
    display: block;
    font-weight: 700;
    text-align: center;
}

/* إخفاء الخط الأسود الصغير فوق العنوان */
.b-row-3-el.custom-8 .section-title-box:after {
    display: none !important;
}
/* اجعل عنوان Reliable والجملة تحته في المنتصف */
.b-row-3-el.custom-8 .section-title-box,
.b-row-3-el.custom-8 .section-title-box h2,
.b-row-3-el.custom-8 .section-title-box span {
    text-align: center !important;
}

/* لو عايز الجملة Bold كما اتفقنا */
.b-row-3-el.custom-8 .section-title-box span {
    font-weight: 700;
}
/* إلغاء الخط الصغير فوق عنوان Reliable Frozen Export Solutions */
.b-row-3-el.custom-8 .section-title-box:before,
.b-row-3-el.custom-8 .section-title-box:after {
    display: none !important;
}
/* إزالة أي خط زخرفي فوق/تحت عنوان Reliable Frozen Export Solutions */
.b-row-3-el.custom-8 .section-title-box:before,
.b-row-3-el.custom-8 .section-title-box:after,
.b-row-3-el.custom-8 .section-title-box h2:before,
.b-row-3-el.custom-8 .section-title-box h2:after {
    content: none !important;
    display: none !important;
}
/* مركز العناوين والأزرار تحت الصور في سكشن الكاتيجري */
.h-post-block .h-p-box {
    text-align: center;
}

.h-post-block .h-p-box img {
    display: block;
    margin: 0 auto 15px;   /* الصورة في النص وتحتها مسافة بسيطة */
}

.h-post-block .h-p-box .c-box {
    text-align: center;
}

.h-post-block .h-p-box .c-box h3 {
    text-align: center;
}

.h-post-block .h-p-box .c-box .btn {
    display: inline-block;
    margin: 8px auto 0;    /* الزر في المنتصف تحت العنوان */
}
/* ====== Reliable Frozen Export Solutions – Cards ====== */

/* خلي الأعمدة كأنها كروت */
.b-row-3-el.custom-8 .row-4 > div {
    text-align: center;
    padding: 24px 18px;
    border-radius: 16px;
    background: #f7f9fb;
    box-shadow: 0 6px 18px rgba(0,0,0,0.05);
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

/* العنوان والنص داخل الكرت */
.b-row-3-el.custom-8 .row-4 > div h3 {
    font-weight: 700;
    margin-bottom: 6px;
}

.b-row-3-el.custom-8 .row-4 > div p {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
    color: #666;
}

/* أيقونة دائرية أعلى كل كرت */
.b-row-3-el.custom-8 .row-4 > div::before {
    content: "✓";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #0b6dbd;
    color: #fff;
    font-size: 24px;
    margin-bottom: 10px;
    position: relative;
    top: -6px;
}

/* غيّر الأيقونة لكل كرت حسب ترتيبها */
.b-row-3-el.custom-8 .row-4 > div:nth-child(1)::before { content: "✓"; }  /* Consistent Quality */
.b-row-3-el.custom-8 .row-4 > div:nth-child(2)::before { content: "⏱"; }  /* On-time Delivery */
.b-row-3-el.custom-8 .row-4 > div:nth-child(3)::before { content: "🌍"; }  /* Global Export */
.b-row-3-el.custom-8 .row-4 > div:nth-child(4)::before { content: "📄"; }  /* Quality Certificates */
/* مركز الأيقونات داخل كل كارت */
.b-row-3-el.custom-8 .row-4 > div::before {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 12px;   /* يخلي الدائرة في المنتصف */
}
/* على الموبايل: خلي نص الكروت في المنتصف */
@media (max-width: 767px) {
  .b-row-3-el.custom-8 .row-4 > div {
    text-align: center !important;
  }

  .b-row-3-el.custom-8 .row-4 > div h3,
  .b-row-3-el.custom-8 .row-4 > div p {
    text-align: center !important;
  }
}
/* تقليل حجم العنوان والنص في البانر الأخضر على الموبايل */
@media (max-width: 767px) {
  .color-bg.extra-color-bg .c-content-block h2 {
    font-size: 24px;
    line-height: 1.3;
  }

  .color-bg.extra-color-bg .c-content-block div {
    font-size: 14px;
    line-height: 1.6;
  }

  /* خلي الزر عرض مناسب مش مالِي الشاشة بالكامل */
  .color-bg.extra-color-bg .r-block-2 .btn.big-circle {
    max-width: 260px;
    width: 100%;
  }
}
/* 1) خلي العنوان والجملة في المنتصف (ديسكتوب + موبايل) */
.color-bg.extra-color-bg .c-content-block {
    text-align: center !important;
}

.color-bg.extra-color-bg .c-content-block h2 {
    text-align: center !important;
}

/* 2) الزر في المنتصف دائمًا */
.color-bg.extra-color-bg .r-block-2 {
    text-align: center !important;
}

/* 3) اسم الزر يسمح بلفّ السطر (بدل ما يخرج بره) */
.color-bg.extra-color-bg .r-block-2 .btn.big-circle .big-text {
    display: inline-block;
    white-space: normal !important;   /* يسمح بتقسيم الكلام على سطرين */
    line-height: 1.3;
}

/* 4) ضبط شكل الزر على الموبايل خصوصًا */
@media (max-width: 767px) {
  .color-bg.extra-color-bg .r-block-2 .btn.big-circle {
      width: 100%;
      max-width: 260px;        /* عرض مناسب */
      padding: 10px 16px;
  }

  .color-bg.extra-color-bg .r-block-2 .btn.big-circle .big-text {
      font-size: 13px;         /* تصغير بسيط عشان ما يختنقش */
  }
}
/* ديسكتوب: خليه سطر واحد */
.color-bg.extra-color-bg .r-block-2 .btn.big-circle .big-text {
    white-space: nowrap;
}

/* موبايل: اسمح له يكسر سطر */
@media (max-width: 767px) {
  .color-bg.extra-color-bg .r-block-2 .btn.big-circle .big-text {
      white-space: normal;
      display: block;
      line-height: 1.3;
  }
}
/* زر Download Product Catalogue في البانر الأخضر */

/* شكل الزر نفسه */
.color-bg.extra-color-bg .r-block-2 .btn.big-circle {
    display: inline-block;
    padding: 10px 32px;      /* وسّعنا الزر أفقياً */
    max-width: none;         /* ما نحصرهوش في 260px */
    width: auto;             /* عرضه حسب طول النص */
}

/* خلي النص دايمًا على سطر واحد */
.color-bg.extra-color-bg .r-block-2 .btn.big-circle .big-text {
    white-space: nowrap;     /* يمنع اللف على سطرين */
    font-size: 14px;         /* حجم مريح للموبايل والديسكتوب */
    line-height: 1.2;
}
/* === Floating Contact Sales Button === */

.floating-contact {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
    font-family: inherit;
}

/* زر Contact Sales */
.floating-contact-toggle {
    background: #0b6dbd;
    color: #fff;
    border: none;
    padding: 10px 16px;
    border-radius: 8px 0 0 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 6px 18px rgba(0,0,0,0.2);
    white-space: nowrap;
}

/* البانل اللي بيظهر عند الضغط */
.floating-contact-panel {
    position: absolute;
    right: 110%;
    top: 50%;
    transform: translateY(-50%);
    background: #ffffff;
    border-radius: 12px;
    padding: 10px 14px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    min-width: 230px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
}

.floating-contact-panel a {
    display: block;
    font-size: 13px;
    color: #333;
    text-decoration: none;
    margin-bottom: 4px;
}

.floating-contact-panel a:last-child {
    margin-bottom: 0;
}

/* إظهار البانل عند الضغط */
.floating-contact.open .floating-contact-panel {
    opacity: 1;
    pointer-events: auto;
}

/* موبايل: خليها تحت على اليمين بدل النص */
@media (max-width: 767px) {
    .floating-contact {
        top: auto;
        bottom: 20px;
        right: 10px;
        transform: none;
    }

    .floating-contact-panel {
        right: 0;
        top: auto;
        bottom: 110%;
        transform: none;
    }
}
/* ===== Floating Contact Icons ===== */

.floating-contact {
    position: fixed;
    right: 16px;
    bottom: 24px;
    z-index: 9999;
    font-family: inherit;
}

/* زر Contact الأساسي (دائرة) */
.floating-main-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    background: #0b6dbd;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(0,0,0,.25);
}

/* حاوية الأيقونات التي تظهر عند الفتح */
.floating-icons {
    position: absolute;
    bottom: 60px;
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: all .2s ease;
}

/* كل أيقونة دائرة صغيرة */
.floating-icons .fc-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,.2);
}

/* ألوان كل أيقونة */
.fc-whatsapp { background: #25d366; }
.fc-phone    { background: #00c853; }
.fc-mail     { background: #ff5252; }
.fc-close    { background: #3f51b5; }

/* عند الفتح تظهر الأيقونات */
.floating-contact.open .floating-icons {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

/* موبايل: نفس المكان تقريباً */
@media (max-width: 767px) {
    .floating-contact {
        right: 12px;
        bottom: 16px;
    }
}
/* زر Contact Sales */
.floating-contact {
    position: fixed;
    right: 16px;
    bottom: 24px;
    z-index: 9999;
}

.floating-main-btn {
    border-radius: 999px;
    border: none;
    background: #0b6dbd;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 18px;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(0,0,0,.25);
    white-space: nowrap;
}

/* تفتح لفوق */
.floating-icons {
    position: absolute;
    bottom: 60px;                /* فوق الزر */
    right: 50%;
    transform: translateX(50%) translateY(10px);
    display: flex;
    flex-direction: column;
    gap: 8px;
    opacity: 0;
    pointer-events: none;
    transition: all .2s ease;
}

/* شكل الأيقونات داخل دوائر */
.fc-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,.2);
    text-decoration: none;
    color: #fff;
    font-size: 20px;
}

/* ألوان مثل الصورة المرفقة */
.fc-whatsapp { background: #25d366; }
.fc-phone    { background: #00c853; }
.fc-mail     { background: #ff5252; }

/* إظهار عند الفتح */
.floating-contact.open .floating-icons {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(50%) translateY(0);
}

/* موبايل: نفس الركن تقريبًا */
@media (max-width: 767px) {
    .floating-contact {
        right: 12px;
        bottom: 16px;
    }
}
/* زر Contact Sales كمستطيل أزرق على الجانب */
.floating-contact .floating-main-btn {
    background: #0b6dbd;
    color: #fff;
    border: none;
    cursor: pointer;

    /* شكل مستطيل بحواف بسيطة */
    border-radius: 8px 0 0 8px !important;
    padding: 10px 18px !important;
    width: auto !important;
    height: auto !important;

    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;

    box-shadow: 0 6px 18px rgba(0,0,0,.25);
}
/* إصلاح موضع أيقونات Contact Sales على الديسكتوب */

/* الحاوية */
.floating-contact {
    position: fixed;
    right: 16px;
    bottom: 24px;
    z-index: 9999;
}

/* زر Contact Sales كمستطيل */
.floating-contact .floating-main-btn {
    border-radius: 8px 0 0 8px !important;
    padding: 10px 18px !important;
    background: #0b6dbd;
    color: #fff;
    font-weight: 700;
    border: none;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0,0,0,.25);
}

/* الأيقونات: فوق الزر وبمسافة صغيرة */
.floating-contact .floating-icons {
    position: absolute !important;
    top: auto !important;
    bottom: 54px !important;          /* قربناها من الزر */
    right: 50% !important;
    transform: translateX(50%) !important;

    display: flex;
    flex-direction: column;
    gap: 6px;                          /* مسافة صغيرة بين الأيقونات */
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
}

.floating-contact.open .floating-icons {
    opacity: 1;
    pointer-events: auto;
}

/* شكل الأيقونات الدائرية */
.floating-contact .fc-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,.2);
    color: #fff;
    font-size: 20px;
    text-decoration: none;
}

/* ألوان كل أيقونة (كما هي) */
.fc-whatsapp { background: #25d366; }
.fc-phone    { background: #00c853; }
.fc-mail     { background: #ff5252; }

/* موبايل: نفس المكان تقريبًا */
@media (max-width: 767px) {
    .floating-contact {
        right: 12px;
        bottom: 16px;
    }
}
/* ===== Fix Floating Contact Sales position ===== */

/* الزر نفسه */
.floating-contact {
    position: fixed !important;
    right: 16px !important;
    bottom: 24px !important;
    z-index: 9999 !important;
}

.floating-contact .floating-main-btn {
    border-radius: 8px 0 0 8px !important;
    padding: 10px 18px !important;
    background: #0b6dbd !important;
    color: #fff !important;
    font-weight: 700 !important;
    border: none !important;
    white-space: nowrap !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.25) !important;
}

/* الأيقونات: فوق الزر بمسافة صغيرة، بدون ترانسفورمات غريبة */
.floating-icons {
    position: absolute !important;
    top: auto !important;
    bottom: 52px !important;     /* 52px فوق الزر تقريبًا */
    right: 0 !important;
    transform: none !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;

    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
}

/* عند الفتح */
.floating-contact.open .floating-icons {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
}

/* شكل الأيقونات الدائرية */
.floating-icons .fc-icon {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.2) !important;
    color: #fff !important;
    font-size: 20px !important;
    text-decoration: none !important;
}

/* ألوان كما هي */
.fc-whatsapp { background: #25d366 !important; }
.fc-phone    { background: #00c853 !important; }
.fc-mail     { background: #ff5252 !important; }

/* موبايل: نفس الركن لكن أقرب للحافة */
@media (max-width: 767px) {
    .floating-contact {
        right: 12px !important;
        bottom: 16px !important;
    }
}
/* ===== Contact Sales FAB ===== */

.contact-fab {
    position: fixed;
    right: 16px;
    bottom: 24px;
    z-index: 9999;
    font-family: inherit;
}

/* زر مستطيل أزرق على طرف الشاشة */
.contact-fab__toggle {
    background: #0b6dbd;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 8px 0 0 8px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0,0,0,.25);
}

/* حاوية الأيقونات – فوق الزر بمسافة صغيرة */
.contact-fab__icons {
    position: absolute;
    bottom: 52px;              /* فوق الزر مباشرة تقريبًا */
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
    transform: translateY(6px);
}

/* ظهور الأيقونات عند الفتح */
.contact-fab.contact-fab--open .contact-fab__icons {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

/* شكل كل أيقونة (دائرة) */
.contact-fab__icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0,0,0,.2);
    color: #fff;
    font-size: 20px;
}

/* ألوان الأيقونات */
.contact-fab__icon--whatsapp { background: #25d366; }
.contact-fab__icon--phone    { background: #00c853; }
.contact-fab__icon--mail     { background: #ff5252; }

/* موبايل: الزر أقرب للحافة */
@media (max-width: 767px) {
    .contact-fab {
        right: 12px;
        bottom: 16px;
    }
}
/* ===== Fix Contact Sales FAB on mobile ===== */
@media (max-width: 767px) {

  /* موضع البلوك بالكامل: أسفل يمين الشاشة */
  .contact-fab {
      position: fixed !important;
      right: 12px !important;
      left: auto !important;
      bottom: 16px !important;
      top: auto !important;
      z-index: 9999 !important;
  }

  /* زر Contact Sales شكله كبسولة زرقاء صغيرة */
  .contact-fab__toggle {
      display: inline-block !important;
      background: #0b6dbd !important;
      color: #fff !important;
      border: none !important;
      border-radius: 999px !important;
      padding: 8px 14px !important;
      font-size: 12px !important;
      font-weight: 700 !important;
      white-space: nowrap !important;
      box-shadow: 0 4px 12px rgba(0,0,0,.25) !important;
      width: auto !important;
  }

  /* الأيقونات: فوق الزر مباشرة، عمودية */
  .contact-fab__icons {
      position: absolute !important;
      bottom: 50px !important;   /* فوق الزر بمسافة صغيرة */
      right: 0 !important;
      left: auto !important;
      top: auto !important;
      transform: none !important;

      display: flex !important;
      flex-direction: column !important;
      gap: 6px !important;
      opacity: 0;
      pointer-events: none;
      transition: opacity .2s ease !important;
  }

  .contact-fab.contact-fab--open .contact-fab__icons {
      opacity: 1 !important;
      pointer-events: auto !important;
  }

  /* شكل الأيقونات الدائرية الملونة */
  .contact-fab__icon {
      width: 42px !important;
      height: 42px !important;
      border-radius: 50% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      box-shadow: 0 4px 10px rgba(0,0,0,.2) !important;
      text-decoration: none !important;
      font-size: 20px !important;
      color: #fff !important;
  }

  .contact-fab__icon--whatsapp { background: #25d366 !important; }
  .contact-fab__icon--phone    { background: #00c853 !important; }
  .contact-fab__icon--mail     { background: #ff5252 !important; }
}
/* تثبيت زر Contact Sales على الموبايل ومنعه من الاختفاء */
@media (max-width: 767px) {
  .contact-fab {
      position: fixed !important;
      right: 12px !important;
      bottom: 16px !important;

      display: block !important;
      opacity: 1 !important;
      visibility: visible !important;

      animation: none !important;   /* إلغاء أي أنيميشن من القالب */
      transition: none !important;  /* إلغاء أي ترانزيشن يعمل فلاش */
      z-index: 9999 !important;
  }

  .contact-fab__toggle {
      display: inline-block !important;
      background: #0b6dbd !important;
      color: #fff !important;
      border: none !important;
      border-radius: 999px !important;
      padding: 8px 14px !important;
      font-size: 12px !important;
      font-weight: 700 !important;
      white-space: nowrap !important;
      box-shadow: 0 4px 12px rgba(0,0,0,.25) !important;
  }
}

html, body {
    overflow-x: hidden !important;   /* منع السكروول الأفقي والفراغ الأبيض */
}html, body {
    overflow-x: hidden !important;   /* منع السكروول الأفقي والفراغ الأبيض */
}
/* Tooltip بسيط لاسم الأيقونة */
.contact-fab__icon {
    position: relative;
}

.contact-fab__icon::after {
    content: attr(data-label);
    position: absolute;
    right: 52px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.8);
    color: #fff;
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease;
}

.contact-fab__icon:hover::after {
    opacity: 1;
}
/* Tooltip لأسماء أيقونات Contact Sales */
.contact-fab__icon {
    position: relative;
}

.contact-fab__icon::after {
    content: attr(data-label);
    position: absolute;
    right: 52px;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.8);
    color: #fff;
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease;
}

.contact-fab__icon:hover::after {
    opacity: 1;
}
.contact-fab__toggle .contact-fab__text {
    display: inline-block;
    min-width: 90px;
    text-align: center;
}
/* ===== Tooltips for Contact FAB icons ===== */
.contact-fab__icon {
    position: relative;
}

/* الفقاعة التي تظهر عند الإشارة */
.contact-fab__icon::after {
    content: attr(data-label);
    position: absolute;
    right: 110%;                  /* على يمين الأيقونة */
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.8);
    color: #fff;
    font-size: 11px;
    padding: 3px 6px;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease, transform .15s ease;
    z-index: 10000;
}

/* عند الـ hover تظهر الفقاعة */
.contact-fab__icon:hover::after {
    opacity: 1;
    transform: translateY(-50%) translateX(-4px);
}

/* مثلث صغير (سهم) يشير للأيقونة */
.contact-fab__icon::before {
    content: "";
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: transparent rgba(0,0,0,0.8) transparent transparent;
    opacity: 0;
    transition: opacity .15s ease;
}

.contact-fab__icon:hover::before {
    opacity: 1;
}
.tools-bg.mission-hero .offer-card,
.tools-bg.mission-hero .offer-card h3,
.tools-bg.mission-hero .offer-card p {
    color: #333 !important;
}

.tools-bg.mission-hero .offer-card h3 {
    color: #0070b8 !important;
}

.tools-bg.mission-hero .offer-card {
    background: #ffffff;
    border-radius: 12px;
    padding: 25px 20px;
    margin-bottom: 30px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}