/*==================================================
STATS
==================================================*/

.stats{

    padding:var(--space-96) 0;

    background:var(--color-white);

}

/*=========================================
HEADER
=========================================*/

.stats__header{

    text-align:center;

    margin-bottom:var(--space-64);

}

.stats__subtitle{

    display:inline-block;

    margin-bottom:var(--space-40);

    color:var(--color-secondary);

    font-size:var(--font-size-xl);

    font-weight:var(--font-weight-semibold);

    text-transform:uppercase;

    letter-spacing:1px;

}

.stats__title{

    max-width:720px;

    margin-inline:auto;

}

/*=========================================
GRID
=========================================*/

.stats__grid{

    display:grid;

    grid-template-columns:repeat(6,1fr);

    gap:var(--space-24);

}

/*=========================================
CARD
=========================================*/

.stats__card{

    padding:var(--space-32);

    border-radius:var(--radius-lg);

    background:var(--color-white);

    border:1px solid var(--color-border);

    text-align:center;

    box-shadow:var(--shadow-sm);

    transition:
        transform var(--transition-normal),
        box-shadow var(--transition-normal);

}

.stats__card:hover{

    transform:translateY(-8px);

    box-shadow:var(--shadow-lg);

}

.stats__icon{

    width:70px;

    height:70px;

    margin:0 auto var(--space-24);

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(247,148,29,.10);

    color:var(--color-secondary);

    font-size:1.8rem;

}

.stats__number{

    margin-bottom:var(--space-12);

    color:var(--color-primary);

    font-size:var(--font-size-3xl);

    font-weight:var(--font-weight-extrabold);

}

.stats__heading{

    margin-bottom:var(--space-16);

    color:var(--color-primary);

}

.stats__text{

    margin:0;

    color:var(--color-text-light);

    font-size:var(--font-size-sm);

}

/*=========================================
RESPONSIVE
=========================================*/

@media(max-width:1200px){

    .stats__grid{

        grid-template-columns:repeat(3,1fr);

    }

}

@media(max-width:768px){

    .stats{

        padding:var(--space-80) 0;

    }

    .stats__grid{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:576px){

    .stats__grid{

        grid-template-columns:1fr;

    }

}