.containerbola{
    max-width:950px;
    height: 100px;
    margin:auto;
}

.match-card2{
    position:relative;
    overflow:hidden;

    background:
    linear-gradient(
    135deg,
    rgba(7,24,46,.95),
    rgba(2,10,20,.98)
    );

    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    cursor:pointer;
text-decoration:none;
    padding:16px 18px;
    margin-bottom:18px;
color:inherit;
    display:flex;
    justify-content:space-between;
    align-items:center;

    transition:.4s;
}

.match-card2::before{
    content:"⚽";
    position:absolute;
    right:-15px;
    top:-20px;
    font-size:120px;
    opacity:.03;
}

.match-card2:hover{
    transform:translateY(-4px);
    border-color:#ff2438;
    box-shadow:
    0 0 20px rgba(255,0,40,.15),
    0 0 50px rgba(255,0,40,.08);
}

.left{
    display:flex;
    align-items:center;
    gap:15px;
}

.logo-box{
    width:62px;
    height:62px;

    background:
    rgba(255,255,255,.08);

    backdrop-filter:blur(15px);

    border-radius:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(255,255,255,.1);

    flex-shrink:0;
}

.logo-box img{
    width:48px;
    height:48px;
    object-fit:contain;
}

.info{
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.info h3{
    margin:0;
    color:#fff;
    font-size:24px;
    font-weight:700;
    line-height:1.2;
}

.info p{
    margin:3px 0 0;
    color:#9fb0c3;
    font-size:15px;
    line-height:1.2;
}

.right{
    display:flex;
    align-items:center;
    gap:18px;
}

.live{
    background:linear-gradient(90deg,#ff002f,#ff354f);

    color:white;
    font-size:13px;
    font-weight:700;

    padding:10px 18px;
    border-radius:999px;

    display:flex;
    align-items:center;
    gap:8px;

    box-shadow:
    0 0 10px rgba(255,0,50,.5),
    0 0 25px rgba(255,0,50,.25);
}

.dot{
    width:8px;
    height:8px;
    background:white;
    border-radius:50%;

    animation:blink 1s infinite;
}

.arrow{
    color:#8fa3ba;
    font-size:28px;
    transition:.3s;
}

.match-card2:hover .arrow{
    color:white;
    transform:translateX(5px);
}

@keyframes blink{
    0%,100%{
        opacity:1;
    }
    50%{
        opacity:.3;
    }
}

.badge{
    position:absolute;
    top:10px;
    right:25px;

    font-size:11px;
    font-weight:600;

    color:#7fc8ff;
}

@media(max-width:768px){

     .info h3{
        font-size:16px;
    }

    .info p{
        font-size:12px;
    }

    .logo-box{
        width:55px;
        height:55px;
    }

    .logo-box img{
        width:40px;
        height:40px;
    }

    .live{
        padding:8px 14px;
        font-size:12px;
    }
    .badge{
    position:absolute;
    top:10px;
    right:20px;

    font-size:9px;
    font-weight:600;

    color:#7fc8ff;
}
}

.match-link{
    position:relative;
    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:18px;
    margin-bottom:15px;

    text-decoration:none;
    color:inherit;

    border-radius:22px;

    background:linear-gradient(
        135deg,
        #041426,
        #071d38
    );

    transition:.3s;
}

.match-link{
    display:block;
    text-decoration:none;
    color:inherit;
}

.match-link:hover .match-card2{
    transform:translateY(-3px);
    box-shadow:0 10px 25px rgba(255,0,0,.15);
}

.match-card2{
    transition:.3s;
    cursor:pointer;
}