@import url('../css/banner.css');

/*------------------------------- SERVICES --------------------------------*/

.services_page {
    padding: 5em 0 3em;
}

.services_page .service-grid {
    padding: 2.5em 0;
}

.services_page .service-grid .title-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0 0 1.313em;
}

.services_page .service-grid .title-box .service-title {
    font-size: 3em;
    line-height: 1.458em;
    letter-spacing: 0;
    font-weight: 800;
    font-family: var(--NS);
}

.services_page .service-grid .service-box-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: 1.5em;
    row-gap: 2.5em;
}

.services_page .service-grid .service-box-grid .service-box {
    padding: 1.5em;
    background: var(--white);
    border-radius: 34px;
    border: solid 0.6px #a8a8a8;
    color: #181818;
    text-decoration: none;
}

.services_page .service-grid .service-box-grid .service-box img {
    width: 100%;
    border-radius: 25px;
}

.services_page .service-grid .service-box-grid .service-box .service-title {
    font-size: 1.375em;
    line-height: 1.318em;
    letter-spacing: 0;
    padding: 0.727em 0.2em 0.2em;
}

@media screen and (max-width:992px) {

    .services_page {
        padding: 2.5em 0 0;
    }

    .services_page .service-grid {
        padding: 2.8em 0;
    }

    .services_page .service-grid:last-child {
        padding: 2.8em 0 0;
    }

    .services_page .service-grid .service-box-grid {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media screen and (max-width:600px) {
    .services_page .service-grid .title-box {
        padding: 0 0 1.8em;
    }

    .services_page .service-grid .title-box .service-title {
        font-size: 2.8em;
    }

    .services_page .service-grid .service-box-grid {
        grid-template-columns: 1fr;
        row-gap: 2em;
    }

    .services_page .service-grid .service-box-grid .service-box {
        padding: 2.4em 1.6em;
        border-radius: 2.4em;
    }

    .services_page .service-grid .service-box-grid .service-box .service-title {
        font-size: 1.4em;
        padding: 0.643em 0 0;
    }

    .services_page .service-grid .service-box-grid .service-box img {
        border-radius: 1.5em;
    }

    
}