/* ==========================================================================
   aq-contact-info-item — ícono circular + etiqueta + valor.
   Usa el mismo aq-icon-circle (Fase 2.3) que Políticas y Equipo.

   Estructura:
   <div class="aq-contact-info-item">
     <span class="aq-icon-circle"><i class="bi bi-geo-alt"></i></span>
     <div>
       <p class="aq-contact-info-item__label aq-caption-label aq-caption-label--narrow">Etiqueta</p>
       <p class="aq-contact-info-item__value">Valor</p>
     </div>
   </div>
   ========================================================================== */

.aq-contact-info-item {
	display: flex;
	align-items: flex-start;
	gap: var(--aq-space-4);
}

.aq-contact-info-item + .aq-contact-info-item {
	margin-top: var(--aq-space-4);
}

/* Familia, tamaño, peso y mayúsculas vienen de .aq-caption-label
   (base/typography.css, aplicada en el HTML junto a esta clase); acá
   solo color y margen propios de este contexto. */
.aq-contact-info-item__label {
	color: black;
	margin-bottom: var(--aq-space-1);
}

.aq-contact-info-item__value {
	margin-bottom: 0;
  color: var(--aq-text-2);
}

.aq-contact-info-item__value a {
	color: inherit;
	text-decoration: none;
}

.aq-contact-info-item__value a:hover {
	color: var(--aq-gold);
}