Columns are not displaying correctly on mobile

I have a problem with the responsive stacking of items on beaverbuilder.


I am trying to replicate this mockup: Image 2022-04-29 at 5.24.00 PM, but on mobile, the ordering of the columns does not perform as expected.

I have set up 6 columns and placed one button in each column. On mobile, I have made sure three of these buttons are displayed by setting a custom column width of 33%.
Instead of displaying the first row, beaver builder displays the first 3 columns in the first row and then the first three columns in the second row. Why is that?

See this screenshot: Image 2022-04-29 at 5.29.03 PM
I would like the sequence to be 1-3-2-4