How to reverse grid on mobile (manual control not visable)

Hi! I want to reverse the grid layout order on mobile in the header section so the images display before the text, however, the manual controls aren’t there… any suggestions? Thanks


Here is my site Read-Only: Webflow - AFA

If you find that the native options within the Webflow grid system lack the requisite functionality to rearrange grid elements optimally for distinct mobile breakpoints, a recommended approach involves leveraging supplementary nested grids or flex containers nested within the primary grid structure. This strategic nesting can yield a heightened degree of command over element disposition for varying breakpoints, thereby circumventing limitations apparent in the conventional toolset. By orchestrating intricate cascades of cascading style sheet (CSS) code, it is conceivable to architect a bespoke layout blueprint tailored to the intricacies of mobile visualization. Subsequently, this architectural blueprint may be fine-tuned to enact the desired reordering of constituent elements, offering a superlative resolution to the quandary at hand.

@media (max-width: 767px) {
  .grid-container {
    display: grid;
    grid-template-columns: 1fr;
    /* Add any other grid settings you need */

    /* Reorder grid items for mobile */
    grid-template-areas:
      "element1"
      "element3"
      "element2";
  }
}

Thanks, but that seems like overkill! Does someone have a simple solution?