/*
Solo para referencia. Estas variables están definidas en style.css
:root {
    --dark-color: #333333;
    --dark-gray-color: #555555;
    --gray-color: #aaaaaa;
    --light-gray-color: #e7e7e7;
    --light-color: #ffffff;
    --primary-color: #1766ae;
    --secondary-color: #f39222;
    --terciary-color: #dd2727;
    --light-shadow: #00000038;
    --dark-blue-color: #183153;
    --transition: 250ms;
    --bold-font: 800;
    --thin-font: 300;
    --font-family-primary: 'Montserrat';
}
*/

.contact {
    width: 100%;
    .contact__content {
        width: 100%;
        padding: 0 2svw;
        display: flex;
        align-items: center;
        justify-content: center;
        .contact__box {
            width: 100%;
            max-width: 1400px;
            .wpcf7-form {
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: wrap;
                gap: 1rem;
                .hidden-fields-container {
                    display: none;
                }
                .contact__field {
                    width: calc(50% - 0.5rem);
                    margin: 1.5rem 0;
                    font-size: 1em !important;
                    p {
                        width: 100%;
                        .contact__input {
                            width: 100%;
                            padding: 0.5rem;
                            border-top: none;
                            border-left: none;
                            border-right: none;
                            border-bottom: 2px solid var(--dark-gray-color);
                        }
                    }
                }
                .contact__field.textarea-field {
                    p {
                        .contact__textarea {
                            width: 100%;
                            padding: 0.5rem;
                            border-top: none;
                            border-left: none;
                            border-right: none;
                            border-bottom: 2px solid var(--dark-gray-color);
                            height: 150px;
                            resize: vertical;
                        }
                    }
                }
                .contact__field.textarea-field, .contact__field.info, .contact__field.submit, .wpcf7-response-output {
                    width: 100%;
                }
                .contact__field.submit {
                    .contact__submit {
                        padding: 0.5rem 2rem;
                        background-color: transparent;
                        color: var(--primary-color);
                        border: 2px solid var(--primary-color);
                        border-radius: 99px;
                        transition: var(--transition);
                        &:hover {
                            background-color: var(--primary-color);
                            color: var(--light-color);
                            box-shadow: 0 0 10px var(--primary-color);
                        }
                    }
                }
                .contact__field.info {
                    margin: 0 0 1rem;
                }
                .wpcf7-response-output {
                    margin: 0;
                    text-align: center;
                }
            }
        }
    }
}

/* Casos puntuales (eliminar si no son necesarios más adelante) */
input[type="submit"] {
    font-size: 1em !important;
}

label {
    font-size: 1em !important;
}