/* @media (min-width: 768px) {
    .custom-container {
        width: 90%;
    }

    .nav-menu {
        position: static;
        transform: translateX(0);
        width: auto;
        height: auto;
        background-color: transparent;
        flex-direction: row;
        gap: 2rem;
        color: var(--primary);
    }

    .hamburger-btn {
        display: none;
    }

    .hero-banner h1 {
        font-size: 5vw;
        max-width: 800px;
    }

    .about-us .custom-container,
    .why-us .custom-container,
    .home-cta .custom-container {
        flex-direction: row;
        align-items: center;
        gap: 2rem;
    }

    .about-us-top,
    .about-us-btm,
    .why-us-btm,
    .home-cta-top,
    .home-cta-btm {
        width: calc(50% - 1rem);
    }

    .why-us-top {
        width: 100%;
    }

    .why-us-item {
        width: calc(50% - 1rem);
    }

    .services-item {
        width: calc(50% - 0.75rem);
    }

    h3 {
        font-size: 1.6rem;
    }

    .footer-logo {
        width: calc(50% - 1rem);
    }
}


@media (min-width: 1024px) {
    .custom-container {
        width: 85%;
        max-width: 1100px;
    }

    .hero-banner h1 {
        font-size: 4vw;
    }

    h2 {
        font-size: 1.1rem;
    }

    h3 {
        font-size: 1.8rem;
    }

    p {
        font-size: 1rem;
    }

    .about-us,
    .why-us,
    .services,
    .home-cta {
        padding: 5rem 0;
    }

    .why-us .custom-container {
        flex-direction: row-reverse;
        gap: 3rem;
    }

    .why-us-top,
    .why-us-btm {
        width: calc(50% - 1.5rem);
    }

    .footer-top {
        padding: 4rem 0 0;
    }

    .footer-logo {
        width: calc(25% - 1.5rem);
    }
}


@media (min-width: 1200px) {
    .custom-container {
        max-width: 1200px;
    }

    .hero-banner h1 {
        font-size: 3.5vw;
    }

    h3 {
        font-size: 2rem;
    }

    .why-us-item {
        width: calc(50% - 2rem);
    }
}


@media (min-width: 1400px) {
    .custom-container {
        max-width: 1300px;
    }

    .hero-banner h1 {
        font-size: 3vw;
    }

    .why-us .custom-container {
        gap: 5rem;
    }

    .why-us-top,
    .why-us-btm {
        width: calc(50% - 2.5rem);
    }

    .why-us-item {
        width: calc(50% - 1.5rem);
    }
} */


@media screen and (min-width: 1200px) {
    .custom-container {
        width: 85%;
    }

    h2 {
        font-size: 1.1rem;
    }

    h3 {
        font-size: 1.7rem;
    }

    h4 {
        font-size: 1.3rem;
    }

    /* a, button, p, input, textarea {
        font-size: 1rem;
    } */

    .header {
        padding: 1.5rem 0;
    }

    .header-logo img {
        width: 155px;
    }

    .header-contact {
        display: inline-block;
    }

    .hamburger-btn {
        display: none;
    }

    .nav-menu {
        position: relative;
        transform: translateX(0%);
        width: unset;
        height: unset;
        background-color: unset;
        display: flex;
        flex-direction: row;
        gap: 3.5rem;
        color: var(--black);
        transition: all 0.3s ease;
    }

    .nav-menu a {
        position: relative;
    }

    .nav-menu a span {
        display: flex;
        position: absolute;
        font-size: 0.7rem;
        top: calc(100% + 4px);
        left: 50%;
        width: max-content;
        transform: translateX(-50%);
    }

    .footer-top {
        padding: 6rem 0 0;
    }

    .footer-top .custom-container {
        padding-bottom: 5rem;
    }

    .footer-logo {
        max-width: calc(25% - 1.5rem);
        width: max-content;
        gap: 1.8rem;
    }

    .footer-logo h2 {
        font-size: 1.2rem;
    }

    .footer-quick-links, .footer-contact-links, .footer-social-links {
        gap: 1.4rem;
    }

    .footer-btm {
        padding: 1.5rem 0;
    }

    .footer-btm .custom-container {
        justify-content: space-between;
    }

    .hero-banner h1 {
        font-size: 3vw;
        max-width: 55%;
    }

    .hero-banner p {
        font-size: 1rem;
        max-width: 50%;
    }

    .hero-banner {
        flex-direction: row;
    }

    .hero-banner > a {
        width: 50%;
        height: 100%;
    }

    .hero-banner > a img {
        width: 300px;
    }
    
    .hero-banner > a:nth-child(2) {
        border-bottom: none;
        border-right: 3px solid #fff;
    }

    .about-us {
        padding: 8rem 0 5rem;
    }

    .about-us .custom-container {
        gap: 4rem;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
    }

    .about-us-top {
        width: calc(45% - 2rem);
    }

    .about-us-top p {
        margin-top: 1.2rem;
    }

    .about-us-btm img {
        aspect-ratio: 13 / 9;
    }

    .about-us-btm {
        width: calc(50% - 2rem);
    }

    .why-us {
        padding: 5rem 0;
    }

    .why-us .custom-container {
        gap: 4rem;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .why-us-top {
        width: calc(55% - 2rem);
        gap: 3rem;
    }

    .why-us-head p {
        margin-top: 1.2rem;
    }

    .why-us-body {
        gap: 2.5rem 2rem;
    }

    .why-us-sub .why-us-item {
        width: 80%;
    }

    .why-us-item {
        width: calc(50% - 1rem);
    }

    .why-us-btm {
        width: calc(45% - 2rem);
    }

    .services {
        padding: 5rem 0;
    }

    .services .custom-container {
        gap: 4rem;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }

    .services-top {
        width: max-content;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .services-top p {
        width: 23rem;
    }

    .services-btm {
        width: 90%;
        gap: 3rem;
        flex-wrap: wrap;
    }

    .services-item {
        width: calc(50% - 1.5rem);
        aspect-ratio: 9 / 10;
    }

    .home-cta {
        padding: 5rem 0 8rem;
    }

    .home-cta .custom-container {
        gap: 4rem;
        flex-direction: row-reverse;
        justify-content: space-between;
        align-items: center;
    }

    .home-cta-top, .home-cta-btm {
        width: calc(48% - 2rem);
    }

    .cta-form {
        gap: 2rem;
    }

    .page-service {
        padding: 8rem 0 5rem;
    }

    .page-service .custom-container {
        gap: 3rem;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .page-service-items {
        gap: 4rem;
    }

    .page-service-item {
        width: calc(25% - 3rem);
    }

    .page-service-item p {
        font-size: 1.1rem;
    }
}