Improve homepage CTA buttons with responsive sizing, icons, and visual consistency

[JatsuAkaYashvant]

Is your feature request related to a problem? Please describe.

The current "For Teachers" and "For Contributors" buttons on the homepage have inconsistent widths due to varying text lengths, which creates:

1. Visual imbalance that makes the UI look unpolished
2. Potential readability issues on small screens
3. A perception of inconsistency in our design system

Describe the solution you'd like

I propose implementing responsive, uniform-width buttons with:

1. Equal minimum widths (180px for desktop, 140px for mobile)
2. Support for leading icons (🎓 for Teachers, 👥 for Contributors)
3. Responsive behavior:
   • Horizontal layout on wide screens (>500px)
   • Vertical stacking on narrow screens
4. Proper overflow handling using FittedBox or TextOverflow.ellipsis

Describe alternatives you've considered

1. Text abbreviation ("For Teachers" → "Teachers") (reduces clarity)
2. Tooltips for truncated text (adds interaction complexity)

Additional context

Current vs Proposed Comparison:

Current :

Proposed :

Are you working on this? (Yes/No)

Yes

[JatsuAkaYashvant]

@hardik17771 I have made a PR(#322) to fix this issue with :

✅ Responsive button widths ✅ Teacher/contributor icons ✅ Overflow fixes

Would appreciate your review when convenient. Thank you!

[hardik17771]

Sure @JatsuAkaYashvant , let me review it once.