/* **************************************************************** */
/* ************************MEDIA QUERIES*************************** */
/* **************************************************************** */

/* **************************************************************** */
/* ************************ HERO SECTION ************************** */
/* **************************************************************** */

@media screen and (width <=768px) {
    .spl_hero-contact-btn {
        padding: 10px;
        max-width: 230px;

    }
}

/* **************************************************************** */
/* ************************ SERVICE SECTION *********************** */
/* **************************************************************** */





@media screen and (width <=830px) {
    .spl_service-section {
        padding: 30px;
    }
}


/* **************************************************************** */
/* ************************ WHY-US SECTION *********************** */
/* **************************************************************** */




@media screen and (width <=1300px) {

    .commitment_card-container {
        grid-template-columns: minmax(300px, 1fr);
    }

}

@media screen and (width <=940px) {
    .spl_why-us .why_us-text {
        max-width: 90%;
        margin: auto;
    }

    /* .spl_why-us .why_us-text p {
        text-align: center;
    } */

    .spl_why-us-section-card {
        grid-template-columns: 1fr;
    }

    .spl_why-us-section-card .why_us-illustration-container:nth-child(1) {
        order: 1;
    }
}




@media screen and (width <=550px) {

    .commitment_text-card h2 {
        font-size: 2rem;
    }

    .commitment_text-card p {
        font-size: 1.6rem;
    }

}




/* 



@media screen and (width <=1333px) {
    .commitment_card-container {
        grid-template-columns: 1fr;
    }

}



@media screen and (width <=870px) {
    .spl_why-us-introduction {
        grid-template-columns: 1fr;
    }

    .why_us-introduction-text {
        order: -1;
        margin: auto;
        max-width: 650px;
        padding: 30px;
    }

    .spl_why-us-introduction .why_us-introduction-text {
        margin-top: -5px;
    }
    .spl_why-us-introduction .why_us-introduction-img {
        margin-top: -105px;
    }
    
    .why_us-commitment {
        padding: 30px;
    }

    .why_us-commitment .why_us-introduction-text {
        padding: 0;
    }

    .commitment_card-container {
        grid-template-columns: repeat(2, minmax(200px, 300px));
        padding: 10px;
        margin-top: 20px;
    }

    .commitment_card-container .card {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        height: 200px;
        padding: 20px;
        gap: 10px;

    }

    .commitment_emoji-card .emoji-title {
        font-size: 4rem;
    }

  

    .why_us-commitment {
        grid-template-columns: 1fr;
    }

    .commitement-grid-img {
        width: 100%;
    }
}

@media screen and (width <=624px) {
    .commitment_card-container {
        grid-template-columns: minmax(200px, 400px);
    }

    .commitment_emoji-card .emoji-title {
        font-size: 4rem;
    }

    .commitment_text-card h2 {
        font-size: 2.5rem;
    }

    .commitment_text-card p {
        font-size: 1.8rem;
    }


}


@media screen and (width <=400px) {
    .commitment_card-container .card {
        height: max-content;
    }

    .commitment_emoji-card .emoji-title {
        font-size: 3rem;
    }

} */

/* **************************************************************** */
/* ************************* ABOUT SECTION ************************ */
/* **************************************************************** */


@media screen and (width <=1024px) {

    .about-img-container img {
        object-position: 20% 0%;
    }

}

@media screen and (width <=900px) {
    .spl_about-container {

        grid-template-columns: 1fr;
    }


    .about-text {
        order: 1;
        width: 100%;
        /* text-align: justify; */
    }

    .btn-contact {
        margin-top: 30px;
    }





    .about-img-container {
        margin: auto;
        width: 100%;
        /* height: 70%; */
    }

    .about-img-container img {
        width: 100%;
        object-position: center;
    }
}


@media screen and (width<=530px) {
    .btn-contact {
        margin: 30px auto;

    }

}

@media screen and (width <=500px) {

    .spl_about-us-section {
        padding-bottom: 0;
    }

    .about_us-date {
        flex-direction: column;
        border-radius: 0;
    }

    .date {
        padding: 50px;
    }

    .date h3 {
        font-size: 4rem;
    }

    .date p {
        font-size: 2.3rem;
    }
}

/* **************************************************************** */
/* ************************* PRICE SECTION ************************ */
/* **************************************************************** */
@media screen and (width <=980px) {
    .spl_price-card-container {
        grid-template-columns: minmax(280px, 470px);
    }

    .spl_price-card {
        margin-bottom: 30px;
    }

    .spl_price-card:nth-child(2) {
        order: 3;
    }
}


@media screen and (width <=768px) {

    .spl-price-section {
        padding: 30px;
    }
}

/* **************************************************************** */
/* ************************** FAQ SECTION ************************* */
/* **************************************************************** */




@media screen and (width <=768px) {


    .spl_faq {
        padding: 30px;
    }

}

/* **************************************************************** */
/* ************************ CONTACT SECTION *********************** */
/* **************************************************************** */
@media screen and (width <=960px) {

    .spl_contact {
        grid-template-columns: repeat();
    }

    .spl_contact-form {
        padding: 30px;
    }

    .spl_contact-img {
        display: none;
    }
}





/* POINTER COARSE */

@media (hover: none) and (pointer: coarse) {
    .spl_service-item-card {
        box-shadow: none;
    }
}