Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a minimalist landing page designed to showcase a brand or service with engaging scroll animations and a soothing background ambiance. The objective is to create a visually appealing, user-friendly experience that encourages visitors to explore the content while providing essential information and a clear call to action.

## CORE FEATURES
1. **Hero Section**: A captivating introduction with a prominent headline, short description, and a call-to-action button that encourages users to take the next step.
2. **Scroll Animation**: Smooth scrolling effects that animate elements into view as users navigate down the page, enhancing visual engagement.
3. **Background Ambiance**: Subtle background music or ambient sounds that create a relaxing atmosphere without distracting from the content.
4. **Features Section**: A concise overview of key features or services provided, presented with icons and brief descriptions to highlight benefits.
5. **Testimonials**: A section featuring quotes or feedback from past users or clients, adding credibility and trust to the brand.
6. **Contact Form**: A simple contact form for inquiries, allowing users to easily get in touch with the company.

## 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 vertical layout structure with full-width sections for the hero, features, testimonials, and contact form, ensuring a smooth flow and easy navigation.

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

## IMPLEMENTATION STEPS
1. **Set Up Project**: Create a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Components**: Build reusable components for the hero section, features, testimonials, and contact form.
4. **Implement Scroll Animation**: Utilize libraries like React Spring or GSAP to add scroll animations to components as they come into view.
5. **Add Background Ambiance**: Integrate an audio player that plays ambient sounds, ensuring it can be toggled on or off by the user.
6. **Style Components**: Apply Tailwind CSS classes to ensure the design adheres to the specified visual style and typography.
7. **Test Responsiveness**: Ensure the landing page is fully responsive and looks great on various devices.

## USER EXPERIENCE
Users will be greeted by a visually striking hero section that draws them in with smooth scroll animations. As they navigate down the page, they will encounter engaging content that highlights the brand's offerings, supported by testimonials that build trust. The background ambiance will enhance the overall experience, providing a calming effect while users explore the site. A clear and accessible contact form will facilitate easy communication, encouraging user interaction and engagement.