/* Contactos - layout mais consistente com estilo do site */

/* --- Layout base --- */
.contacto-grid{
  display:grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 60px;
  align-items:start;
}

/* Cards do lado esquerdo */
.info-card{
  display:flex;
  align-items:center;
  gap:18px;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  padding: 18px 20px;
  box-shadow: 0 10px 30px rgba(0,0,0,.03);
}

.info-card i{
  width:52px;
  height:52px;
  border-radius: 16px;
  background: rgba(59,130,246,.12);
  color: var(--cor-secundaria);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 1.35rem;
}

.info-card h4{
  margin:0;
  font-size: .9rem;
  color:#64748b;
  text-transform: uppercase;
  letter-spacing:.06em;
  font-weight:800;
  text-align:left;
}

.info-card p{
  margin:4px 0 0 0;
  font-size: 1.05rem;
  color: var(--cor-primaria);
  font-weight:700;
  text-align:left;
}

/* Wrapper do formulário */
.contacto-form-wrapper{
  background:#fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  padding: 32px;
  box-shadow: 0 25px 50px -12px rgba(0,0,0,.06);
}

/* --- Floating labels: evitar sobreposição --- */
/* No contactos.php os inputs usam placeholder=" ", e o label vem depois.
   Solução: label invisível (sem bloquear) e só aparece “em cima” quando o campo está preenchido.
*/
.contacto-section .form-group{
  position: relative;
  margin: 0 0 14px 0;
  display: flex;
  flex-direction: column;
}

.contacto-section .form-group input,
.contacto-section .form-group textarea{
  width: 100%;
  box-sizing: border-box;
  padding: 12px 16px;
  margin: 0;
}

.contacto-section .form-group label{
  display: block !important;
  position: static !important;
  order: -1 !important;
  font-size: 0.9rem;
  color: var(--cor-primaria);
  font-weight: 700;
  margin-bottom: 8px !important;
  background: transparent !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}



/* Textos do card */
.contacto-form-card h3{ text-align:left; margin-top:0; }
.contacto-form-card p{ text-align:left; margin-top:0; margin-bottom:16px; }

/* Evitar que o modal/sobreposições do JS da página cubram o form */
#contact-form, #contact-form *{ z-index: 1; position: relative; }

/* --- Upload/textarea e espaçamentos --- */
.contacto-section textarea{
  resize: vertical;
}

/* Responsivo */
@media (max-width: 992px){
  .contacto-grid{ grid-template-columns: 1fr; gap: 40px; }
  .contacto-form-wrapper{ padding: 30px 20px; }
}

/* Mantém mapa bonito */
.google-map-container{
  margin-top: 26px;
  border-radius: 18px;
  overflow:hidden;
  box-shadow: var(--shadow-soft);
}