feat: improve card UI in light mode with better shadows and spacing

[nazneen-p1]

Summary

This PR improves the Light Mode UI of the DevCard page by enhancing the visual design, spacing, and overall user experience. The goal is to make the interface cleaner, more modern, and visually consistent without affecting existing functionality.

Closes #78

---

Type of Change

• Bug fix
• New feature
• Refactor (no functional change)
• UI / Design change
• Tests only
• Documentation
• Infrastructure / DevOps
• Security

---

What Changed

• Improved card design with modern shadows and rounded corners in app.css
• Enhanced spacing and alignment for better layout consistency
• Updated background colors for a cleaner light mode appearance
• Added smooth hover effects for better user interaction

---

How to Test

1. Run the project locally using pnpm dev
2. Open the DevCard page in the browser
3. Verify the updated card UI, spacing, and hover effects in Light Mode

---

Checklist

• My code follows the project's coding style (pnpm -r run lint passes).
• TypeScript compiles without errors (pnpm -r run typecheck).
• I have added or updated tests for the changes I made.
• All tests pass locally (pnpm -r run test).
• I have updated documentation where necessary.
• No new console.log or debug statements left in the code.
• Breaking changes are documented in this PR description.

---

Screenshots / Recordings

Before:
(attach screenshot here)

After:
(attach screenshot here)

---

Additional Context

This PR focuses only on UI improvements for the DevCard component. Further enhancements for other sections (navbar, buttons, forms) can be handled in separate PRs to maintain clarity and modularity.