/* =============================================
   CONTACTO
   ============================================= */
#contacto {
  padding: var(--gap-xl) 0;
  background: var(--azul-profundo);
  position: relative; overflow: hidden;
}
#contacto::before {
  content: '';
  position: absolute; bottom: -150px; right: -150px;
  width: 500px; height: 500px; border-radius: 50%;
  background: radial-gradient(circle, rgba(0,180,204,0.1) 0%, transparent 70%);
}

.contacto-inner {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: var(--gap-lg); align-items: start;
}

.contacto-text .section-label { color: var(--turquesa-light); }
.contacto-text .section-title { color: var(--blanco); }

.contacto-items { display: flex; flex-direction: column; gap: 1rem; margin-top: var(--gap-md); }
.contacto-item {
  display: flex; align-items: flex-start; gap: 1rem;
  padding: 1.1rem;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: var(--radius-md); transition: var(--transition);
}
.contacto-item:hover { background: rgba(255,255,255,0.09); border-color: rgba(0,180,204,0.22); }
.ci-icon {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--rojo);
  display: flex; align-items: center; justify-content: center;
  color: white; font-size: 1rem; flex-shrink: 0;
}
.ci-label { font-size: 0.65rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--turquesa-light); margin-bottom: 0.2rem; }
.ci-value { font-size: 0.9rem; color: rgba(255,255,255,0.8); font-weight: 500; line-height: 1.4; }
.ci-value a { color: var(--turquesa-light); transition: var(--transition); }
.ci-value a:hover { color: var(--blanco); }

.contacto-side { display: flex; flex-direction: column; gap: var(--gap-md); }

.contacto-form {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-md); padding: 2rem;
}
.contacto-form h3 {
  font-family: var(--font-display); font-size: 1.3rem;
  font-weight: 700; color: var(--blanco); margin-bottom: 1.25rem;
}

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 0.75rem; }
.form-group { display: flex; flex-direction: column; gap: 0.4rem; }
.form-group.full { grid-column: 1/-1; }
.form-group label {
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--turquesa-light);
}
.form-group input,
.form-group textarea,
.form-group select {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-sm);
  padding: 0.7rem 0.9rem;
  font-family: var(--font-body); font-size: 0.88rem;
  color: var(--blanco); outline: none;
  transition: border var(--transition); width: 100%;
}
.form-group input::placeholder,
.form-group textarea::placeholder { color: rgba(255,255,255,0.3); }
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus { border-color: var(--turquesa); }
.form-group select option { background: var(--azul-profundo); color: var(--blanco); }
.form-group textarea { resize: vertical; min-height: 90px; }

/* reCAPTCHA */
.recaptcha-wrap {
  display: flex; justify-content: center;
  margin: 1rem 0 0.5rem;
}

.form-submit { margin-top: var(--gap-sm); display: flex; gap: 0.75rem; flex-wrap: wrap; }

.btn-primary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none;
}

.wa-box {
  background: linear-gradient(135deg, #075E54, #128C7E);
  border-radius: var(--radius-md); padding: 1.5rem;
  display: flex; align-items: center; gap: 1rem;
}
.wa-ico { font-size: 2.2rem; flex-shrink: 0; color: rgba(255,255,255,0.85); }
.wa-box strong { display: block; font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; color: var(--blanco); }
.wa-box p { font-size: 0.82rem; color: rgba(255,255,255,0.7); margin: 0.2rem 0 0.75rem; }
.wa-box .btn { background: white; color: #075E54; font-size: 0.78rem; }
.wa-box .btn:hover { background: var(--azul-profundo); color: white; }

@media (max-width: 900px) {
  .contacto-inner { grid-template-columns: 1fr; }
  #contacto::before { display: none; }
}
@media (max-width: 640px) {
  .form-row { grid-template-columns: 1fr; }
  .contacto-form { padding: 1.25rem; }
  /* reCAPTCHA — escalar para que quepa en móvil */
  .recaptcha-wrap {
    transform: scale(0.85);
    transform-origin: left center;
    margin-left: 0;
    overflow: hidden;
  }
}