feat(frontend): build Key Features section

[RUKAYAT-CODER]

🚀 Build Key Features Section

Description

This PR adds a Key Features section to showcase Vaultix’s core capabilities in a visually scannable, responsive grid. The goal is to clearly communicate platform value, build trust, and highlight competitive advantages.

---

Background

• Users need a clear understanding of Vaultix’s platform capabilities
• Key differentiators are not currently visible
• A visual, scannable grid improves comprehension and engagement

---

Problem

• No features are currently highlighted
• The value proposition is unclear to new users
• Competitive advantages are not communicated

---

Solution

Introduce a “Key Features” section with a responsive grid of feature cards, each containing an icon, title, and description.

---

Features Included

The section includes 6 feature cards:

1. Smart Contract Security
   Funds are securely locked until predefined conditions are met.

2. Low Transaction Fees
   Transaction fees are up to 5× lower than traditional platforms.

3. Multi-Party Escrow
   Supports complex agreements involving multiple participants.

4. Dispute Resolution
   Fair and transparent resolution governed by a DAO.

5. Instant Settlement
   Fast fund release upon confirmation.

6. Full Transparency
   All transactions are recorded and verifiable on-chain.

---

Design & UX

• Section heading: Key Features
• Responsive grid layout:
  • Desktop: 3 × 2
  • Tablet: 2 × 3
  • Mobile: 1 × 6
• Each card includes:
  • Icon
  • Title
  • Description
• Interactive enhancements:
  • Hover effects on cards
  • Gradient accent styling

---

Success Criteria

• Users can quickly understand Vaultix’s capabilities
• Feature content is scannable and visually engaging
• Competitive advantages are clearly communicated

---

Impact

• Improved feature awareness
• Increased user trust
• Stronger competitive differentiation

close #20