fix: improve contrast and background gradients for light and dark themes

[toufiq00007]

Type of Change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Refactoring / Style update

Summary: fix(landing): improve theme toggle contrast and background gradients

Resolves background rendering blockages and low-contrast accessibility issues on the landing page when switching between light and dark themes.

Key Changes

• fix(canvas): restored light-mode fallback colors and refined dark emerald-slate gradient inside AnimatedBackground.tsx
• fix(theme): removed stray text/debug logs from ThemeToggle.tsx that were breaking layout alignment
• refactor(landing): converted global container on line 354 from hardcoded opaque cyan styles to dynamic theme classes (from-emerald-50... to dark:from-[#0B1528]...)
• style(hero): mapped headings to high-contrast text-slate-900 / text-slate-600 under light mode to prevent text wash-out
• style(badges): enhanced visibility of "Gamified Environmental Education" and bottom feature cards using frosted-glass background cards (bg-white/60) and high-contrast text tags

Testing Guide

1. Launch the local workspace (npm run dev).
2. Toggle the theme switch button in the navbar.
3. Verify that all typography, hero sections, and badge indicators transition smoothly and remain perfectly legible in both light and dark modes.

closes #191

[vercel]

@toufiq00007 is attempting to deploy a commit to the arzoorai0207-5745's projects Team on Vercel.

A member of the Team first needs to authorize it.

[arzoo0511]

good work ! fix conflicts please and lmk if you need any help