Test/UI hero section responsive

[amna-sehgal]

Description

Fixes #1527

This PR adds and finalizes unit tests for the HeroSection (Variation 2) component. It verifies that the component renders correctly, including the main heading and supporting text content, and ensures stable rendering across simulated mobile and tablet viewport conditions.

All previous test failures related to incorrect visibility matchers and unsupported assertions have been resolved in compliance with React Testing Library best practices.

Pillar

• 🎨 Pillar 1 — New Theme Design
• 📐 Pillar 2 — Geometric SVG Improvement
• 🕐 Pillar 3 — Timezone Logic Optimization
• 🛠️ Other (Bug fix, refactoring, docs)

Visual Preview

Not applicable (unit test changes only)

Checklist before requesting a review:

• I have read the CONTRIBUTING.md file.
• I have tested these changes locally (npx vitest run)
• I have run npm run format and npm run lint locally and resolved all errors (CI will fail otherwise).
• My commits follow the Conventional Commits format (e.g., test(ui): ...).
• I have updated README.md if required.
• I have started the repo.
• I have made sure that i have only one commit to merge in this PR.
• The SVG output matches the CommitPulse "premium quality" aesthetic standard (no raw elements, smooth animations, correct fonts).
• (Recommended) I joined the CommitPulse Discord community for contributor discussions, mentorship, and faster PR support.

[vercel]

@amna-sehgal is attempting to deploy a commit to the jhasourav07's projects Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

🚨 Hey @amna-sehgal, the CI Pipeline is failing on this PR and it has been marked as status:blocked.

Please fix the issues before this can be reviewed. Here's how:

1. Run checks locally before pushing:

npm run format:check   # Check Prettier formatting
npm run lint           # Run ESLint
npm run typecheck      # TypeScript type check
npm run test           # Run unit tests (Vitest)
npm run build          # Verify production build passes

2. Auto-fix common issues:

npm run format         # Auto-fix formatting with Prettier
npm run lint -- --fix  # Auto-fix lint errors where possible

3. Check the full failure log here:
👉 View CI Run

Once you push a fix and the CI passes, the status:blocked label will be removed automatically. 💪

.

[Aamod007]

Unapproving — this PR has the \status:blocked\ label. Please resolve the blocking issue and re-request review.

[Aamod007]

This PR has the \status:blocked\ label. Please resolve the blocking issue first.

[Copilot]

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

[Aamod007]

Unapproving — this PR has a
eeds-rebase\ or \status:blocked\ label. Please resolve that first and re-request review.