[UI Bug] Hero 3D Globe Animation Overlaps Content Sections and Obscures Page Elements

[itsmitalijadhav06-beep]

The 3D globe animation in the hero section extends beyond its intended container and overlaps subsequent content sections. This causes text, cards, and UI elements to be partially obscured, reducing readability and negatively affecting the user experience.

Steps to Reproduce
Open the Agri-Vision landing page.
Scroll through the hero section.
Observe the 3D globe animation.
Notice that the animation extends into adjacent content sections and overlaps page elements.

Expected Behavior
The hero animation should remain confined to its designated section and should not overlap or obscure other content.

Actual Behavior
The animation extends beyond its container boundaries and visually interferes with nearby content sections.

Impact
Reduced readability of content
Broken visual hierarchy
Inconsistent layout across screen sizes and themes
Poor user experience, especially on smaller displays

Screenshots

[itsmitalijadhav06-beep]

Hi @neeru24, I have identified and reported this UI issue. I would like to work on fixing the hero animation overlap and ensuring proper responsive behavior across different screen sizes. Kindly assign this issue to me under GSSoC'26. Thank you.

[itsmitalijadhav06-beep]

Hi @neeru24,

I tested the latest codebase locally on both desktop and mobile viewports and was unable to reproduce the globe overlap shown in the issue screenshots.

Current observations:

• The 3D globe remains within its designated container.
• No overlap with adjacent content sections was observed.
• Layout appears consistent across tested screen sizes.

I have attached screenshots from my local testing.

Could you please confirm whether this issue is still reproducible on the latest version or provide any specific browser/device where it still occurs?

Thank you.