/* =====================================================
   DIES SPORT CENTER VISITOR COUNTER
===================================================== */

.dsc-counter-section{

    background-image: url(../img/parallax/testimonial.jpg);
    padding:  0;
    color: #fff;
    text-align:center;
    position:relative;

}

.dsc-counter-section .overlay {
    background-color: rgba(15,155,224, 0.78);
    padding: 70px 0 40px;
}


.dsc-counter-header{

    margin-bottom:45px;

}

.dsc-counter-label{

    color:#ff3b3b;

    letter-spacing:4px;

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

}

.dsc-counter-title{

    margin-top:15px;

    color:#fff;

    font-size:54px;

    font-weight:800;

    letter-spacing:2px;

}

.dsc-counter-desc{

    margin-top:15px;

    color:#d8d8d8;

    font-size:18px;

}

.dsc-counter-card{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:30px;

    padding:22px 30px;

    max-width:760px;

    margin:auto;

    border-radius:50px;

    border:1px solid rgba(255,255,255,.12);

    background:rgba(255,255,255,.05);

    backdrop-filter:blur(12px);

    box-shadow:

        0 0 40px rgba(255,0,0,.18),

        inset 0 0 15px rgba(255,255,255,.05);

    position:relative;

    transition:.35s;

}

.dsc-counter-card:hover{

    transform:translateY(-4px);

    box-shadow:

        0 0 55px rgba(255,0,0,.35);

}

.dsc-counter-card:after{

    content:'';

    position:absolute;

    left:50%;

    bottom:-2px;

    transform:translateX(-50%);

    width:65%;

    height:3px;

    background:#ff2e2e;

    box-shadow:0 0 15px red;

}

.dsc-counter-icon{

    width:72px;

    height:72px;

    border-radius:18px;

    background:linear-gradient(#ff4444,#b60000);

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:34px;

    box-shadow:0 0 20px rgba(255,0,0,.4);

}

.dsc-counter-text{

    color:#fff;

    font-weight:700;

    letter-spacing:1px;

    font-size:17px;

    white-space:nowrap;

}

.dsc-counter-display{

    display:flex;

    gap:6px;

}

.dsc-counter-display span{

    width:48px;

    height:60px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#161616;

    border:1px solid rgba(255,255,255,.15);

    border-radius:6px;

    color:#fff;

    font-size:42px;

    font-weight:bold;

    font-family:'Courier New', monospace;

    box-shadow:inset 0 -4px 10px rgba(0,0,0,.6);

}

.dsc-counter-dot{

    width:10px;

    height:10px;

    border-radius:50%;

    background:#ff3030;

    box-shadow:0 0 18px red;

    animation:dscBlink 1s infinite;

}

@keyframes dscBlink{

    50%{

        opacity:.2;

    }

}

@media(max-width:768px){

    .dsc-counter-title{

        font-size:34px;

    }

    .dsc-counter-desc{

        font-size:15px;

    }

    .dsc-counter-card{

        flex-direction:column;

        border-radius:30px;

        padding:25px;

        gap:20px;

    }

    .dsc-counter-display span{

        width:36px;

        height:48px;

        font-size:28px;

    }

}


.dsc-counter-display{
    display:flex;
    gap:6px;
    justify-content:center;
}

.dsc-counter-digit{

    width:48px;
    height:60px;

    background:#161616;

    border:1px solid rgba(255,255,255,.15);

    border-radius:6px;

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

    overflow:hidden;

    position:relative;

    box-shadow:inset 0 -4px 10px rgba(0,0,0,.6);

}

.dsc-counter-digit span{

    position:absolute;

    color:#fff;

    font-size:42px;

    font-weight:bold;

    font-family:'Courier New', monospace;

}

@media (max-width:768px){

    .dsc-counter-section .overlay{
        padding:50px 0 30px;
    }

    .dsc-counter-header{
        margin-bottom:30px;
    }

    .dsc-counter-label{
        font-size:11px;
        letter-spacing:3px;
    }

    .dsc-counter-title{
        font-size:36px;
        line-height:1.1;
        margin-top:10px;
    }

    .dsc-counter-desc{
        font-size:15px;
        line-height:1.7;
        padding:0 20px;
    }

    .dsc-counter-card{
        width:92%;
        margin:auto;
        padding:20px;
        gap:18px;
        flex-direction:column;
        border-radius:28px;
    }

    .dsc-counter-icon{
        width:56px;
        height:56px;
        font-size:24px;
        border-radius:16px;
    }

    .dsc-counter-text{
        font-size:16px;
        text-align:center;
    }

    .dsc-counter-display{
        gap:4px;
        justify-content:center;
    }

    .dsc-counter-digit{
        width:30px;
        height:42px;
    }

    .dsc-counter-digit span{
        font-size:24px;
    }

    .dsc-counter-card:after{
        width:60%;
    }

}