/* contacto · equivalente a la página "contact" de 619. Casi todo viene de la base (7.4, 8.4, F09, F15, F19). */

/* rótulo «Atendemos en español e inglés.»: si parte en dos líneas (teléfono), que respire */
.page-contacto .cols--contact > .col--text > .eyebrow { line-height: 1.6; text-wrap: balance; }

/* canales directos: el teléfono grande y, debajo, WhatsApp y correo más pequeños. Cada uno es un enlace con 44 px de
   toque; el subrayado fino de la base (F09) se dibuja 2 px bajo el texto, no al pie de la zona de toque. */
.page-contacto .cols--contact > .col--text > .phone { margin-top: 12px; }
.page-contacto .cols--contact > .col--text > .contacto__canal {
  margin-top: 0;
  font-size: .9375rem; font-weight: var(--fw-small); line-height: 1;
  letter-spacing: .04em;
}
.page-contacto .col--text a {
  display: inline-flex; align-items: center; min-height: 44px;
  padding: 12px 0;
  color: var(--c-accent-text);
  background-position: 0 calc(100% - 10px), 0 calc(100% - 10px);
}
.page-contacto .col--text .phone a { line-height: 22px; padding: 11px 0; background-position: 0 calc(100% - 8px), 0 calc(100% - 8px); }
.page-contacto .col--text .contacto__canal a { line-height: 20px; }
/* 15-oct: cada canal con su ícono de línea (base .icon-inline): teléfono, WhatsApp y correo. El ícono va en acento y
   el filete del enlace solo bajo el texto; el teléfono, más grande, lleva un ícono algo mayor */
.page-contacto .col--text a.icon-inline { gap: 14px; }
.page-contacto .col--text .phone a.icon-inline > .icon { width: 24px; height: 24px; }
.page-contacto .contacto__siguiente a.icon-inline { gap: 12px; }

/* el campo con error deja ver su mensaje sin empujar al vecino de fila fuera de línea */
.page-contacto .form__row { align-items: flex-start; }

/* estado final: sustituye al formulario en su misma caja (estilo .form-done de la base) */
.page-contacto .cols--contact > .col > .contacto__gracias { padding-top: 20px; padding-bottom: 60px; }
.page-contacto .contacto__gracias-t { margin-bottom: 1rem; text-wrap: balance; }
@media (max-width: 991.98px) { .page-contacto .contacto__gracias-t { letter-spacing: -.035em; word-spacing: .06em; } }
.page-contacto .contacto__gracias > p:not(.note) { max-width: 30rem; margin-left: auto; margin-right: auto; text-wrap: balance; }
.page-contacto .contacto__siguiente {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 0 40px;
  margin-top: 28px;
}
.page-contacto .contacto__siguiente a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 12px 0;
  background-position: 0 calc(100% - 10px), 0 calc(100% - 10px);
  line-height: 20px;
}
.page-contacto .contacto__gracias > .note { margin: 32px auto 0; }

@media (max-width: 767px) {
  .page-contacto .cols--contact > .col > .contacto__gracias { padding-top: 40px; padding-bottom: 20px; }
  .page-contacto .contacto__siguiente { gap: 0 28px; }
}

/* el enlace legal no se parte entre dos líneas */
.page-contacto .legend--consent a { white-space: nowrap; }
/* 15-oct: ENVIAR nunca queda debajo del botón flotante de WhatsApp (base, sección 20: 56 px a 24 px de la esquina;
   52 a 16 bajo 768). Hasta 1599 la fila termina a 40-100 px del borde: ENVIAR se aparta 56 px y queda a ≥ 16 px del
   círculo. En teléfono va a la izquierda, debajo de «* Campos obligatorios», alineado con los campos */
@media (min-width: 768px) and (max-width: 1599.98px) {
  .page-contacto .form__foot .btn--submit { margin-right: 96px; }
}
@media (max-width: 767.98px) {
  .page-contacto .form__foot { flex-direction: column; align-items: flex-start; gap: 20px; }
}