/* ==========================================================================
   aq-check-list — lista con ícono de check dorado.
   12 apariciones, dentro de las cards de Servicios.

   Estructura (aplicar list-unstyled de Bootstrap en el HTML, no repetir
   aquí el reseteo de list-style que ya resuelve esa utilidad):
   <ul class="aq-check-list list-unstyled">
     <li class="aq-check-list__item">
       <span class="aq-check-list__icon"><i class="bi bi-check-lg"></i></span>
       Texto del ítem
     </li>
   </ul>
   ========================================================================== */

/* El bloque completo se centra horizontalmente dentro de la card (cambio
   de diseño posterior a la maqueta original): align-self:center anula
   el stretch por defecto de un hijo flex en columna (aq-card) y reduce
   el ancho del <ul> al de su contenido, en vez de ocupar todo el ancho
   de la card. Adentro, cada ítem sigue siendo flex row con
   align-items:flex-start (icono + texto alineados ENTRE ELLOS, a la
   izquierda) — el texto de cada ítem nunca se centra: con largos
   distintos los checks quedarían en zigzag. */
.aq-check-list {
	align-self: start;
  display: flex;
  flex-direction: column;   /* coloca los ítems en columna */
  color: var(--aq-gold-2);   
}

.aq-check-list__item {
	display: flex;
	align-items: flex-start;
	gap: var(--aq-space-3);
}

.aq-check-list__item + .aq-check-list__item {
	margin-top: var(--aq-space-2);
}

.aq-check-list__icon {
	display: inline-flex;
	flex-shrink: 0;
	color: var(--aq-gold);
	line-height: var(--aq-lh-body);
  font-size: var(--aq-fs-body);
}