🎨 [HACKTOBERFEST] Landing Page UI Revamp – CanonForces Branding

📌 Description

The current landing page is functional but needs a modern, branded UI aligned with CanonForces’ identity.
This issue focuses on improving visual balance, typography, and overall polish of the landing and feature sections.

Basically dont want a full revamp just refining the current one with the modern looks and fixing ambiguities

---

🚀 Goals

• Replace heading with CanonForces and that as a tagline:
  “Learn and code.”
• Enhance hero section design and regenerated mascot image by Gemini nano banana (same pose just quality enhanced) quality.
• Improve responsiveness, visual hierarchy, and user engagement.

---

Since this is UI based issue so preferred to share the mockups to me on linkedin or below the issue thread

🧩 Tasks

1️⃣ Hero Section

• Replace "LEARN & CODE" with “CanonForces” (same bold font).
• Add tagline below: “LEARN & CODE".”
• Center-align hero section (text + mascot).
• Replace it with same mascot with a higher-quality version (same pose, regenerated via Gemini/DALL·E):

2️⃣ Buttons

• Remove Explore and Dashboard buttons instead add canonforces logo
• Add hover effect (scale(1.05), transition: all 0.2s ease-in).

3️⃣ Features Grid

• Add hover shadow + animation on feature cards.
• Improve section title styling:
  • Add a thin divider below “Why Choose CanonForces?”
  • Use subtle fade-in animation for cards.
• Ensure icons use the brand color palette.
• Buttons over there are not working either
• Add Github link as well for the repository

4️⃣ Footer

• Add a clean footer section:

  ⚡ Maintained by Aviral Saxena | © 2025 CanonForces