/* Rejillas de Loop Grid cuyo contenido se centra cuando no llena la fila. */

/*
 * Elementor reparte la fila en tantas columnas como diga --grid-columns, todas de 1fr: las
 * columnas vacías siguen ocupando su espacio, así que una tarjeta de cuatro posibles quedaba
 * pegada a la izquierda con todo el hueco a la derecha.
 *
 * La rejilla pasa aquí a ser una fila flexible, que sí sabe centrar lo que le sobra. Cada
 * tarjeta conserva exactamente el ancho que tenía —el de una columna—, y así se centra
 * cualquier fila incompleta, incluida la última cuando el equipo no es múltiplo de la fila.
 *
 * Las medidas salen de los propios ajustes de Elementor: --grid-columns cambia solo en cada
 * punto de quiebre (4 / 2 / 1 en esta página) y --grid-column-gap lleva la separación, con los
 * 30px que Elementor usa por defecto. Cambiar columnas o separación en el editor sigue mandando.
 */
.histamai-grid-centrada .elementor-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.histamai-grid-centrada .elementor-grid > .e-loop-item {
	flex: 0 0
		calc(
			(100% - (var(--grid-columns, 1) - 1) * var(--grid-column-gap, 30px)) /
				var(--grid-columns, 1)
		);
	max-width: 100%;
}
