Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project "selamat malam" is a minimalist landing page designed to convey a simple yet impactful message or service. The primary purpose is to engage visitors with a clean, visually appealing interface that promotes a specific call-to-action while providing essential information in a straightforward manner.

## CORE FEATURES
1. **Hero Section**: A captivating introduction with a concise tagline and a prominent call-to-action (CTA) button that encourages users to engage further.
2. **Features Section**: A brief overview of key offerings or benefits, presented in a visually appealing layout with icons and short descriptions.
3. **Testimonials**: A section to showcase user feedback or endorsements, enhancing credibility and trust.
4. **Contact Form**: A simple form for users to reach out, including fields for name, email, and message, ensuring easy communication.
5. **Footer**: Contains essential links, social media icons, and copyright information.

## 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 full-width hero section at the top, followed by a features section with three columns, a testimonials slider, a centered contact form, and a footer spanning the width of the page.

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

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Layout Structure**: Develop the main components for the hero, features, testimonials, contact form, and footer.
3. **Implement Hero Section**: Include a compelling headline, subtext, and a CTA button styled with the primary color.
4. **Build Features Section**: Create three columns for features, using icons and brief descriptions, ensuring responsiveness with Tailwind CSS.
5. **Add Testimonials**: Implement a slider for testimonials using shadcn/ui components, styled appropriately.
6. **Design Contact Form**: Create a simple form with input validation, styled to match the overall aesthetic.
7. **Footer Implementation**: Add links and social media icons, ensuring they are styled according to the design specifications.
8. **Test and Optimize**: Ensure the page is responsive across devices and performs well, making adjustments as necessary.

## USER EXPERIENCE
The user experience will focus on simplicity and ease of navigation. Visitors will first encounter the hero section, drawing them in with a clear message and CTA. As they scroll, they will seamlessly transition through features and testimonials, building interest and trust. The contact form will be easily accessible, encouraging users to reach out without feeling overwhelmed. Overall, the design will promote a smooth flow and encourage user engagement, all while maintaining a clean and minimalist aesthetic.