.section-contact-banner img {
    display: block;
    width: 100%;
    height: 100%;
    margin-top: -3%;
    z-index: -1;
}

.section-contact-banner {
    position: relative;
    height: 56.27vw;
}

.contact-banner-text {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    position: relative;
    left: 6vw;
    bottom: 22vw;
    z-index: 2;
    color: var(--white);
    ;
    height: max-content;
    width: 27vw;
    gap: 1vw;
}

.contact-banner-text h1 {
    font-size: 3vw;
    padding: 0;
}

.contact-banner-text p {
    font-size: 1vw;
    margin: 0;
    padding: 0;
}

.section-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5vw;
    background-color: var(--white);
    margin-top: 3vw;
}

.section-form input,
.section-form textarea {
    padding: .6vw;
    background-color: var(--cream);
    border-radius: 12px;
    border: none;
    color: var(--black);
    font-size: 1vw;
}

.section-form div {
    display: flex;
    flex-direction: column;
    gap: 1vw;
}

.form-container p {
    font-size: 1vw;
    gap: 1vw;
    display: flex;
    flex-direction: column;
}

.form-container {
    max-width: 30vw;
    margin-left: 6vw;
    align-self: center;
}

.section-form div img {
    justify-self: end;
    width: 60vw;
    max-width: none;
}

.btn-form {
    background-color: var(--red);
    color: var(--white);
    padding: .5vw 1vw;
    border-radius: 6px;
    font-weight: 600;
    margin-bottom: 1vw;
    width: fit-content;
}

.btn-form:hover {
    opacity: .8;
    cursor: pointer;
}

@media (max-width: 996px) {
    .section-contact2 div {
        gap: 3vw;
    }

    h1,
    h2 {
        font-size: 5vw;
    }

    p {
        font-size: 3.5vw;
    }

    .section-contact {
        padding: 12vw 6vw;
        gap: 3vw;
    }

    .maps-contact {
        border: 3px solid #5e0207;
        height: 250px;
    }

    .section-form {
        display: flex;
        flex-direction: column;
        font-size: 3.5vw;
        padding: 12vw 0vw;
        grid-template-columns: 1fr;
        gap: 3vw;
        margin-top: 3vw;
    }

    .section-form input,
    .section-form textarea {
        padding: 3vw;
        font-size: 3.5vw;
    }

    .section-form div {
        gap: 3vw;
    }

    .form-container {
        margin: 0 5vw 0 5vw;
        max-width: none;
        width: 80vw;
        font-size: 3.5vw;
        gap: 3vw;
        display: flex;
        flex-direction: column;
    }

    .form-container p {
        font-size: 3.5vw;
        gap: 3vw;
        margin-bottom: 3vw;
        text-align: center;
    }

    .btn-form {
        padding: 2vw 4vw;
        align-self: center;
        font-size: 3.5vw;
        margin: 0;
    }

    .section-contact-banner {
        height: 190vw;
        margin-bottom: 3vw;
    }

    .contact-banner-text {
        width: 80vw;
        gap: 6vw;
        left: auto;
        bottom: auto;
        transform: translate(4%, -200%);
        margin: 7.5vw;
        text-align: center;
    }

    .contact-banner-text h1 {
        font-size: 7vw;
    }

    .contact-banner-text p {
        font-size: 3.5vw;
    }

    .section-contact-banner img {
        margin-top: 0vw;
        height: 190vw;
        width: 100%;
        object-fit: cover;
        display: block;
    }

    .section-form div img {
        width: 100%;
    }
}