/* ==========================================================================
   stat-counter.css — عدّاد الإحصائيات (Stat counter)
   شركة السرعة المطلقة | كل القيم من tokens.css — RTL.
   أرقام كبيرة + تسمية: +50 / +50,000 / +25,000 / 85% (الرئيسية / من نحن)
   خطّاف data-target اختياري للعدّ التصاعدي عبر JS (Batch 7)
   WC-NOTE: ثابت (static)
   ========================================================================== */

.stat-counter {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-8);
  text-align: center;
}
/* الرقم الكبير — يقرأ JS قيمة data-target للعدّ التصاعدي.
   شبح (::before) يحجز العرض النهائي حتى لا يتغيّر العرض أثناء العدّ. */
.stat-counter__number {
  position: relative;
  display: inline-block;
  font-size: var(--fs-hero);
  font-weight: var(--fw-extrabold);
  line-height: normal;
  color: var(--color-primary);
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}

/* الرقم نفسه (أرقام لاتينية) متطابق بين اللغتين، لكن تسمية الإحصائية
   الإنجليزية أطول من العربية عادة، فيضيق عمود العدّاد ويكسر الرقم لسطرين
   عند --fs-hero. تصغير الخط قليلًا للإنجليزي فقط بدل تغيير التخطيط. */
[dir="ltr"] .stat-counter__number {
  font-size: var(--fs-5xl);
}
@media (max-width: 479px) {
  [dir="ltr"] .stat-counter__number {
    font-size: var(--fs-title-lg);
  }
}
.stat-counter__number::before {
  content: attr(data-final);
  visibility: hidden;
}
.stat-counter__count {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stat-counter__label {
  font-size: var(--fs-section-cta);
  font-weight: var(--fw-medium);
  color: var(--color-text);
  text-transform: uppercase;
}