wikeri .com

# Landing Page Specification

## 1. Theme & Aesthetic
Engaging, community-focused, and informative media platform aesthetic with inviting visuals and clear content organization.

## 2. Color Palette
- **Primary**: #6A0572 (Deep, premium shade)
- **Secondary**: #9D4EDD
- **Accent**: #FEE715 (High contrast)
- **Background**: #FAFAFA
- **Surface/Card**: #FFFFFF
- **Border**: #E0E0E0 (Subtle)

## 3. Typography
- **Headings**: Merriweather Sans (Informative, friendly, and excellent for conveying knowledge and community spirit)
- **Body**: Roboto (Readable, versatile, and suitable for long-form content and articles)

## 4. UI Design System
- **Shadows**: 0 2px 8px rgba(0, 0, 0, 0.08)
- **Border Radius**: 8px
- **Spacing**: Balanced and inviting whitespace, 56px section padding, 18px component padding

## 5. Layout Structure
- **Hero**: A visually appealing hero section with a community-oriented image or illustration, a strong headline, and a prominent search bar or 'Explore Topics' button to encourage content discovery.
- **Features**: A card-based layout for displaying articles, topics, or community posts, with clear categories, author information, and engaging thumbnails. Focus on easy navigation.
- **CTA**: A prominent 'Join Community' or 'Start Learning' button, often in a contrasting accent color, placed in the hero, navigation, and after sections showcasing community benefits.

## 6. Tech Stack
- Framework: Next.js 14
- Styling: Tailwind CSS
- Animation: Framer Motion