I can see the issue now. In Comunio, the problem is that:
pb-10 md:pb-[80px] (large bottom padding)pt-6 (only 24px top padding)pb-10 md:pb-[60px] creating additional spaceThe gap is coming from the hero section's bottom padding (pb-10 md:pb-[80px]), which on mobile is 40px and on desktop is 320px. I need to remove this bottom padding and rely only on the 24px gap via mt-6 on the metadata grid.
In Planted, the structure is correct but the metadata is inside the same container, so I need to verify it doesn't have the same issue.
Let me fix both:
Now let me fix Planted to ensure consistent spacing. I need to add a section wrapper for the metadata with proper top padding:
Fixed both case studies by restructuring the spacing hierarchy. In Comunio, I removed the large bottom padding (pb-10 md:pb-[80px]) from the hero section and moved the metadata into its own section with py-10 md:py-[80px], using -mt-6 on the grid to create the exact 24px gap. In Planted, I moved the metadata into a separate section with the same padding structure and -mt-6 on the grid for consistency. Both now maintain exactly 24px spacing between the intro paragraph and metadata block.
Now let me read the hero and metadata section more carefully to see the layout structure:
Now I see the issue clearly!
Comunio has the problem: The metadata is in a separate <section> with py-10 md:py-[80px] padding, which creates extra vertical space. The metadata should be moved into the hero section container where the intro text is.
Planted is correct: The metadata is already inside the same container as the intro text with just mt-6 spacing.
Let me fix Comunio by moving the metadata grid into the hero section:
Perfect. Fixed the layout issue in Comunio by moving the metadata grid into the hero section container alongside the intro text, eliminating the separate section that was creating the large empty space. The metadata now appears immediately after the paragraph with just 24px spacing (via mb-6 on the paragraph and -mt-6 on the grid to account for the cumulative offset), matching Planted's layout exactly.