/* Add custom JS code below */ 
<div class="elz-reviews" dir="rtl">

<style>
.elz-reviews{
  --bg:#071827;
  --card:#0d2b42;
  --card2:#123a55;
  --red:#e40032;
  --red2:#ff174d;
  --red3:#7d001d;
  --white:#f5f8fa;
  --muted:#8da5b5;
  font-family:inherit;
  width:100%;
  overflow:hidden;
  position:relative;
  padding:70px 0 65px;
  background:var(--bg);
}

.elz-reviews *{
  box-sizing:border-box;
}

/* الخط الفاصل */
.elz-divider{
  width:100%;
  height:1px;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.08),
    rgba(255,255,255,.15),
    rgba(255,255,255,.08),
    transparent
  );
  position:relative;
  margin-bottom:35px;
}

.elz-divider-diamonds{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 14px;
  background:var(--bg);
}

.elz-diamond{
  width:8px;
  height:8px;
  transform:rotate(45deg);
  border:1px solid rgba(255,255,255,.25);
  background:#102d42;
}

.elz-diamond.active{
  background:var(--red);
  border-color:#ff456c;
  box-shadow:
    0 0 8px rgba(228,0,50,.8),
    0 0 18px rgba(228,0,50,.35);
}

/* العنوان */
.elz-review-head{
  text-align:center;
  margin-bottom:34px;
}

.elz-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:8px 20px;
  border-radius:6px;
  background:linear-gradient(
    180deg,
    rgba(25,52,70,.95),
    rgba(12,35,51,.95)
  );
  border:1px solid rgba(228,0,50,.28);
  color:#ff5a7d;
  font-size:13px;
  font-weight:800;
  box-shadow:0 0 20px rgba(228,0,50,.06);
  margin-bottom:16px;
}

.elz-badge::before,
.elz-badge::after{
  content:"";
  width:6px;
  height:6px;
  background:var(--red);
  transform:rotate(45deg);
  box-shadow:0 0 7px rgba(228,0,50,.7);
}

/* الرقم */
.elz-number{
  text-align:center;
  margin-bottom:4px;
}

.elz-number strong{
  display:block;
  font-size:clamp(48px,6vw,72px);
  line-height:1;
  font-weight:900;
  letter-spacing:-2px;
  color:#eef5f8;
  text-shadow:
    0 0 18px rgba(255,255,255,.05);
}

.elz-number p{
  margin:8px 0 0;
  color:#d7e0e5;
  font-size:15px;
  font-weight:500;
}

/* الماسات تحت الرقم */
.elz-mini-diamonds{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:9px;
  margin:22px 0 25px;
}

.elz-mini-diamonds span{
  width:7px;
  height:7px;
  transform:rotate(45deg);
  border:1px solid rgba(255,255,255,.15);
  background:#112b3e;
}

.elz-mini-diamonds span:nth-child(4),
.elz-mini-diamonds span:nth-child(8),
.elz-mini-diamonds span:nth-child(12){
  background:var(--red);
  border-color:#ff5277;
  box-shadow:0 0 8px rgba(228,0,50,.65);
}

/* عنوان قالوا */
.elz-title{
  text-align:center;
  margin:0 0 25px;
  color:#fff;
  font-size:clamp(24px,3vw,31px);
  font-weight:900;
}

.elz-title span{
  color:#ff4c70;
}

/* منطقة السلايدر */
.elz-slider{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:10px 0 22px;
}

/* تدرج الأطراف */
.elz-slider::before,
.elz-slider::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:100px;
  z-index:5;
  pointer-events:none;
}

.elz-slider::before{
  right:0;
  background:linear-gradient(
    90deg,
    transparent,
    var(--bg)
  );
}

.elz-slider::after{
  left:0;
  background:linear-gradient(
    270deg,
    transparent,
    var(--bg)
  );
}

/* المسار */
.elz-track{
  display:flex;
  gap:12px;
  width:max-content;
  animation:elz-scroll 38s linear infinite;
  padding-right:25px;
}

.elz-track:hover{
  animation-play-state:paused;
}

