Change the Transform Origin/Anchor Point of even items in CMS

Hi!

So, I have a 2 column grid, with items (which are just square divs) in each column, linked to a CMS. My goal is for both left and right items, on first click, to scale up and move in to the centre of the screen, then on second click, move and scale down back to their original position. I have set the transform origin point of the item to be top left, which works for the left column, however haven’t been able to find a way to change the transform origin of the items in the right column (even items) to be top right.

I have tried adding another class (with origin transform top right) to the even items via the designer, custom CSS and Finsweet’s add class tool, but no success so far.

I’ve a somewhat dodgy workaround where I’ve basically split the grid in to two 1 column grids, side by side, still using only one collection list with a switch filter to tell which item should be in which side, allowing me to create unique classes for left and right items. But I’m now running in to order issues across different breakpoints with this route.

Any ideas?

Thanks,
Adam