[Docs] Fix layout overlap of video cards with footer on mobile viewport/resize

[dhruveshmishra]

Current Behavior

When navigating to the Videos section on the documentation website and changing the viewport to mobile width (or resizing the browser), the active video grid group overlaps the footer. The container height is only adjusted on a full page reload or category tab change, causing visual layout issues during live resizing or initial responsive load.

Expected Behavior

The parent video grid container should dynamically and automatically adapt its height to match the active tab's card grid in real-time. There should be no layout overlap with the footer when resizing the window, switching responsive modes, or when thumbnail images load.

I am providing you Screen Recording for the same

Screen.Recording.2026-06-19.at.10.36.55.PM.mov

Environment

• Host OS: Mac Linux Windows
• Browser: Chrome Safari Firefox Edge Opera

Contributor Guide and Resources

• 📚 Instructions for contributing to documentation
  • Layer5 documentation site and source
• 🎨 Wireframes and designs for Layer5 site in Figma (open invite)
• 🙋🏾🙋🏼 Questions: Layer5 Discussion Forum and Layer5 Community Slack

[welcome]

Thanks for opening this issue. A contributor will be by to give feedback soon. In the meantime, please review the Layer5 Community Welcome Guide and sure to join the community Slack.