Feature/responsive grid layouts

[Kunal1522]

📝 Description

Fixed uneven spacing in the "Experience Sugar" and "Stats" sections by restructuring grid layouts to display cards uniformly without awkward gaps in the last row.

Problem:

The Stats and "Experience Sugar" sections had uneven card distribution in the last row, creating visual inconsistency on the homepage.

Solution:

Restructured "Experience Sugar" to use a consistent 2-column grid layout
Updated Stats section to use a 2-3 layout (2 cards top, 3 cards bottom)
Cards now fill rows evenly without empty spaces in the last column
Result:
All cards display uniformly with proper spacing and a more polished homepage appearance.

🔄 Type of Change

• 📱 New Feature (new page, component, or functionality)
• 🎨 UI/UX Update (visual changes, styling improvements)
• 📖 Content Update (text changes, documentation)
• 🐛 Bug Fix
• ⚡ Performance Improvement
• ♿ Accessibility Enhancement
• 🔒 Security Update
• 📦 Dependency Update
• 🧹 Code Refactoring
• 🧪 Test Updates

📷 Visual Changes

BEFORE STATS SECTION:

AFTER STATS SECTION:

BEFORE TRY SECTION:

### AFTER TRY SECTION:

🧪 Testing Performed

📱 Browser Compatibility

• Chrome (Version: )
• Firefox (Version: )
• Safari (Version: )
• Edge (Version: )
• Mobile Chrome (Device: )
• Mobile Safari (Device: )

🖥️ Responsive Design

• Desktop (1200px+)
• Tablet (768px - 1199px)
• Mobile (320px - 767px)

✅ Test Cases

1. Verified grid displays 2 columns on desktop for 8 items
2. Confirmed buttons align at the same height across all cards regardless of text length
3. Tested carousel functionality on mobile with swipe gestures

♿ Accessibility

• Proper heading hierarchy maintained
• ARIA labels added where needed
• Color contrast requirements met
• Keyboard navigation works correctly
• Screen reader testing performed

📋 PR Checklist

• My code follows the project's coding style guidelines
• I have tested these changes locally
• I have updated the documentation accordingly
• My changes generate no new warnings or console errors
• I have added tests that prove my fix/feature works
• All existing tests pass successfully
• I have checked for and resolved any merge conflicts
• I have optimized images/assets (if applicable)
• I have validated all links are working correctly

📚 Reviewer Resources

• Contributing Guide
• Style Guide
• Community Chat

[github-actions]

🎉 All Checks Passed!

Status: ✅ Ready to merge

✅ Completed Workflows

Workflow	Status	Details
🔨 Continuous Integration	✅ Passed	Build completed successfully
📝 Code Linting	✅ Passed	All formatting and style checks passed

---

🚀 This PR is ready for review and can be safely merged to main branch!

Great work! Your code meets all quality standards. 👏

[Kunal1522]

@sa-fw-an please review this .

[sa-fw-an]

@Kunal1522 The Stats Part looks good. Just raise a PR for the Stats part only

[Kunal1522]

okay .should i raise a new pr or push changes into this one only?

[github-actions]

🎉 All Checks Passed!

Status: ✅ Ready to merge

✅ Completed Workflows

Workflow	Status	Details
🔨 Continuous Integration	✅ Passed	Build completed successfully
📝 Code Linting	✅ Passed	All formatting and style checks passed

---

🚀 This PR is ready for review and can be safely merged to main branch!

Great work! Your code meets all quality standards. 👏

[Kunal1522]

@Kunal1522 The Stats Part looks good. Just raise a PR for the Stats part only

now the changes are in only in stats parts .i have restored the original layout for try sections.
Thank you

[github-actions]

🎉 All Checks Passed!

Status: ✅ Ready to merge

✅ Completed Workflows

Workflow	Status	Details
🔨 Continuous Integration	✅ Passed	Build completed successfully
📝 Code Linting	✅ Passed	All formatting and style checks passed

---

🚀 This PR is ready for review and can be safely merged to main branch!

Great work! Your code meets all quality standards. 👏

[Kunal1522]

@sa-fw-an please review this