/* ==========================================================
   HARDKING
   SERVIÇOS
========================================================== */

.hk-services{

    background:
        url('../img/services/services-bg.png')
        center center / cover no-repeat;

    position: relative;

    overflow: hidden;

}


/* ==========================================================
   CABEÇALHO
========================================================== */

.hk-services-header{

    text-align:center;

    margin-bottom:50px;

    

}

.hk-services-subtitle{

    display:block;

    color:var(--hk-primary);

    font-size:.85rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:10px;

}

.hk-services-title{

    color:var(--hk-white);

    font-size:2.5rem;

    font-weight:800;

    line-height:1.2;

    margin:0;

}


/* ==========================================================
   GRID
========================================================== */

.hk-services-grid{

    display:grid;

    grid-template-columns:repeat(6,1fr);

    gap:20px;

    align-items:start;

}


/* ==========================================================
   CARD
========================================================== */

.hk-service-item{

    position:relative;

    text-align:center;

    color:var(--hk-white);

    padding:10px 15px;

    transition:.3s ease;

}

.hk-service-item:hover{

    transform:translateY(-3px);

}


/* ==========================================================
   DIVISÓRIA
========================================================== */

.hk-service-item:not(:last-child)::after{

    content:"";

    position:absolute;

    top:15%;

    right:-10px;

    width:1px;

    height:70%;

    background:
        linear-gradient(
            transparent,
            rgba(57,212,0,.35),
            transparent
        );

}


/* ==========================================================
   ÍCONE
========================================================== */

.hk-service-icon{

    display:flex;

    align-items:center;

    justify-content:center;

    height:90px;

    margin-bottom:15px;

}

.hk-service-icon img{

    width:80px;

    height:80px;

    object-fit:contain;

    transition:.3s ease;

    filter:
        drop-shadow(
            0 0 10px rgba(57,212,0,.25)
        );

}

.hk-service-item:hover .hk-service-icon img{

    transform:scale(1.05);

    filter:
        drop-shadow(
            0 0 15px rgba(57,212,0,.45)
        );

}


/* ==========================================================
   TÍTULO
========================================================== */

.hk-service-item h3{

    font-size:.95rem;

    font-weight:700;

    text-transform:uppercase;

    color:var(--hk-white);

    margin-bottom:12px;

    min-height:40px;

}


/* ==========================================================
   TEXTO
========================================================== */

.hk-service-item p{

    font-size:.82rem;

    line-height:1.6;

    color:#d7d7d7;

    margin:0;

}


/* ==========================================================
   NOTEBOOK HD
========================================================== */

@media (max-width:1400px){

    .hk-services{

        padding:50px 0;

    }

    .hk-services-grid{

        grid-template-columns:repeat(3,1fr);

        row-gap:40px;

    }

    .hk-service-item:nth-child(3)::after{

        display:none;

    }

}


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

@media (max-width:992px){

    .hk-services{

        padding:45px 0;

    }

    .hk-services-title{

        font-size:2rem;

    }

    .hk-services-grid{

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

        gap:35px;

    }

    .hk-service-item::after{

        display:none;

    }

}


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

@media (max-width:576px){

    .hk-services{

        padding:40px 0;

    }

    .hk-services-header{

        margin-bottom:35px;

    }

    .hk-services-title{

        font-size:1.8rem;

    }

    .hk-services-subtitle{

        font-size:.75rem;

    }

    .hk-services-grid{

        grid-template-columns:1fr;

        gap:30px;

    }

    .hk-service-icon{

        height:70px;

    }

    .hk-service-icon img{

        width:65px;

        height:65px;

    }

    .hk-service-item h3{

        min-height:auto;

        font-size:1rem;

    }

    .hk-service-item p{

        font-size:.85rem;

    }

}