Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to sell a variety of laptop brands. The main purpose is to present the products in a visually appealing and minimalistic way, encouraging visitors to explore the offerings and make purchases.

## CORE FEATURES
1. **Hero Section**: Engaging introduction with a standout image of featured laptops and a clear call-to-action button urging visitors to explore the products.
2. **Product Showcase**: A clean layout displaying various laptop models with brief descriptions, prices, and an option to view more details.
3. **Brand Highlights**: Section showcasing different laptop brands available, enhancing trust and brand recognition.
4. **Testimonials**: A section featuring customer reviews to build credibility and encourage potential buyers.
5. **Contact Form**: A simple contact form for inquiries to facilitate communication with potential customers.
6. **Call to Action**: Clear and repeated calls to action throughout the page to drive conversions.

## 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 main layout will feature a vertical flow starting from the hero section, followed by product showcases, brand highlights, testimonials, and a contact form, all designed to guide the user through a seamless journey.

## 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 React and TypeScript**: Initialize a new React project with TypeScript support.
2. **Install Tailwind CSS**: Follow the Tailwind CSS installation guide to set it up in your project.
3. **Create Components**: Build reusable components for the hero section, product cards, testimonials, and the contact form.
4. **Implement Layout**: Arrange the components in the designated layout using Flexbox or Grid for responsiveness.
5. **Styling**: Apply Tailwind CSS classes according to the design specifications, ensuring the primary color and typography are correctly used.
6. **Testing**: Ensure the landing page works across different screen sizes for a responsive design.

## USER EXPERIENCE
Users will land on a visually striking hero section that captures their attention. They can easily navigate through the product showcase, view details, and read testimonials to make informed decisions. The contact form is simple and accessible, encouraging inquiries, while clear CTAs guide users toward purchasing actions. The minimalist design ensures a smooth and enjoyable browsing experience.