/* ═══════════════════════════════════════════════════════════════════════════
   CONTACTO — Despacho Tirzo & Bautista Abogados
   Layout editorial: formulario (izq) + panel de datos (der). Consume tokens.
   ═══════════════════════════════════════════════════════════════════════════ */

.contact-grid {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr;
  gap: var(--sp-8);
  align-items: start;
}
.contact-grid > * { min-width: 0; }

/* ── Formulario ── */
.contact-form { }
.contact-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
.contact-form .field--full { grid-column: 1 / -1; }

.contact-form__notice {
  margin-top: var(--sp-4);
  color: var(--c-text-soft);
  font-size: var(--fs-sm);
}

.privacy-check {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-3);
  margin-block: var(--sp-4) var(--sp-5);
  color: var(--c-text-soft);
  font-size: var(--fs-sm);
  line-height: 1.5;
}
.privacy-check input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 2px;
}
.privacy-check a { color: var(--c-navy); text-decoration: underline; }
.privacy-check a:hover { color: var(--c-navy-dark); }

/* Mensaje de estado tras enviar */
.form-status {
  margin-top: var(--sp-4);
  padding: var(--sp-3) var(--sp-4);
  background-color: var(--c-surface);
  color: var(--c-navy);
  font-weight: var(--fw-medium);
  display: none;
}
.form-status.is-shown { display: block; }

/* ── Panel de datos de contacto ── */
.contact-info {
  background-color: var(--c-navy);
  color: var(--c-white);
  padding: var(--sp-8);
}
.contact-info h2 { color: var(--c-white); font-size: var(--fs-2xl); margin-bottom: var(--sp-5); }
.contact-info__item { display: flex; gap: var(--sp-3); margin-bottom: var(--sp-5); }
.contact-info__item > div { min-width: 0; }
.contact-info__item svg { width: 22px; height: 22px; flex: 0 0 auto; color: var(--c-white); margin-top: 2px; }
.contact-info__label { font-size: var(--fs-sm); color: rgba(255, 255, 255, 0.7); }
.contact-info__value { font-weight: var(--fw-medium); overflow-wrap: anywhere; }
.contact-info__value a { color: var(--c-white); }
.contact-info__value a:hover { color: var(--c-white); text-decoration: underline; }

.contact-info__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-top: var(--sp-2);
  background-color: var(--c-white);
  color: var(--c-navy);
  padding: 0.75rem 1.25rem;
  font-weight: var(--fw-medium);
  transition: background var(--t-fast);
}
.contact-info__cta:hover { background-color: var(--c-surface); color: var(--c-navy-dark); }
.contact-info__cta svg { width: 20px; height: 20px; color: currentColor; margin: 0; }

/* ───────────────────────────── RESPONSIVE ─────────────────────────────────── */
@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .contact-form__row { grid-template-columns: 1fr; }
}