Creating grid layouts with both 3 column and full width - bound to collections

Hi all,

I am currently trying to work up a new customer testimonial page that is bound to a collection, within the page most of the customer cards (content) will be set within the 3 column grid, however, I want to highlight some featured customer cards as a full-width card. I am unable to figure out how to set this layout using the collections as the collections wrapper uses the same styling throughout, so I am unable to make the top row of my grid full-width as this makes them all full-width.

I have attached one of my draft mockup designs to show the layout I am after with the 3 columns vs the full-width. Currently, I am testing the build and have it set as new sections per ‘type/styling’ of the row I am after eg. a different section bound to the same collection (the first section being the first full width, the second section being the 3 col row, and the third section being the next full-width row etc). This means that the full collection on the page is separated which means the second 3 col grid doesn’t run on from the previous and starts again (duplicate). I hope I’ve explained it clearly, it’s hard to explain in writing :flushed:
There must be a better way and I am just missing it…? I am fairly new to using the CMS and understanding the functionality of it.
Thanks in advance!

Here is my mock testing site share link: (https://preview.webflow.com/preview/procurify-21f0d24b5ef65b63174a500499b22?utm_medium=preview_link&utm_source=designer&utm_content=procurify-21f0d24b5ef65b63174a500499b22&preview=a6516b2cf09352d3a3198b1802861ad2&pageId=602422470b0656bdf0aacb0a&mode=preview

Draft mockup designs