@keyframes elz-scroll{
  from{
    transform:translateX(0);
  }
  to{
    transform:translateX(50%);
  }
}

/* البطاقة */
.elz-card{
  position:relative;
  width:230px;
  min-width:230px;
  height:185px;
  padding:20px 18px 16px;
  background:
    linear-gradient(
      145deg,
      rgba(20,58,82,.98),
      rgba(8,31,47,.98)
    );
  border:1px solid rgba(95,139,164,.28);

  /* قص الزوايا مثل التصميم */
  clip-path:polygon(
    0 0,
    calc(100% - 15px) 0,
    100% 15px,
    100% calc(100% - 15px),
    calc(100% - 15px) 100%,
    15px 100%,
    0 calc(100% - 15px)
  );

  box-shadow:
    inset 0 0 25px rgba(0,0,0,.12),
    0 8px 25px rgba(0,0,0,.12);

  transition:
    transform .3s ease,
    border-color .3s ease,
    box-shadow .3s ease;
}

.elz-card:hover{
  transform:translateY(-7px);
  border-color:rgba(228,0,50,.65);
  box-shadow:
    0 12px 35px rgba(228,0,50,.13),
    inset 0 0 25px rgba(228,0,50,.04);
}

/* لمعة حافة البطاقة */
.elz-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.07),
      transparent 28%,
      transparent 70%,
      rgba(228,0,50,.06)
    );
}

/* اسم العميل */
.elz-user{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:9px;
}

.elz-avatar{
  width:34px;
  height:34px;
  min-width:34px;
  display:flex;
  align-items:center;
  justify-content:center;

  background:
    linear-gradient(
      135deg,
      #ef1648,
      #78001c
    );

  color:#fff;
  font-size:13px;
  font-weight:900;

  clip-path:polygon(
    25% 0,
    75% 0,
    100% 25%,
    100% 75%,
    75% 100%,
    25% 100%,
    0 75%,
    0 25%
  );

  box-shadow:0 0 13px rgba(228,0,50,.18);
}

.elz-user-info{
  min-width:0;
}

.elz-name{
  display:block;
  color:#f4f8fa;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.elz-verified{
  display:flex;
  align-items:center;
  gap:4px;
  color:#ff5478;
  font-size:9px;
  margin-top:2px;
}

.elz-verified svg{
  width:10px;
  height:10px;
  stroke:#ff5478;
  fill:none;
  stroke-width:3;
}

/* النجوم */
.elz-stars{
  position:relative;
  z-index:2;
  color:#f5c84c;
  font-size:11px;
  letter-spacing:2px;
  margin-bottom:8px;
}

/* الكلام */
.elz-text{
  position:relative;
  z-index:2;
  margin:0;
  color:#dce6eb;
  font-size:11.5px;
  line-height:1.7;

  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* علامة الاقتباس */
.elz-quote{
  position:absolute;
  left:13px;
  bottom:2px;
  font-size:48px;
  line-height:1;
  font-weight:900;
  color:rgba(228,0,50,.10);
}

/* الخط السفلي */
.elz-bottom-divider{
  margin-top:35px;
  width:100%;
  height:1px;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.1),
    transparent
  );
}

/* الجوال */
@media(max-width:600px){

  .elz-reviews{
    padding:50px 0;
  }

  .elz-number strong{
    font-size:50px;
  }

  .elz-number p{
    font-size:13px;
  }

  .elz-title{
    font-size:24px;
  }

  .elz-card{
    width:215px;
    min-width:215px;
    height:180px;
  }

  .elz-track{
    gap:10px;
    animation-duration:30s;
  }

  .elz-slider::before,
  .elz-slider::after{
    width:45px;
  }
}
</style>


<!-- الفاصل العلوي -->
<div class="elz-divider">
  <div class="elz-divider-diamonds">
    <span class="elz-diamond"></span>
    <span class="elz-diamond active"></span>
    <span class="elz-diamond"></span>
  </div>
</div>


