/*==================================
HERO
===================================*/

.page-hero.contacto{

    position:relative;

    min-height:400px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:url("../img/hero/hero-home.jpg") center center;
    background-size:cover;
    overflow:hidden;

}

.hero-overlay{

    position:absolute;
    inset:0;

    background:linear-gradient(
        rgba(8,22,45,.72),
        rgba(8,22,45,.72)
    );

}

.page-content{

    position:relative;
    z-index:2;

    max-width:850px;

    text-align:center;

}

.page-content .section-tag{

    color:#7ea4dc;

    letter-spacing:5px;

    font-size:14px;

    font-weight:700;

}

.page-content h1{

    color:#fff;

    font-size:60px;

    line-height:1.15;

    margin:20px 0;

}

.page-content p{

    color:rgba(255,255,255,.9);

    font-size:20px;

    line-height:1.8;

}


/*==================================
      INFORMACIÓN CONTACTO
===================================*/

.contact-info-section{

    padding:120px 0;

    background:#ffffff;

}

.contact-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:90px;

    align-items:center;

}

.contact-photo img{

    width:100%;

    height:600px;

    display:block;

    object-fit:cover;

    border-radius:18px;

    box-shadow:var(--shadow);

}

.contact-info h2{

    font-size:44px;

    color:var(--color-primary-dark);

    margin:20px 0 30px;

    line-height:1.2;

}

.contact-info>p{

    font-size:18px;

    line-height:1.9;

    color:var(--color-text-light);

    margin-bottom:45px;

}

.contact-item{

    padding-bottom:24px;

    margin-bottom:24px;

    border-bottom:1px solid #ececec;

}

.contact-item:last-child{

    margin-bottom:0;

    padding-bottom:0;

    border:none;

}

.contact-item h3{

    color:var(--color-primary);

    font-size:20px;

    margin-bottom:8px;

}

.contact-item p,

.contact-item a{

    color:var(--color-text-light);

    line-height:1.8;

    text-decoration:none;

    transition:.3s;

}

.contact-item a:hover{

    color:var(--color-primary);

}





/*==================================
            MAPA
===================================*/

.contact-map-section iframe{

    width:100%;

    height:600px;

    border:0;

}

.contact-map-section iframe{

    width:100%;

    height:550px;

    border:none;

}


/*==================================
          RESPONSIVE
===================================*/

@media(max-width:992px){

    .page-content h1{

        font-size:52px;

    }

    .contact-grid{

        grid-template-columns:1fr;

        gap:50px;

    }

    .contact-photo img{

        height:450px;

    }

    .form-grid{

        grid-template-columns:1fr;

    }

}

@media(max-width:768px){

    .page-hero{

        height:380px;

    }

    .page-content h1{

        font-size:42px;

    }

    .contact-info h2{

        font-size:36px;

    }

    .form-header h2{

        font-size:38px;

    }

    .contact-map-section iframe{

        height:420px;

    }

}