.gwba-flex {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: stretch;
}

.gwba-flex--dir-column {
	flex-direction: column;
}

.gwba-flex--wrap {
	flex-wrap: wrap;
}

.gwba-flex--jc-start {
	justify-content: flex-start;
}

.gwba-flex--jc-center {
	justify-content: center;
}

.gwba-flex--jc-end {
	justify-content: flex-end;
}

.gwba-flex--jc-between {
	justify-content: space-between;
}

.gwba-flex--jc-around {
	justify-content: space-around;
}

.gwba-flex--ai-start {
	align-items: flex-start;
}

.gwba-flex--ai-center {
	align-items: center;
}

.gwba-flex--ai-end {
	align-items: flex-end;
}

/* Responsive — mismos breakpoints que Grid (gwba-structure.scss); gaps reusan .gpa_c-gap-N{suffix}/.gpa_r-gap-N{suffix} ya definidas ahí */
@media (max-width: 1537px) {
	.gwba-flex--dir-column_p { flex-direction: column; }
	.gwba-flex--wrap_p { flex-wrap: wrap; }
	.gwba-flex--nowrap_p { flex-wrap: nowrap; }
}

@media (max-width: 1367px) {
	.gwba-flex--dir-column_sp { flex-direction: column; }
	.gwba-flex--wrap_sp { flex-wrap: wrap; }
	.gwba-flex--nowrap_sp { flex-wrap: nowrap; }
}

@media (max-width: 1080px) {
	.gwba-flex--dir-column_ht { flex-direction: column; }
	.gwba-flex--wrap_ht { flex-wrap: wrap; }
	.gwba-flex--nowrap_ht { flex-wrap: nowrap; }
}

@media (max-width: 896px) {
	.gwba-flex--dir-column_vt { flex-direction: column; }
	.gwba-flex--wrap_vt { flex-wrap: wrap; }
	.gwba-flex--nowrap_vt { flex-wrap: nowrap; }
}

@media (max-width: 768px) {
	.gwba-flex--dir-column_m { flex-direction: column; }
	.gwba-flex--wrap_m { flex-wrap: wrap; }
	.gwba-flex--nowrap_m { flex-wrap: nowrap; }
}