/* ======================================================
   TK Partners
====================================================== */

.tkpartners{
    padding:80px 0 35px;
    background:#fff;
    overflow:hidden;
}

.tkpartners__header{
    text-align:center;
    margin-bottom:40px;
}

.tkpartners__title{

    margin:0;

    font-size:34px;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1px;

    color:#0F172A;

}

.tkpartners__line{
    width:70px;
    height:4px;
    background:#0F766E;
    border-radius:999px;
    margin:18px auto 0;
}

.tkpartners__subtitle{

    max-width:1200px;

    margin:24px auto 0;

    font-size:18px;

    line-height:1.8;

    color:#64748B;

    text-align:center;

}

/* ========================= */

.tkpartners__marquee{

    position:relative;

    overflow:hidden;

    width:100%;
}

/* Fade hai đầu */

.tkpartners__marquee::before,
.tkpartners__marquee::after{

    content:"";

    position:absolute;

    top:0;

    width:120px;

    height:100%;

    z-index:5;

    pointer-events:none;
}

.tkpartners__marquee::before{

    left:0;

    background:linear-gradient(
        to right,
        #fff 0%,
        rgba(255,255,255,0) 100%
    );

}

.tkpartners__marquee::after{

    right:0;

    background:linear-gradient(
        to left,
        #fff 0%,
        rgba(255,255,255,0) 100%
    );

}

/* ========================= */

.tkpartners__track{

    display:flex;

    align-items:center;

    gap:28px;

    width:max-content;

    animation:
        tkpartners-marquee
        var(--tkpartners-speed)
        linear
        infinite;

}

.tkpartners__marquee:hover .tkpartners__track{

    animation-play-state:paused;

}

/* ========================= */

.tkpartners__item{

    flex:0 0 auto;

    width:230px;

    height:120px;

    background:#fff;

    border-radius:16px;

    border:1px solid #E5E7EB;

    display:flex;

    justify-content:center;

    align-items:center;

    padding:18px;

    transition:.3s;

}

.tkpartners__item:hover{

    transform:translateY(-6px);

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

}

.tkpartners__item img{

    width:100%;

    height:100%;

    object-fit:contain;

    display:block;

}

/* ========================= */

@keyframes tkpartners-marquee{

    from{

        transform:translateX(0);

    }

    to{

        transform:translateX(-50%);

    }

}

/* ========================= */

@media(max-width:1200px){

    .tkpartners__item{

        width:210px;
        height:110px;

    }

}

@media(max-width:992px){

    .tkpartners{

        padding:60px 0;

    }

    .tkpartners__title{

        font-size:30px;

    }

    .tkpartners__item{

        width:180px;
        height:100px;

    }

}

@media(max-width:768px){

    .tkpartners{

        padding:50px 0;

    }

    .tkpartners__title{

        font-size:26px;

    }
    
    .tkpartners__subtitle{

        font-size:16px;

        line-height:1.7;

        padding:0 20px;

    }

    .tkpartners__item{

        width:150px;
        height:90px;

        padding:14px;

    }

    .tkpartners__marquee::before,
    .tkpartners__marquee::after{

        width:60px;

    }

}

@media(max-width:480px){

    .tkpartners__item{

        width:130px;
        height:80px;

    }

}