/* =========================================================
   stats-variants.css — الأرقام 2 و3 و4 (اختلاف بنيوي حقيقي)
   الألوان من متغيّرات الثيم. الأرقام 1 تستخدم style.css.
   يحافظ على .stat-number-big[data-target] ليعمل العدّاد.
   ========================================================= */

/* ============ الأرقام 2 — شريط أفقي داكن (Banner) ============ */
.stats-section--banner{
    background:linear-gradient(135deg,var(--teal-deep),var(--teal-dark) 60%,var(--teal));
    padding:56px 0;position:relative;overflow:hidden;
}
.stats-section--banner::before{content:'';position:absolute;inset:0;
    background:radial-gradient(circle,rgba(255,255,255,.05) 1.4px,transparent 1.4px);background-size:30px 30px;opacity:.5;}
.stats-section--banner .section-label{background:rgba(201,169,97,.16);color:var(--gold-light);border-color:rgba(201,169,97,.4);}
.stats-section--banner .section-title{color:#fff;}
.stats-section--banner .section-head.text-center .section-title::after{background:var(--gold-light);}
.st2-row{display:grid;grid-template-columns:repeat(4,1fr);position:relative;z-index:1;margin-top:14px;}
.st2-item{text-align:center;padding:14px 18px;position:relative;}
.st2-item:not(:last-child)::after{content:'';position:absolute;left:0;top:18%;height:64%;width:1px;
    background:linear-gradient(to bottom,transparent,rgba(201,169,97,.55),transparent);}
.st2-item .stat-icon{width:58px;height:58px;font-size:1.4rem;margin:0 auto 14px;background:rgba(255,255,255,.1);border:1px solid rgba(201,169,97,.4);box-shadow:none;}
.st2-item .stat-number-big{font-size:2.8rem;background:linear-gradient(135deg,var(--gold-light),var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:6px;}
.st2-item .stat-label{color:rgba(255,255,255,.78);font-size:.95rem;}
@media(max-width:768px){.st2-row{grid-template-columns:repeat(2,1fr);gap:20px;}.st2-item:nth-child(2)::after{display:none;}}
@media(max-width:420px){.st2-row{grid-template-columns:1fr;}.st2-item::after{display:none !important;}}

/* ============ الأرقام 3 — حلقات تقدّم (Rings) ============ */
.stats-section--rings{background:var(--white);padding:64px 0;}
.st3-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin-top:14px;}
.st3-item{text-align:center;}
.st3-ring{width:150px;height:150px;border-radius:50%;margin:0 auto 18px;display:grid;place-items:center;position:relative;
    background:conic-gradient(var(--teal) 0 72%,var(--gray-100) 72% 100%);transition:var(--transition-slow);}
.st3-item:nth-child(2) .st3-ring{background:conic-gradient(var(--gold) 0 72%,var(--gray-100) 72% 100%);}
.st3-item:nth-child(3) .st3-ring{background:conic-gradient(var(--teal-light) 0 72%,var(--gray-100) 72% 100%);}
.st3-item:nth-child(4) .st3-ring{background:conic-gradient(var(--gold-dark) 0 72%,var(--gray-100) 72% 100%);}
.st3-item:hover .st3-ring{transform:scale(1.05) rotate(6deg);}
.st3-ring::before{content:'';position:absolute;inset:12px;background:#fff;border-radius:50%;box-shadow:inset 0 2px 10px rgba(0,0,0,.06);}
.st3-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;}
.st3-inner .stat-icon{width:40px;height:40px;font-size:1rem;margin:0 0 4px;box-shadow:none;}
.st3-inner .stat-number-big{font-size:1.9rem;margin:0;}
.st3-item .stat-label{font-size:1.02rem;color:var(--gray-700);font-weight:600;}
@media(max-width:768px){.st3-grid{grid-template-columns:repeat(2,1fr);gap:30px;}}
@media(max-width:420px){.st3-grid{grid-template-columns:1fr;}}

/* ============ الأرقام 4 — Split أفقي (عنوان + قائمة) ============ */
.stats-section--split{background:linear-gradient(160deg,var(--bg-light),var(--white));padding:64px 0;}
.st4-row{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:center;}
.st4-aside .section-label{margin-bottom:14px;}
.st4-aside h2{font-size:clamp(1.7rem,3vw,2.5rem);font-weight:800;color:var(--dark);line-height:1.25;margin:0 0 12px;}
.st4-aside p{color:var(--gray-500);line-height:1.9;margin:0;}
.st4-list{display:grid;grid-template-columns:1fr 1fr;gap:0;}
.st4-cell{display:flex;align-items:center;gap:16px;padding:22px 20px;border-bottom:1px solid var(--gray-200);}
.st4-cell:nth-child(odd){border-left:1px solid var(--gray-200);}
.st4-cell .stat-icon{width:54px;height:54px;font-size:1.25rem;margin:0;border-radius:16px;}
.st4-txt .stat-number-big{font-size:2.4rem;margin:0;line-height:1;}
.st4-txt .stat-label{font-size:.95rem;color:var(--gray-500);}
@media(max-width:860px){.st4-row{grid-template-columns:1fr;gap:30px;}}
@media(max-width:480px){.st4-list{grid-template-columns:1fr;}.st4-cell:nth-child(odd){border-left:none;}}
