Wizard step overflow-y-hidden not hiding child elements from other steps

I'm using the Form Builder with Wizard layout to organize a large form into steps for the user. Step 1 is short, just basic contact info, but steps 2 and 3 are much longer and contain combinations of sections and repeaters. The issue is on step 1 there is a ton of empty scroll space at the bottom of the page and when inspecting the code, it looks like the elements in steps 2 & 3 are causing this. Doesn't look like h-0 overflow-y-hidden is observed. When I replace x-bind:class="{ 'invisible h-0 overflow-y-hidden': step !== @js($getId()) }" with x-bind:class="{ 'hidden h-0 overflow-y-hidden': step !== @js($getId()) }" it seems to get rid of the empty space. So my question is why couldn't we just use hidden/display:none to hide tabs out of focus, or if someone knows a solution or what I am doing wrong that would also be great. P.S. I am using a custom theme, but I updated to the latest versions of Tailwind and it still happens when I disable the custom theme.