/* Contacto: banda rosa palo bajo el festón de colaboraciones.
   Título y botón de WhatsApp; al lado (desde 48rem, 768 px) el correo y el teléfono.
   Depende de tokens.css, base.css y .boton. */

.contacto__interior {
  display: grid;
  gap: var(--espacio-6);
}

.contacto__principal {
  display: grid;
  justify-items: start;
  gap: var(--espacio-5);
}

.contacto__titulo {
  margin-bottom: 0;
}

.contacto__medios {
  display: grid;
  gap: var(--espacio-4);
  margin: 0;
}

.contacto__etiqueta {
  color: var(--texto-suave);
  font-size: var(--texto-chico);
}

.contacto__valor {
  margin: 0;
}

.contacto__enlace {
  display: inline-flex;
  align-items: center;
  min-height: var(--objetivo-tactil);
  color: var(--texto-marca);
  font-family: var(--fuente-display);
  font-size: var(--texto-tarjeta);
  text-underline-offset: 0.2em;
  overflow-wrap: anywhere;
}

@media (min-width: 48rem) {
  .contacto__interior {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: var(--espacio-8);
  }
}