/*==================================================
SUMMARY
==================================================*/

.stat-summary{

    position:relative;

    margin-top:-55px;

    z-index:30;

    padding-bottom:28px;

}

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

.summary-card{

    position:relative;

    background:#FFFFFF;

    border:1px solid #EEE8DF;

    border-radius:22px;

    text-align:center;

    padding:24px 16px;

    height:100%;

    transition:.35s ease;

    overflow:hidden;

    box-shadow:
        0 8px 28px rgba(0,0,0,.05);

}

.summary-card:hover{

    transform:translateY(-6px);

    box-shadow:
        0 18px 45px rgba(0,0,0,.10);

}

/*==================================================
TOP BORDER
==================================================*/

.summary-card::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:4px;

    background:transparent;

    transition:.3s;

}

.summary-card:hover::before{

    background:
    linear-gradient(
        90deg,
        #C8902D,
        #E6B654
    );

}

/*==================================================
ICON
==================================================*/

.summary-icon{

    width:60px;

    height:60px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0 auto 14px;

    color:#fff;

    font-size:24px;

}

/* warna */

.summary-icon.penduduk{

    background:#D3A03A;

}

.summary-icon.kk{

    background:#6FBF64;

}

.summary-icon.rt{

    background:#F39C34;

}

.summary-icon.rw{

    background:#DD5757;

}

.summary-icon.dusun{

    background:#8A6AD8;

}

.summary-icon.wilayah{

    background:#3579D6;

}

/*==================================================
LABEL
==================================================*/

.summary-label{

    display:block;

    color:#666;

    font-size:14px;

    font-weight:600;

    margin-bottom:8px;

    line-height:1.4;

}

/*==================================================
ANGKA
==================================================*/

.summary-card h3{

    margin:0;

    color:#2D2418;

    font-size:24px;

    font-weight:800;

    line-height:1.2;

}

.summary-card small{

    display:block;

    margin-top:8px;

    color:#777;

    font-size:13px;

    font-weight:600;

}

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

@media(max-width:992px){

    .stat-summary{

        margin-top:-40px;

    }

}

@media(max-width:768px){

    .summary-card{

        padding:20px 14px;

    }

    .summary-icon{

        width:52px;

        height:52px;

        font-size:20px;

    }

    .summary-card h3{

        font-size:22px;

    }

}

@media(max-width:576px){

    .stat-summary{

        margin-top:-25px;

    }

    .summary-card{

        border-radius:18px;

        padding:18px 12px;

    }

    .summary-label{

        font-size:13px;

    }

    .summary-card h3{

        font-size:20px;

    }

}