@font-face{
    font-family:"Be Vietnam Pro";
    src:url("/font/BeVietnamPro-Regular.ttf") format("truetype");
    font-weight:400;
    font-style:normal;
    font-display:swap
}

@font-face{
    font-family:"Be Vietnam Pro";
    src:url("/font/BeVietnamPro-SemiBold.ttf") format("truetype");
    font-weight:600;
    font-style:normal;
    font-display:swap
}

@font-face{
    font-family:"Be Vietnam Pro";
    src:url("/font/BeVietnamPro-Bold.ttf") format("truetype");
    font-weight:700;
    font-style:normal;
    font-display:swap
}


.tlb-stats-wrap,
.tlb-stats-wrap *{
    box-sizing:border-box;
}


.tlb-stats-wrap{
    width:100%;

    padding:
        10px
        20px
        0;

    font-family:
        "Be Vietnam Pro",
        Arial,
        sans-serif;
}


.tlb-stats{
    width:min(1440px,100%);

    height:64px;
    min-height:64px;

    margin:0 auto;

    padding:
        0
        24px;

    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );

    align-items:center;

    overflow:hidden;

    border-radius:13px;

    background:
        linear-gradient(
            90deg,
            #fff3f6 0%,
            #fff8f9 50%,
            #fff2f5 100%
        );
}


/* =========================================================
   ITEM
========================================================= */

.tlb-stat{
    position:relative;

    min-width:0;

    height:42px;

    display:flex;

    align-items:center;
    justify-content:center;

    gap:12px;
}


.tlb-stat:not(:last-child)::after{
    content:"";

    position:absolute;

    top:4px;
    right:0;

    width:1px;
    height:34px;

    background:#f2dbe3;
}


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

.tlb-stat__icon{
    width:34px;
    height:34px;

    flex:0 0 34px;

    display:grid;
    place-items:center;

    color:#ed0754;
}


.tlb-stat__icon svg{
    width:30px;
    height:30px;

    fill:none;
    stroke:currentColor;

    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}


/* =========================================================
   TEXT
========================================================= */

.tlb-stat__content{
    display:flex;
    flex-direction:column;

    gap:2px;

    min-width:0;
}


.tlb-stat__content strong{
    color:#ed0754;

    font-size:18px;
    line-height:1.1;

    font-weight:700;

    white-space:nowrap;
}


.tlb-stat__content span{
    color:#34252a;

    font-size:9px;
    line-height:1.3;

    font-weight:400;

    white-space:nowrap;
}


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

@media(max-width:900px){

    .tlb-stats{
        height:auto;

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

        padding:10px 12px;
    }

    .tlb-stat{
        min-height:58px;
    }

    .tlb-stat:nth-child(2)::after{
        display:none;
    }

}


@media(max-width:540px){

    .tlb-stats-wrap{
        padding-inline:12px;
    }

    .tlb-stats{
        grid-template-columns:
            1fr
            1fr;
    }

    .tlb-stat{
        justify-content:flex-start;

        padding-left:7px;

        gap:7px;
    }

    .tlb-stat__icon{
        width:29px;
        height:29px;

        flex-basis:29px;
    }

    .tlb-stat__icon svg{
        width:26px;
        height:26px;
    }

    .tlb-stat__content strong{
        font-size:15px;
    }

    .tlb-stat__content span{
        font-size:8px;

        white-space:normal;
    }

}