/* CONTACT SECTION */
.contact_container{
  padding:40px 10%;
  background:var(--background-section);
}

.contact_container h1{
  text-align:center;
  margin-bottom:10px;
}

.contact_intro{
  text-align:center;
  max-width:650px;
  margin:auto;
  margin-bottom:40px;
  color:var(--text-secondary);
}

.contact_grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:30px;
}

.contact_card{
  background:var(--background-card);
  border:1px solid var(--border-light);
  border-radius:10px;
  padding:25px;
  display:flex;
  flex-direction:column;
  gap:15px;
}

.contact_card h2{
  color:var(--primary);
}

/* FORMULARIO */

.contact_form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.contact_form label{
  font-size:0.9rem;
}

.contact_form input,
.contact_form textarea{
  border:1px solid var(--border-light);
  padding:8px;
  border-radius:6px;
  font-family:inherit;
}

.contact_form textarea{
  resize:vertical;
}

.checkbox_group{
  display:flex;
  gap:8px;
  align-items:flex-start;
  font-size:0.85rem;
  color:var(--text-secondary);
}

.contact_form button{
  margin-top:10px;
  padding:10px;
  border-radius:6px;
  background:var(--primary);
  color:white;
  cursor:pointer;
}

.contact_form button:hover{
  background:var(--primary-hover);
}

/* MAPA */

.map_container{
  width:100%;
  height:250px;
  border-radius:8px;
  overflow:hidden;
}

.map_container iframe{
  width:100%;
  height:100%;
  border:0;
}

.contact_info{
  font-size:0.9rem;
  color:var(--text-secondary);
  display:flex;
  flex-direction:column;
  gap:10px;
}

.social_buttons {
  display: flex;
  padding-top: 25px;
  gap: 10px;
  justify-content: end;
}

.social img {
  width: 35px;
  height: 35px;
}

/* MOBILE VERSION */
@media (max-width: 768px){
  /* CONTACT SECTION */
  .contact_container{
    padding:40px 20px;
    background:var(--background-section);
  }
}