/* ===================================================================
   CORE VARIABLES & UTILITIES
   ===================================================================*/
:root {
  --main-color: #0E592F;
  --blue-color: #224573;
  --white-color: #F2F2F2;
  --black-color: #0D0D0D;
  --gray-Color: #B0B3B8;
  --footer-color: #E6F8FF;
}

.text-main   { color: var(--main-color) !important; }
.bg-main     { background: var(--main-color) !important; color:#fff; }
.border-main { border-color: var(--main-color) !important; }

/* ===================================================================
   PAGES (GENERAL NOTE)
   ===================================================================*/
/*
================================
            pages
================================
*/

/* ===================================================================
   HOME – HERO / SLIDER
   ===================================================================*/
    /* ارتفاع مرن للسلايدر */
    .hero-slider .carousel-item{
      position: relative;
      height: clamp(180px, 45vw, 620px); /* موبايل ← دِسكتوب */
      overflow: hidden;                  /* قصّ الزوائد */
    }
    @media (max-width: 576px){
      .hero-slider .carousel-item{ height: 230px; } /* موبايل */
    }
  
    /* خلي الصورة تغطي كامل الإطار */
    .hero-img{
      width: 100%;
      height: 100%;
      object-fit: cover;         /* أهم سطر: تغطية مع قصّ */
      object-position: center;   /* تمركز القصّ */
      display: block;
    }
  
    /* اختياري: قلّل أي فراغ أسفل السلايدر */
    .hero-slider { margin-bottom: 0; }

.hero-ctrl .dot{
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%;
  width:44px; height:44px;
  background:#198754;          /* نفس الأخضر */
  box-shadow:0 4px 12px rgba(0,0,0,.2);
}
.carousel-control-prev.hero-ctrl{ left:.5rem; }
.carousel-control-next.hero-ctrl{ right:.5rem; }

/* شوية تصغير بالموبايل جدًا */
@media (max-width: 400px){
  .hero-ctrl .dot{ width:38px; height:38px; }
  /* لو عندك ويدجِت عائم يمين الشاشة وحابّة تبعديه عن السهم:
     .carousel-control-next.hero-ctrl{ right:3.5rem; } */
}

/* مؤشرات أسفل */
#heroCarousel .carousel-indicators{ bottom:8px; }
#heroCarousel .carousel-indicators [data-bs-target]{
  width:6px; height:6px; border-radius:50%;
}

   /* ----- Mobile toggler style (like img #3) ----- */
   .btn-menu{
    width: 48px; height: 40px; background:#fff; border:1px solid #e8e8e8;
    border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,.06);
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  }
  .btn-menu .menu-line{ display:block; width:22px; height:2px; background:#666; border-radius:2px; }
  
  /* ----- Offcanvas links ----- */
  .mobile-link{ display:flex; align-items:center; padding:.6rem .2rem; font-weight:600; color:#1f2937; text-decoration:none; }
  .mobile-link:hover{ color:#198754; }
  .mobile-collapse{ background:#f8f9fa; border:1px solid #eaeaea; }
  .mobile-sublink{ display:block; padding:.35rem 0; color:#374151; text-decoration:none; }
  .mobile-sublink:hover{ color:#198754; }
  
  /* ----- Bottom nav (like img #4) ----- */
  .mobile-bottom-nav{
    position:fixed; left:0; right:0; bottom:0; z-index:1050;
    background:#fff; border-top:1px solid rgba(25,135,84,.2);
    box-shadow:0 -8px 24px rgba(0,0,0,.08);
    display:flex; justify-content:space-around; align-items:center; padding:10px 10px 14px;
  }
  .mb-item{ flex:1; text-align:center; text-decoration:none; color:#334155; font-size:.78rem; }
  .mb-item i{ display:block; font-size:1.1rem; margin-bottom:4px; }
  .mb-item.active{ color:#198754; }
  
  
  
  /* مساحة تحت للمحتوى عشان ما يغطيه الشريط السفلي */
  @media (max-width: 1199.98px){
    body{ padding-bottom:84px; }
  }


/* ===================================================================
   HOME – COUNTERS
   ===================================================================*/
.stat-icon{font-size:56px; color:rgba(0,0,0,.35)}
.stat-number{font-size:52px; line-height:1}
@media (max-width: 575.98px){
  .stat-icon{font-size:48px}
  .stat-number{font-size:38px}
}

/* ===================================================================
   NEWS – HERO (INDEX + SHOW)
   ===================================================================*/
.news-hero{ position: relative; overflow: hidden; min-height: 1px; }
.news-hero .hero-img{
  height: var(--h, 260px);
  background-image: none;
  background-size: cover; background-repeat: no-repeat;
  background-position: center var(--pos, 50%); display: block;
}
.news-hero .hero-overlay{
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.70) 70%);
  pointer-events: none;
}
.news-hero > .container{ position: relative; z-index: 2; }
.news-hero .hero-title{ text-shadow: 0 10px 30px rgba(0,0,0,.35); }

.hero-meta{
  color: rgba(255,255,255,.98);
  font-weight: 600; letter-spacing: .1px;
  text-shadow: 0 1px 2px rgba(0,0,0,.45);
}
.hero-meta i{ opacity: .95; filter: drop-shadow(0 1px 1px rgba(0,0,0,.3)); }

@media (max-width:575.98px){ .news-hero{ padding: 36px 0; } }

/* ===================================================================
   NEWS – LIST PAGE LAYOUT & WIDGETS
   ===================================================================*/
.news-page { --brand: #224573; }
.news-page .sticky-aside { position: sticky; top: 90px; }
@media (max-width: 991.98px){ .news-page .sticky-aside { position: static; } }

.news-page .cat-card { border-radius: .75rem; overflow: hidden; }
.news-page .cat-head { background: var(--brand); }
.news-page .cat-list .list-group-item{
  border-color: rgba(0,0,0,.06);
  padding: .75rem .95rem;
  transition: background .15s, color .15s;
}
.news-page .cat-list .list-group-item:hover{
  background: rgba(34,69,115,.06);
  color: var(--brand);
}
.news-page .cat-list i{ transition: transform .15s; }
.news-page .cat-list .list-group-item:hover i{ transform: translateX(2px); }

/* CTA card */
.news-page .cta-card{
  background: var(--brand);
  border-radius: .75rem; min-height: 270px;
}
.news-page .cta-card .cta-bg{
  position: absolute; inset: 0;
  background: url('/images/cta_building.jpg') center/cover no-repeat;
  opacity: 0.18; pointer-events: none;
}
.news-page .icon-wrap{
  width: 72px; height: 72px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.08);
  border: 2px solid rgba(255,255,255,.15);
}
.news-page .icon-wrap i{ font-size: 28px; }

/* News cards */
.news-card{ transition: box-shadow .2s ease; }
.news-card:hover{ box-shadow: 0 1rem 2rem rgba(0,0,0,.08); }
.news-title{ line-height: 1.25; }
.hover-underline:hover{ text-decoration: underline; }
.line-clamp-2{
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Pagination */
.pagination-gap .page-link{
  border: 0; width: 42px; height: 42px; border-radius: 50% !important;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 14px rgba(25,135,84,.15);
  color: #198754;
}
.pagination-gap .page-item.active .page-link{ background: #198754; color: #fff; }

/* Utilities */
.bg-cover{ background-position: center; background-size: cover; background-repeat: no-repeat; }
.aside-stick .btn{ box-shadow: 0 8px 20px rgba(0,0,0,.06); }

/* Article typography */
.prose :where(h2,h3){
  margin-top: 1.25rem; margin-bottom: .75rem;
  font-weight: 700; color: #1f2937;
}
.prose p{ color: #6b7280; line-height: 1.9; margin: .8rem 0; }
.prose ul, .prose ol{ margin: .75rem 1.25rem; color: #4b5563; }
.prose blockquote{
  border-inline-start: 4px solid var(--brand);
  padding: .75rem 1rem; margin: 1rem 0;
  background: #f7fafc; color: #374151; border-radius: .5rem;
}
.prose img{ max-width: 100%; height: auto; border-radius: .75rem; }

/* RTL fixes */
.prose[dir="rtl"]{ direction: rtl; text-align: right; }
.prose[dir="rtl"] h1, .prose[dir="rtl"] h2, .prose[dir="rtl"] h3,
.prose[dir="rtl"] h4, .prose[dir="rtl"] h5, .prose[dir="rtl"] h6,
.prose[dir="rtl"] p, .prose[dir="rtl"] ul, .prose[dir="rtl"] ol,
.prose[dir="rtl"] blockquote { text-align: right; }
.prose[dir="rtl"] ul, .prose[dir="rtl"] ol{
  margin: .75rem 0 .75rem 1.25rem;
  padding-inline-start: 0; padding-inline-end: 1.25rem;
}
.prose[dir="rtl"] blockquote{
  border-inline-start: 0; border-inline-end: 4px solid var(--brand);
}
.prose[dir="rtl"] [style*="text-align:left"],
.prose[dir="rtl"] [style*="text-align: left"]{ text-align: right !important; }

/* ===================================================================
   FOOTER (NEO)
   ===================================================================*/
.neo-footer{
  --bg1:#0c1320; --bg2:#0f1a2a; --brand:#224573; --accent:#0E592F;
  --soft:#B0B3B8; --glass: rgba(255,255,255,.06); --glass-brd: rgba(255,255,255,.18);
  position:relative; overflow:hidden; isolation:isolate;
  background:
    radial-gradient(1100px 380px at 12% -12%, rgba(34,69,115,.35), transparent 60%),
    radial-gradient(900px 300px  at 88% -10%, rgba(14,89,47,.30),  transparent 62%),
    linear-gradient(180deg, var(--bg1) 0%, var(--bg2) 60%, var(--bg1) 100%);
}
/* شبكة خفيفة */
.neo-footer .nf-grid{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    repeating-linear-gradient(to right, transparent 0 23px, rgba(255,255,255,.05) 23px 24px),
    repeating-linear-gradient(to bottom, transparent 0 23px, rgba(255,255,255,.05) 23px 24px);
  mix-blend-mode: overlay; opacity:.4;
}
/* بقع لونية متحركة */
.neo-footer .nf-blob{
  position:absolute; inset:-30%; z-index:0; pointer-events:none;
  filter: blur(90px) saturate(120%); animation: nf-spin 28s linear infinite;
}
.neo-footer .nf-blob-1{
  background: conic-gradient(from 0deg,
    rgba(34,69,115,.70), rgba(14,89,47,.55), rgba(176,179,184,.35), rgba(34,69,115,.70));
  transform-origin: 30% 30%;
}
.neo-footer .nf-blob-2{
  background: conic-gradient(from 120deg,
    rgba(14,89,47,.50), rgba(34,69,115,.60), rgba(176,179,184,.30), rgba(14,89,47,.50));
  transform-origin: 70% 40%; animation-duration: 35s;
}
@keyframes nf-spin { to { transform: rotate(1turn); } }
/* فينييت */
.neo-footer .nf-vignette{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(120% 140% at 50% 110%, rgba(0,0,0,.35), transparent 55%) no-repeat,
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.38) 85%);
}
/* شريط CTA */
.neo-footer .nf-cta{
  position:relative; z-index:1; border-bottom: 1px solid rgba(255,255,255,.10);
  padding: 14px 0;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  backdrop-filter: blur(4px);
}
.neo-footer .nf-cta .fa-bolt-lightning{ color:#FFD85B; }
/* كروت زجاجية */
.neo-footer .nf-card{
  position:relative; z-index:1; background: var(--glass); border:1px solid var(--glass-brd);
  border-radius: 18px; padding: 20px 18px; box-shadow: 0 10px 30px rgba(0,0,0,.15);
  backdrop-filter: blur(8px);
}
.neo-footer .nf-logo{ filter: drop-shadow(0 2px 6px rgba(0,0,0,.35)); }
.neo-footer .nf-subtitle{
  font-weight: 800; letter-spacing:.4px; text-transform: uppercase;
  color:#dfe7ef; font-size:.9rem;
}
.neo-footer .nf-list{ list-style:none; padding:0; margin:0; }
.neo-footer .nf-list li{ margin:.25rem 0; }
.neo-footer .nf-list a{ color:#dfe7ef; text-decoration:none; }
.neo-footer .nf-list a:hover{ color:#fff; text-decoration:underline; }
/* عناصر تواصل */
.neo-footer .nf-contact-item{
  display:flex; align-items:center; gap:.6rem;
  padding:.55rem 0; border-bottom:1px dashed rgba(255,255,255,.12);
}
.neo-footer .nf-contact-item i{ opacity:.9; }
/* حقل النشرة */
.neo-footer .nf-input{
  align-items:center; background: rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2);
  border-radius:14px; padding:6px 8px;
}
.neo-footer .nf-input-icon{
  width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
  background: rgba(255,255,255,.10);
}
.neo-footer .nf-input-field{ background:transparent; border:0; color:#fff; }
.neo-footer .nf-input-field::placeholder{ color:rgba(255,255,255,.65); }
/* سوشيال */
.neo-footer .nf-social{
  width:36px; height:36px; border-radius:10px; display:grid; place-items:center;
  background: rgba(255,255,255,.10); color:#fff; text-decoration:none;
  border:1px solid rgba(255,255,255,.2);
}
.neo-footer .nf-social:hover{ background: rgba(255,255,255,.18); }
/* أسفل الفوتر */
.neo-footer .nf-bottom{
  position:relative; z-index:1;
  border-top:1px solid rgba(255,255,255,.12);
}
/* تقليل الحركة */
@media (prefers-reduced-motion: reduce){ .neo-footer .nf-blob{ animation:none; } }

/* ===================================================================
   NEWS – CARD IMAGE LAYOUT (RESPONSIVE)
   ===================================================================*/
.news-card{ align-items: stretch; }
.news-thumb{ width: 100%; }
.news-thumb .ratio{ --bs-aspect-ratio: 75%; }        /* 4:3 للموبايل */
.news-thumb img{
  width:100%; height:100%; object-fit: contain; background:#f6f8fa;
}
@media (min-width: 768px){
  .news-thumb{ width:300px; flex:0 0 300px; }        /* ثابت */
  .news-thumb .ratio{ --bs-aspect-ratio: 56.25%; }   /* 16:9 */
  .news-thumb img{ object-fit: cover; }
}

/* ===================================================================
   PRODUCT CATEGORIES – PROMO CARDS
   ===================================================================*/
:root { --brand:#13795b; }
.pcat-card{ position:relative; display:block; border-radius:14px; overflow:hidden; height:360px; background:#f3f5f7; }
.pcat-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.pcat-mask{ position:absolute; inset:0; background:rgba(0,0,0,0); transition:background .35s ease; }
.pcat-diag{ position:absolute; top:0; right:-8%; width:62%; height:100%; background:rgba(19,121,91,.20); transform:skewX(-16deg); opacity:0; transition:opacity .35s ease; }
.pcat-prod{
  position:absolute; right:7%; bottom:110px; width:55%; max-width:420px; max-height:70%; object-fit:contain;
  transform:translateY(8px) scale(1); filter:drop-shadow(0 12px 20px rgba(0,0,0,.22));
  transition:transform .4s cubic-bezier(.2,.6,.2,1), filter .4s ease;
}
.pcat-title{
  position:absolute; top:18px; left:22px; color:#fff; font-weight:700; letter-spacing:.2px;
  opacity:0; transform:translateY(-6px); transition:.35s ease; z-index:2;
}
.pcat-title::before{ content:""; display:inline-block; width:18px; height:2px; background:#fff; margin-inline-end:10px; vertical-align:middle; }
.pcat-cta{
  position:absolute; left:22px; right:22px; bottom:22px; border-radius:12px; padding:18px 20px; background:rgba(255,255,255,.92);
  color:#1b1f23; display:flex; align-items:center; justify-content:space-between; box-shadow:0 10px 26px rgba(0,0,0,.12);
  transform:translateY(14px); transition:transform .35s ease, background .3s ease, color .3s ease; z-index:2;
}
.pcat-cta .arrow{ width:42px; height:42px; border-radius:50%; background:rgba(0,0,0,.06); display:flex; align-items:center; justify-content:center; }

.pcat-card:hover .pcat-bg{ transform:scale(1.03); }
.pcat-card:hover .pcat-mask{ background:rgba(0,0,0,.28); }
.pcat-card:hover .pcat-diag{ opacity:1; }
.pcat-card:hover .pcat-title{ opacity:1; transform:none; }
.pcat-card:hover .pcat-prod{ transform:translateY(0) scale(1.1); filter:drop-shadow(0 18px 28px rgba(0,0,0,.35)); }
.pcat-card:hover .pcat-cta{ transform:translateY(0); background:var(--brand); color:#fff; }
.pcat-card:hover .pcat-cta .arrow{ background:#fff; color:#6c757d; }
.pcat-card:focus-visible{ outline:3px solid var(--brand); outline-offset:2px; }
@media (max-width: 576px){ .pcat-card{height:280px} .pcat-prod{width:60%;} }

/* ===================================================================
   HOME – HOT PRODUCTS SLIDER
   ===================================================================*/
.hot-card{border-radius:12px; overflow:hidden; transition:transform .25s, box-shadow .25s}
.hot-card:hover{transform:translateY(-3px); box-shadow:0 10px 24px rgba(0,0,0,.12)}
.hot-img-wrap{height:220px; display:flex; align-items:center; justify-content:center}
.hot-img{max-height:200px; object-fit:contain}
.hot-desc{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}

.hot-slider{position:relative; overflow:hidden;} /* مهم: يمنع سكرول أفقي */
.hot-track{display:flex; align-items:stretch; gap:1.25rem; transition:transform .6s ease; will-change:transform}
.hot-item{flex:0 0 25%}                 /* 4 على الديسكتوب */
@media (max-width: 991.98px){ .hot-item{flex-basis:50%} }   /* 2 على التابلت */
@media (max-width: 575.98px){ .hot-item{flex-basis:100%} }  /* 1 على الموبايل */

.hot-arrow{position:absolute; top:50%; transform:translateY(-50%); z-index:5}
.hot-arrow .btn{width:48px; height:48px}
.hot-arrow-start{inset-inline-start:-.25rem}
.hot-arrow-end{inset-inline-end:-.25rem}

/* ===================================================================
   SOLUTIONS – GRID / CARDS (INDEX)
   ===================================================================*/
.sol-card { transition: transform .25s ease; }
.sol-card:hover { transform: translateY(-4px); }

.sol-card-img{
  position: relative; border-radius: 14px; overflow: hidden;
  aspect-ratio: 4/3; background: #f7f7f7;
}
.sol-card-img img{
  width: 100%; height: 100%; object-fit: cover; display:block;
  filter: saturate(1.02); transition: transform .35s ease;
}
.sol-card:hover .sol-card-img img{ transform: scale(1.04); }

.sol-mask{
  position:absolute; inset:0; background:#224573; opacity: 0; transition: opacity .25s ease;
}
.sol-card:hover .sol-mask{ opacity: .35; }  /* نسبة الشفافية على الهوفر */

.sol-title{
  text-align:center; font-weight: 700;
  font-size: clamp(1rem, 1.2vw + .6rem, 1.25rem); color:#1f2937; margin-top: .85rem;
}

.object-fit-cover{ object-fit: cover; }

/* NOTE: هذه القاعدة ستُستبدل لاحقًا بقيمة مختلفة أدناه (انتبهي للّون/الشفافية) */
.sol-card .sol-overlay{
  position:absolute; inset:0; opacity:0; transition:.25s ease;
}

/* ===================================================================
   SOLUTION – HERO & PRODUCTS STRIP (SHOW)
   ===================================================================*/
.solution-hero-img{
  min-height: 260px; background-position:center; background-size:cover; background-repeat:no-repeat;
}
@media (max-width: 575.98px){ .solution-hero-img{ min-height: 180px; } }

/* Banner */
.sol-hero{ min-height:220px; display:flex; align-items:end; overflow:hidden; z-index:0; }
.sol-hero .hero-bg{ position:absolute; inset:0; z-index:0; filter:saturate(105%); }
.sol-hero .hero-overlay{
  position:absolute; inset:0; z-index:0;
  background:
    linear-gradient(135deg, rgba(34,69,115,.75) 0%, rgba(14,89,47,.45) 45%, rgba(176,179,184,.18) 60%, rgba(34,69,115,.40) 100%),
    linear-gradient(180deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,.65) 75%);
}

/* Carousel (responsive) */
.sol-prods{
  display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:.5rem;
}
.sol-card{
  flex:0 0 280px; scroll-snap-align:start; background:#fff;
  border:1px solid #eee; border-radius:16px; overflow:hidden;
  transition:.2s transform,.2s box-shadow;
}
.sol-card:hover{ transform:translateY(-3px); box-shadow:0 10px 30px rgba(0,0,0,.08); }
.sol-thumb{ position:relative; background:#f7f7f7; }
.sol-thumb img{ width:100%; height:200px; object-fit:contain; display:block; }

/* هذه نسخة ثانية من .sol-overlay بلون وشفافية مختلفين (ستأخذ الأولوية لأنها لاحقة) */
.sol-overlay{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:#224573CC; opacity:0; transition:.2s;
}
.sol-card:hover .sol-overlay{ opacity:1; }
.sol-overlay i{ color:#fff; font-size:22px; }

/* Scrollbar */
.sol-prods::-webkit-scrollbar{ height:8px; }
.sol-prods::-webkit-scrollbar-thumb{ background:#e2e8f0; border-radius:999px; }

/* ===================================================================
   PRODUCT – SHOW PAGE
   ===================================================================*/
.prod-hero{min-height:220px;display:flex;align-items:end;overflow:hidden;z-index:0}
.prod-hero .hero-bg{position:absolute;inset:0;background:center/cover no-repeat;filter:blur(8px) brightness(.75)}
.prod-hero .hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.65) 75%)}

.thumb-btn{transition:.15s}
.thumb-btn.active, .thumb-btn:hover{outline:2px solid #198754}

/* Hover overlay – عام */
.hover-overlay{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:#224573CC; opacity:0; transition:.18s; color:#fff; font-size:22px
}
.rel-card .hover-overlay{background:#224573CC}
.rel-card .ratio:hover .hover-overlay{opacity:1}

/* جدول المواصفات */
.spec-table th{ background:#fafafa; font-weight:600; }
.spec-table td, .spec-table th{ border-color:#eee; }


/* ===================================================================
   video – PAGE
   ===================================================================*/

.video-hero{
  min-height: 220px;
  background: center/cover no-repeat;
  filter: saturate(105%);
}
.v-card{
  border-radius:14px; overflow:hidden; position:relative; background:#fff;
  transform: translateY(10px); opacity:.0; transition: .5s ease;
}
.v-card.in-view{ transform:none; opacity:1; }
.v-thumb{ aspect-ratio: 16 / 9; width:100%; object-fit:cover; display:block; }
.v-body{ padding:14px 14px 16px; }
.v-title{ font-weight:700; line-height:1.25; }
.v-meta{ font-size:.85rem; color:#6b7280; }

.v-play{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background: linear-gradient(0deg, rgba(0,0,0,.35), rgba(0,0,0,.15));
  opacity:0; transition:.25s ease;
}
.v-card:hover .v-play{ opacity:1; }
.v-btn{
  width:64px; height:64px; border-radius:50%; background:#fff; display:flex;
  align-items:center; justify-content:center; box-shadow:0 10px 26px rgba(0,0,0,.2);
}
.v-btn i{ font-size:22px; color:#16a34a; margin-left:3px; }

/* ===== WhatsApp Floating Bubble ===== */
.wa-bubble{
  position: fixed;
  bottom: 22px;                /* ديسكتوب */
  right: 16px;                 /* فallback */
  inset-inline-end: 16px;      /* يحترم RTL/LTR تلقائيًا */
  z-index: 1060;               /* فوق معظم العناصر */
  width: 58px; height: 58px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  display: grid; place-items: center;
  text-decoration: none;
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}
.wa-bubble i{ font-size: 26px; line-height: 1; }
.wa-bubble:hover{
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 14px 30px rgba(0,0,0,.22);
  filter: saturate(1.05);
}

/* ===== OVERRIDE: WhatsApp bubble فوق زر الرجوع للأعلى — قيم مباشرة ===== */
.wa-bubble{
  bottom: 80px;          /* 52px ارتفاع زر الرجوع + 16px المارجن + 12px فراغ */
  inset-inline-end: 16px; /* نفس جهة الزر (تتوافق RTL/LTR) */
  z-index: 1060;
}

/* على الموبايل: ارفعها فوق الشريط السفلي */
@media (max-width: 1199.98px){
  .wa-bubble{
    bottom: calc(92px + env(safe-area-inset-bottom, 0px));
  }
}
/* اختياري: نبضة خفيفة */
@keyframes wa-pulse{
  0%{ box-shadow: 0 0 0 0 rgba(37,211,102,.45); }
  70%{ box-shadow: 0 0 0 14px rgba(37,211,102,0); }
  100%{ box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}
.wa-bubble.pulse{ animation: wa-pulse 2.2s infinite; }

/* Back to top: فوق شريط الموبايل ومرئي دائماً */
#btnBackToTop{
  z-index: 1060 !important;     /* يتغلب على z-3 */
  inset-inline-start: 16px;      /* الجهة المقابلة لفقاعة WhatsApp (التي عند inline-end) */
  bottom: 22px;                  /* ديسكتوب */
}

/* على الموبايل: ارفعه فوق شريط الأسفل بمسافة مريحة */
@media (max-width: 1199.98px){
  #btnBackToTop{
    bottom: calc(92px + 16px + env(safe-area-inset-bottom, 0px)) !important; /* 92px ارتفاع الشريط + 16px هامش */
  }
}


.partners-sec{ background:linear-gradient(180deg,#f8faf9 0,#ffffff 100%); }
.partner-card .partner-img{
  max-height:56px; transition:.25s; filter:grayscale(100%); opacity:.75;
}
.partner-card:hover .partner-img{ filter:none; opacity:1; }

  /* عنوان الشركاء: رمادي افتراضياً → أخضر عند التحويم */
  .partner-title{
    color: #6c757d;                 /* رمادي لطيف */
    transition: color .25s ease, text-shadow .25s ease;
  }
  .partner-title:hover{
    color: #198754;                 /* Bootstrap success */
    text-shadow: 0 0 .1rem rgba(25,135,84,.35);
  }

  /* لو بدك التلوين يحصل عند تحويم كامل السكشن: فعّل التالي وألغِ :hover فوق */
  /* .partners-sec:hover .partner-title{ color:#198754; text-shadow:0 0 .1rem rgba(25,135,84,.35);} */

  @media (prefers-reduced-motion: reduce){
    .partner-title{ transition: none; }
  }

    /* ضبط ارتفاع كرت الشعار وحجم الصورة */
    #clientsSlider .hot-card { min-height: 140px; }
    .client-logo{
      max-height: 100px; width:auto;
      filter: grayscale(1) contrast(.85);
      opacity:.75; transition:.25s ease;
    }
    .hot-item:hover .client-logo{ filter:none; opacity:1; transform:scale(1.02); }