Content Overflow Behind Navbar - Page elements appear above fixed navbar when scrolling

[Deepak-negi11]

Current Behavior

When scrolling down the page, basically ALL the buttons and content overlap with the navbar. It's not just one or two buttons - literally everything that scrolls goes behind the fixed navbar. The "Catalog" heading, "Learn More" button, "Tutorials" button, "Join Our Open Source Community" button, "Join the community" section - all of them overlap with the navbar as you scroll.

Expected Behavior

• The navbar should always stay on top of everything
• All buttons and content should respect the navbar and stay below it
• Nothing should ever appear behind the navbar, no matter how much you scroll

Screenshots/Logs

This is happening with every scrollable element on the page. The navbar with the Meshery logo and theme toggle stays in place, but everything else goes right through it.
Contributing

To Reproduce

1. Go to https://play.meshery.io/
2. Scroll down through all the sections
3. Every button and heading overlaps the navbar
4. Affected elements: All buttons overflow - Choose Your Playground, Tutorials, Learn More, Join Our Open Source Community

Technical Details

This is definitely a z-index issue. The navbar needs a much higher z-index value so everything stays behind it when scrolling. Or maybe the content needs proper padding/margin adjustment to account for the fixed navbar height.

I AM WORKING ON THIS ISSUE

[kishore08-07]

@Deepak-negi11 Closing this issue as it is a duplicate of #271.