doggaz.com .com

# Landing Page Specification

## 1. Theme & Aesthetic
Warm, natural, and premium, evoking a sense of care and high-quality for pets. The design should feel approachable yet sophisticated, with a focus on natural textures and soft lighting in imagery.

## 2. Color Palette
- **Primary**: #5A3F2B (Deep, premium shade of mocha brown)
- **Secondary**: #8B5F3E
- **Accent**: #A4D4A4 (Soft, earthy green)
- **Background**: #FDF8F3
- **Surface/Card**: #FFFFFF
- **Border**: #E0D8D0 (Subtle)

## 3. Typography
- **Headings**: DM Serif Display (Classic, elegant serif that conveys premium quality and trustworthiness)
- **Body**: Lato (Clean, highly readable sans-serif for extensive text, ensuring clarity and friendliness)

## 4. UI Design System
- **Shadows**: 0 6px 12px -2px rgba(0, 0, 0, 0.1)
- **Border Radius**: 12px
- **Spacing**: Generous whitespace, 96px section padding for an airy, luxurious feel

## 5. Layout Structure
- **Hero**: Full-width lifestyle image of a happy dog in a natural setting, with a prominent, concise value proposition headline and a clear 'Shop Now' CTA button. Sub-headline emphasizes quality and care.
- **Features**: A 3-column grid showcasing product categories (e.g., Food, Supplements, Accessories) with attractive images and short descriptions, leading to dedicated product pages.
- **CTA**: A dedicated section with a large, inviting button prompting users to 'Join Our Community' or 'Start a Subscription', placed after product showcases.

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