/* ABOUT SECTION 2 - IMG */
@media (max-width: 800px) {

    .img-container {
        display: none;
    }

    .about-container {
        gap: 0;
    }

}

/* ABOUT SECTION 2 - h1 */
@media (max-width: 580px) {

    .text-container h1 {
        font-size: 2.75rem;
    }

}

@media (max-width: 400px) {

    .text-container h1 {
        font-size: 2.25rem;
    }

}

/* ABOUT SECTION 2 - SECTION 2 CONTAINER */
@media (max-width: 500px) {

    .section-2 {
        padding-inline: 25px;
        padding-block: 30px;
    }

}



/* WHAT WE DO - SECTION 3 - GRID */
@media (max-width: 700px) {

    .services-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 700px){
    .section-3 {

    padding-inline: 25PX;
    padding-block: 30px;

}
}



/* WHAT OUR SERVICES MEAN - SECTION 4 - IMG COLUMN */
@media (max-width: 700px) {

    .service-mobile-overlay {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding-block: 30px;
        padding-inline: 25px;
        color: white;

        background: linear-gradient(
            transparent,
            rgba(3, 20, 47, 0.9)
        );
    }

}

@media (max-width: 700px) {

    .service-detail-text {
        display: none;
    }

}

@media (max-width: 700px) {

    .section-4 {
        padding-block: 30px;
    }

}



/* WHO WE WORK WITH - SECTION - 5 - GRID */

@media (max-width: 750px) {

    .section-5 {
        padding: 100px 40px;
    }

    .industries-grid {
        grid-template-columns: 1fr;
    }

    .industry-box {
        min-height: auto;

        padding: 40px;
    }

}

@media (max-width: 750px){
    .section-5 {
    padding-block: 1px;
    padding-inline: 25px;
}
}

@media (max-width: 750px){
    .service-flip-card {
    width: 100%;
}
}



/* ABOUT SECTION 2 - h1 */
@media (max-width: 580px) {

    .industries-title h1 {
    font-size: 2.75rem;
}

}

@media (max-width: 400px) {

    .industries-title h1 {
        font-size: 2.25rem;
    }

}



/* WHO WE WORK WITH - SECTION 5 - COLUMN PADDING */
@media (max-width: 750px) {

    .section-5 {
        padding-inline: 20px;
    }

    .industries-grid {
        grid-template-columns: 1fr;
    }

    .industry-box {
        padding: 30px 20px;
    }

}












/* RESPONSIVE */

@media (max-width: 800px) {

    .section-6 {
        padding-block: 75px;
        padding-inline: 25px;
    }

    .contact-container {
        flex-direction: column;
        align-items: stretch;

        gap: 50px;
    }

    .contact-left h2 {
        font-size: 2.75rem;
    }

}



/* SECTION 4 - FRONT FLIP p TEXT */
@media (max-width: 425px) {


    .service-mobile-overlay p {
        font-size: 0.8rem;
    }
    .service-flip-back ul {
    font-size: 0.8rem;
}

.service-flip-back h4 {
    font-size: 1.2rem;
}

}

/* SECTION 4 - BACK FLIP TEXT */
@media (min-width: 901px) and (max-width: 1100px){
        .service-mobile-overlay p {
        font-size: 0.8rem;
    }
    .service-flip-back ul {
    font-size: 0.7rem;
}

.service-flip-back h4 {
    font-size: 1rem;
}
}

@media (min-width: 751px) and (max-width: 900px){
        .service-mobile-overlay p {
        font-size: 0.8rem;
    }
    .service-flip-back ul {
    font-size: 0.5rem;
}

.service-flip-back h4 {
    font-size: 0.8rem;
}
}

@media (min-width: 701px) and (max-width: 750px){
        .service-mobile-overlay p {
        font-size: 0.8rem;
    }
    .service-flip-back ul {
    font-size: 0.7rem;
}

.service-flip-back h4 {
    font-size: 0.9rem;
}
}

@media (max-width: 390px){
    .service-flip-front h3{
        display: none;
    }


}

@media (max-width: 401px){
      .service-mobile-overlay span{
        display: none;
    }
}





