/*=========================================
        STATISTICS SECTION
=========================================*/

.statistics{

    position:relative;

    padding:120px 0;

    overflow:hidden;

    background:
    radial-gradient(circle at top right,
    rgba(150,106,48,.08),
    transparent 35%),

    radial-gradient(circle at bottom left,
    rgba(19,27,41,.05),
    transparent 35%),

    #ffffff;

}

.statistics .container{

    position:relative;

    z-index:2;

}

/* =========================
   Title
========================= */

.statistics-title{

    width:min(760px,100%);

    margin:0 auto 60px;

    text-align:center;

}

.statistics-title h2{

    margin:22px 0;

    color:#131B29;

    font-size:clamp(2.6rem,4vw,3.5rem);

    font-weight:800;

    line-height:1.15;

    letter-spacing:-1px;

}

.statistics-title p{

    max-width:680px;

    margin:auto;

    color:#6B7280;

    font-size:1.05rem;

    line-height:1.9;

}
/* =========================
   Grid
========================= */

.statistics-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}
/* =========================
   Card
========================= */

.stat-card{

    position:relative;

    background:#fff;

    border:1px solid rgba(19,27,41,.06);

    border-radius:28px;

    padding:45px 30px;

    text-align:center;

    overflow:hidden;

    transition:.35s;

    box-shadow:0 18px 45px rgba(19,27,41,.06);

}
/* =========================
   Icon
========================= */

.stat-icon{

    width:90px;

	height:90px;

    margin:0 auto 25px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:rgba(150,106,48,.10);

    border:1px solid rgba(150,106,48,.15);

    transition:.35s;

}

.stat-icon i{

    color:#966A30;

    font-size:38px;

}
/* =========================
   Counter
========================= */

.stat-card h3{

    margin-bottom:12px;

    color:#131B29;

    font-size:3.5rem;

    font-weight:800;

    line-height:1;

}

.stat-card span{

    color:#6B7280;

    font-size:1rem;

    font-weight:500;

}
/* =========================
   Hover
========================= */

.stat-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:4px;

    background:#966A30;

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.stat-card:hover{

    transform:translateY(-10px);

    border-color:rgba(150,106,48,.25);

    box-shadow:0 30px 65px rgba(19,27,41,.12);

}

.stat-card:hover::before{

    transform:scaleX(1);

}

.stat-card:hover .stat-icon{

    background:#966A30;

    transform:scale(1.08) rotate(6deg);

}

.stat-card:hover .stat-icon i{

    color:#fff;

}
