/* =========================================
   CABLETECH KEY FACTORS
========================================= */

.ct-key-factors {

    width: 100%;

    padding: 42px 20px 30px;

    background: #ffffff;

    overflow: hidden;

}


/* =========================================
   CONTAINER
========================================= */

.ct-kf-container {

    width: 100%;

    max-width: 1200px;

    margin: 0 auto;

}


/* =========================================
   TITLE
========================================= */

.ct-kf-title {

    margin: 0 0 32px;

    text-align: center;

    color: #3d4d60;

    font-family:
        Arial,
        sans-serif;

    font-size: 30px;

    line-height: 1.2;

    font-weight: 400;

}


/* =========================================
   SLIDER
========================================= */

.ct-kf-slider {

    width: 100%;

    overflow: hidden;

}


.ct-kf-track {

    display: flex;

    gap: 0;

    width: 100%;

    transition:
        transform .7s
        cubic-bezier(
            .77,
            0,
            .175,
            1
        );

}


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

.ct-kf-item {

    flex: 0 0 25%;

    width: 25%;

    padding: 0 18px;

    text-align: center;

    box-sizing: border-box;

}


/* =========================================
   CIRCLE IMAGE
========================================= */

.ct-kf-image {

    width: 182px;

    height: 60px;

    margin: 0 auto 7px;
    
    background: #eeeeee;

}


.ct-kf-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .5s ease;

}


.ct-kf-item:hover
.ct-kf-image img {

    transform: scale(1.08);

}


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

.ct-kf-item h3 {

    margin: 0 auto 5px;

    max-width: 260px;

    color: #3e4e61;

    font-family:
        Arial,
        sans-serif;

    font-size: 16px;

    line-height: 1.5;

    font-weight: 400;

}


/* =========================================
   DESCRIPTION
========================================= */

.ct-kf-item p {

    margin: 0 auto;

    max-width: 250px;

    color: #3e4e61;

    font-family:
        Arial,
        sans-serif;

    font-size: 15px;

    line-height: 1.65;

}


/* =========================================
   DOTS
========================================= */

.ct-kf-dots {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 8px;

    margin-top: 14px;

}


.ct-kf-dots button {

    width: 7px;

    height: 7px;

    padding: 0;

    border: 0;

    border-radius: 50%;

    background: #d5d5d5;

    cursor: pointer;

    transition:
        width .3s ease,
        background .3s ease;

}


.ct-kf-dots button.active {

    width: 7px;

    background: #000000;

}


/* =========================================
   TABLET
========================================= */

@media (max-width: 1000px) {

    .ct-kf-item {

        flex: 0 0 33.333%;

        width: 33.333%;

    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 700px) {

    .ct-key-factors {

        padding:
            40px 15px 28px;

    }


    .ct-kf-title {

        font-size: 26px;

        margin-bottom: 28px;

    }


    .ct-kf-item {

        flex: 0 0 50%;

        width: 50%;

        padding:
            0 10px;

    }


    .ct-kf-image {

        width: 125px;

        height: 125px;

    }


    .ct-kf-item h3 {

        font-size: 14px;

    }


    .ct-kf-item p {

        font-size: 13px;

        line-height: 1.5;

    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .ct-kf-item {

        flex: 0 0 100%;

        width: 100%;

    }


    .ct-kf-image {

        width: 145px;

        height: 145px;

    }


    .ct-kf-item h3 {

        font-size: 16px;

    }


    .ct-kf-item p {

        max-width: 280px;

        font-size: 14px;

    }

}