Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to showcase the offerings and unique aspects of a service or product, inspired by the layout and aesthetic of the provided reference. The main purpose is to create a visually appealing and informative site that engages visitors and encourages them to take action.

## CORE FEATURES
1. **Hero Section**: A captivating hero area with a strong headline, subheading, and a prominent call-to-action button that encourages visitors to engage with the content.
2. **Features Section**: A concise overview of key features or services offered, presented in an easy-to-read format with icons for visual appeal.
3. **Testimonials**: A section dedicated to showcasing user reviews and testimonials to build trust and credibility with potential customers.
4. **Contact Form**: A simple form for visitors to reach out, ask questions, or request more information, enhancing interaction.
5. **Footer**: A footer that includes essential links, social media icons, and legal information for easy navigation and compliance.

## 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**: The layout will follow a single-page structure with sections stacked vertically, ensuring a smooth scrolling experience. Each section will be clearly defined with ample spacing and visual hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this simple landing page; however, context API can be used if needed for managing form state.

## IMPLEMENTATION STEPS
1. **Set up the development environment**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create the main components**: Build individual components for the Hero, Features, Testimonials, Contact Form, and Footer sections.
3. **Style the components**: Use Tailwind CSS to apply the design specifications, ensuring that the primary color, typography, and border radius are implemented consistently across all components.
4. **Implement navigation**: Create smooth scrolling links in the header to allow users to navigate between sections easily.
5. **Add responsive design**: Ensure all components are responsive and look great on various devices by testing and adjusting styles accordingly.
6. **Deploy the application**: Once completed, deploy the landing page using a suitable hosting service (e.g., Vercel or Netlify).

## USER EXPERIENCE
Visitors will arrive at an engaging hero section that clearly communicates the brand message. The smooth scrolling experience allows users to navigate through the features and testimonials easily. The contact form encourages interaction, allowing users to submit inquiries effortlessly. The minimalist design ensures that the focus remains on the content, resulting in a user-friendly experience that promotes conversions.