Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to serve as an entry point for users interested in the DeliROUTE platform, catering to vendors, buyers, and managers. The page aims to provide clear navigation paths for each user type, facilitating access to relevant information and features directly linked to their needs. The goal is to enhance user engagement through a straightforward, visually appealing interface that emphasizes the platform's value proposition.

## CORE FEATURES
1. **Hero Section**: A prominent introduction area that highlights the platform's purpose, with a clear call-to-action for users to join or learn more.
2. **Value Propositions**: Specific sections detailing the benefits for vendors, buyers, and managers, addressing their unique pain points.
3. **Contact Form**: An intuitive contact form for vendors that facilitates easy communication, designed to send responses directly to WhatsApp.
4. **Social Proof**: A section showcasing testimonials and data from pilot programs to build credibility and trust among potential users.
5. **FAQs**: A dedicated area answering common questions to alleviate concerns and provide clarity about the platform's operations.
6. **CTA Buttons**: Strategically placed call-to-action buttons throughout the page to encourage user interaction and conversion.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: A single-page layout with distinct sections for the hero, value propositions, contact form, social proof, and FAQs. The sections will be visually separated by ample spacing and subtle background variations.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not required for this landing page.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui for styling components.
3. **Create Components**:
   - Build the Hero component to include a catchy tagline, background image (if applicable), and primary CTA button.
   - Develop Value Proposition components for Vendors, Buyers, and Managers, emphasizing their unique benefits.
   - Create a Contact Form component with fields for name, phone number, and a message, ensuring it sends data to WhatsApp.
   - Implement a Testimonials component to showcase pilot program success stories.
   - Add an FAQ component to address common user queries.
4. **Styling**: Use Tailwind CSS to apply the defined design specifications, ensuring responsiveness across devices.
5. **Testing**: Conduct usability testing to gather feedback on the user experience and make necessary adjustments.
6. **Deployment**: Deploy the landing page using Firebase Hosting, ensuring proper configuration with Cloudflare for domain management.

## USER EXPERIENCE
Users will arrive at the landing page and be greeted by a visually striking hero section that prompts them to take action. As they scroll, they will encounter tailored sections that speak directly to their needs—vendors will see how to optimize their sales, buyers will learn about convenience and community, and managers will appreciate operational efficiency. The contact form will allow vendors to reach out easily, while social proof will reinforce the platform's credibility. Overall, the design will facilitate a smooth journey, encouraging users to engage with the platform and convert into active participants.