Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Create a simple, modern, and responsive landing page focused solely on a lead capture form for beauty salon owners. The page will guide users through a step-by-step experience to collect essential information about their businesses, enhancing the potential for client engagement and follow-up.

## CORE FEATURES
1. **Step-by-Step Form**: Users will progress through a series of questions, with one question displayed at a time for clarity and focus.
2. **Lead Capture**: Collect information such as name, WhatsApp number, Instagram handle, salon name, monthly revenue, current challenges, and ad investment status.
3. **Progress Bar**: A visual progress indicator at the top of the form will enhance user experience, showing how far along users are in the process.
4. **Mobile-First Design**: The form will be optimized for mobile devices, ensuring ease of use on smartphones.
5. **Thank You Screen**: After submission, users will see a confirmation message thanking them and informing them of the next steps.
6. **Data Management**: All responses will be stored in a simple admin table for easy access and management, with potential future integrations to WhatsApp or Google Sheets.

## 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 consist of a single-column format with a title, subtitle, large buttons for navigation, and a clear display of questions in sequence.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Use React's built-in state management or Context API for managing form data.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui for styling.
2. **Create Main Component**: Develop a main component that handles the rendering of the form, including state management for form responses.
3. **Design Layout**: Implement the minimalist design using Tailwind CSS, ensuring that the primary color, typography, and border radius specifications are met.
4. **Implement Form Logic**: Create a function to handle form submissions and navigate through questions. Ensure validation for required fields.
5. **Add Progress Bar**: Integrate a progress bar component that updates based on the current question index.
6. **Set Up Thank You Screen**: After submission, display a thank you screen with a message and a button to finish.
7. **Data Management**: Implement functionality to save responses in a simple table and outline future integration options.

## USER EXPERIENCE
Users will begin on a welcoming screen that prompts them to start the questionnaire. As they fill out their information, they will see a progress bar indicating their completion status. The design will be clean and user-friendly, ensuring that each question is clear and easy to answer, with large, accessible buttons for navigation. After completing the form, users will receive a friendly thank you message, reinforcing a professional and reliable interaction.