.stats {
    background-image: url('../../img/logo.avif');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-attachment: fixed;
    background-position: center;
}

.stats-container {

    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-md);
    padding-top: var(--space-lg);
    z-index: 10;
    /* background-color: var(--clr-light); */
}

/* الإحصائيات */
.stats__numbers {
    display: flex;
    gap: var(--space-xl);
    width: 48%;

    background-color: var(--clr-light);
    padding: 12px 20px;
    border-radius: var(--br-sm);
    box-shadow: var(--shadow-sm);
    opacity: 1;
    z-index: 10;

}

.stat-item {
    display: flex;
    flex-direction: column;
}

.stat-number {
    font-size: var(--fs-xl);
    font-weight: 800;
    color: var(--clr-primary);
}

.stat-label {
    font-size: var(--fs-sm);
    color: var(--clr-dark);
}

/* ================stats text ================ */
.stats-badge {

    background-color: var(--clr-light);
    padding: 12px 20px;
    border-radius: var(--br-sm);
    box-shadow: var(--shadow-sm);
    width: 48%;

    display: flex;
    align-items: start;
    gap: 15px;
    direction: rtl;
    z-index: 10;

    /* تفعيل الأنيميشن الذي عطلته في كودك */
    opacity: 0;
    animation: popIn 0.5s ease-out forwards;
    animation-delay: 1.2s;
}

.stats-badge span {
    display: block;
    width: 100%;
}

@media (max-width: 1024px) {

    .hero__badge,
    .hero__actions,
    .stats__numbers {
        justify-content: center;
    }
}

@media (max-width: 768px) {

    .stats-container {
        flex-direction: column;
    }

    .stats__numbers {
        width: 100%;
    }

    .stats-badge {
        width: 100%;
    }
}

@media (max-width: 425px) {

    .stats__numbers {
        gap: var(--space-md);
        flex-wrap: wrap;
        justify-content: center;
    }
}