/* =============================================
   CONTACTO PAGE
   assets/css/contacto.css
   ============================================= */

.section-contacto { background:var(--c-bg-alt); }

/* Two-column layout */
.contact-grid {
  display:grid;
  grid-template-columns:1fr 1.5fr;
  gap:5rem; align-items:start;
}

/* ---- Left: info column ---- */
.contact-info p {
  color:var(--c-text-soft); font-size:1.03rem;
  line-height:1.8; margin-bottom:1.5rem;
}

.contact-direct { margin-bottom:2.5rem; }

.contact-email-link {
  display:inline-flex; align-items:center; gap:.75rem;
  color:var(--c-navy); font-weight:700; font-size:1rem;
  padding:.75rem 1.25rem;
  border:1.5px solid var(--c-border);
  border-radius:var(--radius);
  transition:all var(--t);
  word-break:break-all;
}
.contact-email-link svg { width:18px; height:18px; flex-shrink:0; }
.contact-email-link:hover {
  border-color:var(--c-gold); color:var(--c-gold);
  background:rgba(201,168,76,.05);
}

.contact-social-title {
  font-size:.72rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--c-gold); margin-bottom:1rem; display:block;
}

.contact-social-links {
  display:flex; gap:.75rem; flex-wrap:wrap;
}

.contact-social-links a {
  width:44px; height:44px;
  display:flex; align-items:center; justify-content:center;
  background:var(--c-card);
  border:1.5px solid var(--c-border);
  border-radius:8px; color:var(--c-text-soft);
  transition:all var(--t);
}
.contact-social-links a svg { width:18px; height:18px; }
.contact-social-links a:hover {
  border-color:var(--c-gold); color:var(--c-gold);
  transform:translateY(-2px);
  box-shadow:0 4px 14px rgba(201,168,76,.18);
}

/* ---- Right: form card ---- */
.contact-form-wrap {
  background:var(--c-card);
  border:1.5px solid var(--c-border);
  border-radius:14px; padding:2.75rem;
  box-shadow:var(--shadow-md);
}

/* ---- Form elements ---- */
.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.25rem;
}

.form-group {
  display:flex; flex-direction:column; gap:.5rem;
  margin-bottom:1.5rem;
}
.form-group:last-of-type { margin-bottom:2rem; }

.form-group label {
  font-family:var(--ff-sans); font-size:.78rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--c-text-soft);
}

.form-group input,
.form-group textarea,
.form-group select {
  width:100%; padding:.85rem 1.1rem;
  background:var(--c-bg);
  border:1.5px solid var(--c-border);
  border-radius:var(--radius);
  font-family:var(--ff-sans); font-size:.95rem;
  color:var(--c-text); line-height:1.5;
  transition:border-color var(--t), box-shadow var(--t);
  outline:none; resize:vertical;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  border-color:var(--c-gold);
  box-shadow:0 0 0 3px rgba(201,168,76,.12);
}

.form-group input::placeholder,
.form-group textarea::placeholder {
  color:var(--c-text-soft); opacity:.55;
}

.form-group textarea { min-height:150px; }

.btn-submit {
  width:100%; justify-content:center;
  font-size:.95rem; padding:1rem 2rem; letter-spacing:.08em;
}

/* ---- Success state ---- */
.contact-success {
  text-align:center; padding:3rem 2rem;
}
.contact-success-icon {
  width:64px; height:64px; margin:0 auto 1.5rem;
  display:flex; align-items:center; justify-content:center;
  background:rgba(201,168,76,.12); border:2px solid var(--c-gold);
  border-radius:50%; font-size:1.6rem; color:var(--c-gold);
}
.contact-success h3 {
  font-family:var(--ff-serif); font-size:1.5rem;
  font-weight:700; color:var(--c-navy); margin-bottom:.75rem;
}
.contact-success p {
  color:var(--c-text-soft); font-size:1rem; line-height:1.7;
}

/* ---- Responsive ---- */
@media (max-width:900px) {
  .contact-grid { grid-template-columns:1fr; gap:3rem; }
}
@media (max-width:600px) {
  .form-row { grid-template-columns:1fr; gap:0; }
  .contact-form-wrap { padding:2rem 1.5rem; }
}