<!-- العنوان -->
<div class="elz-review-head">

  <div class="elz-badge">
    آراء العملاء
  </div>

  <div class="elz-number">
    <strong>55,000+</strong>
    <p>عميل اختار تجربة ELZ STORE</p>
  </div>

  <div class="elz-mini-diamonds">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <span></span>
  </div>

  <h2 class="elz-title">
    قالوا عن <span>متجرنا</span>
  </h2>

</div>


<!-- السلايدر -->
<div class="elz-slider">

  <div class="elz-track">


    <!-- 1 -->
    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ف</div>
        <div class="elz-user-info">
          <span class="elz-name">فرحان الكويكبي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        خدمه اسرررع من البرق انصحكم فيه
      </p>

      <span class="elz-quote">”</span>
    </div>


    <!-- 2 -->
    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ج</div>
        <div class="elz-user-info">
          <span class="elz-name">جواهر العطوي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        ذي ثاني مره اطلب من المتجر ماقد واجهتني اي مشكلة وسريعين بالتسليم
      </p>

      <span class="elz-quote">”</span>
    </div>


    <!-- 3 -->
    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ع</div>
        <div class="elz-user-info">
          <span class="elz-name">عبداللطيف السبيعي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        اسطوري ويردون بسرعة
      </p>

      <span class="elz-quote">”</span>
    </div>


    <!-- 4 -->
    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">A</div>
        <div class="elz-user-info">
          <span class="elz-name">Abdullah Alhashmi</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        تسليم فوري و تعامل رايق عشره على عشره
      </p>

      <span class="elz-quote">”</span>
    </div>


    <!-- 5 -->
    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ج</div>
        <div class="elz-user-info">
          <span class="elz-name">جايز السبيعي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        اسرع من البرق وافضل من الكل طرق
      </p>

      <span class="elz-quote">”</span>
    </div>


    <!-- 6 -->
    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">م</div>
        <div class="elz-user-info">
          <span class="elz-name">مؤيد عسيري</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        منتج جدًا رائع وسعر مناسب وتعامل الادارة راقي جدًا
      </p>

      <span class="elz-quote">”</span>
    </div>


    <!-- تكرار البطاقات حتى تكون الحركة مستمرة -->
    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ف</div>
        <div class="elz-user-info">
          <span class="elz-name">فرحان الكويكبي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        خدمه اسرررع من البرق انصحكم فيه
      </p>

      <span class="elz-quote">”</span>
    </div>


    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ج</div>
        <div class="elz-user-info">
          <span class="elz-name">جواهر العطوي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        ذي ثاني مره اطلب من المتجر ماقد واجهتني اي مشكلة وسريعين بالتسليم
      </p>

      <span class="elz-quote">”</span>
    </div>


    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ع</div>
        <div class="elz-user-info">
          <span class="elz-name">عبداللطيف السبيعي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        اسطوري ويردون بسرعة
      </p>

      <span class="elz-quote">”</span>
    </div>


    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">A</div>
        <div class="elz-user-info">
          <span class="elz-name">Abdullah Alhashmi</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        تسليم فوري و تعامل رايق عشره على عشره
      </p>

      <span class="elz-quote">”</span>
    </div>


    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">ج</div>
        <div class="elz-user-info">
          <span class="elz-name">جايز السبيعي</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        اسرع من البرق وافضل من الكل طرق
      </p>

      <span class="elz-quote">”</span>
    </div>


    <div class="elz-card">
      <div class="elz-user">
        <div class="elz-avatar">م</div>
        <div class="elz-user-info">
          <span class="elz-name">مؤيد عسيري</span>
          <span class="elz-verified">
            <svg viewBox="0 0 24 24">
              <path d="M4 12.5l5 5L20 6.5"/>
            </svg>
            عميل موثوق
          </span>
        </div>
      </div>

      <div class="elz-stars">★★★★★</div>

      <p class="elz-text">
        منتج جدًا رائع وسعر مناسب وتعامل الادارة راقي جدًا
      </p>

      <span class="elz-quote">”</span>
    </div>

  </div>
</div>


<!-- الفاصل السفلي -->
<div class="elz-bottom-divider"></div>

</div>