fix: layout alignment and hero background integration

[prasanthipallagani9-ops]

Description
This PR addresses layout alignment and rendering issues across the workspace panels, hero section, and responsive breakpoints. It refactors the CSS styling for clean element positioning and updates the associated HTML layout architecture to ensure consistency.

Key changes include:

• Fixed container and absolute positioning alignment within the hero section.
• Integrated the themed developer background pattern seamlessly into the hero layout.
• Cleaned up grid structure rules for the workspace layout panels.
• Standardized tabs, custom overlays, and badge alignment parameters.

Related Issue
Fixes #1104

Type of change

• Bug fix
• New feature / enhancement
• Documentation update
• Test addition
• Refactor

Checklist

• I have read CONTRIBUTING.md
• My branch is up to date with main
• I have run pytest -v and all tests pass
• I have not introduced duplicate issues or features
• My PR title follows the format: fix: layout alignment and hero background integration
• I have added tests for new features (Level 2 and 3 issues)
• No hardcoded secrets or API keys in my code
• This PR is linked to a GSSoC 2026 issue

Screenshots (if frontend change)
Test evidence

# Frontend layout/CSS change — Verified responsiveness and correct rendering via browser dev tools.

[imDarshanGK]

@prasanthipallagani9-ops resolve conflicts

[imDarshanGK]

@prasanthipallagani9-ops

[github-actions]

👋 This PR has had no activity for 7 days.

Please push updates or comment if you still need more time.

Inactive PRs may be closed automatically after 7 more days.