Update Front Page to Match Figma V2 Designs

[Rutjake]

✨ Enhancement Description

The goal of this issue is to fully update the landing page to align with the new Figma V2 designs. This includes a complete overhaul of the hero section and the implementation of the new card layout system.

---

🌟 Benefits of the Enhancement

• Improved Readability: The use of the high-contrast, blurred backdrop (Glass component) ensures text stands out while maintaining a seamless visual flow.
• Modernized Look & Feel: Organic shapes and improved spacing make the interface feel more integrated with the artwork and more intuitive for the user.
• Visual Consistency: Aligns the home page with the updated platform design language.

---

🛠️ Proposed Implementation

🖼️ Hero Section Update

• Responsive Top Image: Replace the current hero image.
• Important: The image must be fully responsive and visible across all devices (Desktop, Tablet, Mobile). Ensure no essential parts, such as integrated text or key artwork, are cropped out.

🧩 Components & Layout

• Clean Up: Remove deprecated V1 components from the page.
• V2 Card Component: Implement a new CardV2 component if the existing UI library does not yet support the updated design requirements.
• Glass UI: Apply the existing Glass component to text containers to ensure the blurred, high-contrast effect matches the mockups.
• News Section:
  • Note: Do not implement the new News cards yet; they will be handled in a separate dedicated issue.
  • Current State: Leave the existing News section in its current state for now.

---

📎 Additional Information

• Assets: Please contact the issue author or team producer for specific image exports or asset files.
• i18n: If any texts are updated or changed, ensure you verify the correct translations for both languages (FI/EN) with the issue author or producer.
• Reference: Ensure the spacing (margins/padding) matches the Figma inspector values exactly.

• 🔗 Figma Designs

• 📷 Preview: