.contact-form-container {
    width: 80vw;
    margin-top: var(--space-6-x);
}

@media screen and (min-width: 920px) {
    .contact-form-container {
        width: 55vw;
    }   
}

.contact-form-container form {
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 920px) {
    .contact-form-container form {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

.contact-form-container form label {
    display: block;
}

.contact-form-container form p {
    margin: 0;
    padding: 1em;
}

.contact-form-container form .block {
    grid-column: 1 / 3;
}

.contact-form-container form button,
.contact-form-container form input,
.contact-form-container form textarea {
    width: 100%;
}

/* CONTACT INFO */
.contact-info {
    background: #000;
}

.contact-info h4, .contact-info ul, .contact-info p {
    text-align: center;
    margin: 0 0 1rem 0;
}

/* LARGE SIZE */
@media(min-width: 700px) {

    .contact-wrapper {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-top: 2rem;
    }
    .contact-info h4,
    .contact-info ul,
    .contact-info p {
        text-align: left;
    }
}


/* :::Ventana Modal:::*/
#btn-modal{
    display: none;
}
.container-modal{
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0; left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 100;
}
#btn-modal:checked ~ .container-modal{
    display: flex;
}
.content-modal{
    width: 100%;
    max-width: 400px;
    padding: 20px;
    background-color: #6E2139;
    border-radius: 2px;
}
.content-modal h2{
    margin-bottom: 15px;
}
.content-modal p{
    padding: 15px 0px;
    border-top: 1px solid #dbdbdb;
    border-bottom: 1px solid #dbdbdb;
}
.content-modal .btn-cerrar{
    width: 100%;
    margin-top: 15px;
    display: flex;
    justify-content: flex-end;
}
.content-modal .btn-cerrar label{
    padding: 7px 10px;
    background-color: #52B194;
    color: #fff;
    border-radius: 4px;
    cursor: pointer;
    transition: all 300ms ease;
}
.content-modal .btn-cerrar label:hover{
    background-color:#2f8f72;
}
.cerrar-modal{
    width:100%;
    height: 100vh;
    position: absolute;
    top:0; left: 0;
    z-index: -1;
}
@media screen and (max-width:800px) {
    .content-modal{
        width: 90%;
    }
}


.intel{
    text-align: center;
}

.btn-primary {
    /* background-color: rgba(94, 110, 96); */
    padding: 12px;
    font-size: 16px;
    border-radius: 5px;
    width: 200px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.btn-contact {
    background-color: var(--au-purple-opacity);
    border-color: var(--au-purple-opacity);
  }
  
.btn-contact:hover {
    background-color: var(--au-purple);
    border-color: var(--au-purple);
  }