Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to sell basreng (a type of Indonesian snack) with a cute and appealing pink aesthetic. The primary aim is to attract customers through a visually engaging interface that highlights product features, encourages purchases, and provides necessary contact information.

## CORE FEATURES
1. **Hero Section**: A vibrant hero section with an eye-catching image of basreng, a catchy tagline, and a prominent call-to-action (CTA) button to drive conversions.
2. **Product Features**: A section that outlines the unique selling points of the basreng, including flavor options, ingredients, and health benefits.
3. **Testimonials**: A section for customer testimonials that builds trust and credibility, showcasing positive feedback from satisfied customers.
4. **Pricing Plans**: Clear pricing options for different basreng packages, with easy-to-understand pricing and an option to order directly from this section.
5. **Contact Information**: A simplified contact section with a form for inquiries and links to social media platforms for further engagement.

## 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 feature a single-column format for mobile responsiveness, with sections stacked vertically. The hero section will be followed by product features, testimonials, pricing, and the contact form.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specifically required for this landing page, but React's built-in state can be utilized for form handling if necessary.

## IMPLEMENTATION STEPS
1. **Set Up React Project**: Initialize a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui components.
3. **Create Components**: Build individual components for Hero, Features, Testimonials, Pricing, and Contact sections.
4. **Style Components**: Utilize Tailwind CSS for styling according to the design specifications, ensuring the primary color and typography are applied consistently.
5. **Add Functionality**: Implement the CTA buttons to link to an order form or external site. Ensure the contact form is functional.
6. **Responsive Design**: Test and adjust the layout for various screen sizes to maintain a user-friendly experience.
7. **Deploy**: Host the landing page on a suitable platform (e.g., Vercel, Netlify) for public access.

## USER EXPERIENCE
Users will land on a visually appealing page featuring a large image of basreng. The hero section will immediately capture their attention with a catchy phrase and a clear CTA to order now. As they scroll, they will encounter features that highlight the product's uniqueness, followed by testimonials that establish credibility. Pricing options will be clearly laid out, and the contact form will provide an easy way for users to reach out for more information. The overall experience will be smooth and intuitive, with a focus on converting visitors into customers.