Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed as a clean and minimalist platform that presents information and interactive elements based on the slides provided. The app will focus on delivering content in a visually appealing manner while maintaining a highly user-friendly interface.

## CORE FEATURES
1. **Hero Section**: A visually striking introduction with a prominent headline and a call-to-action button that directs users to explore more.
2. **Content Display**: Dynamic sections that present information clearly, incorporating images and text from the slides in an organized layout.
3. **Interactive Elements**: Engagement features like quizzes or feedback forms to involve users and collect insights.
4. **Contact Form**: A simple form for users to reach out for more information or support.
5. **Responsive Design**: Ensures that the application is accessible and visually appealing on all devices, from desktops to mobile phones.

## 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 vertical stack of sections, beginning with the hero area, followed by content displays, interactive components, and ending with the contact form.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Context API (if needed for managing global states)

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create the Basic Layout**: Structure the app with a main layout component that includes the hero, content, interactive, and contact sections.
3. **Implement Hero Section**: Design the hero area with a headline, subheadline, and call-to-action button styled with Tailwind CSS.
4. **Build Content Display**: Develop components that dynamically render the content from the provided slides, ensuring they are styled according to design specifications.
5. **Add Interactive Elements**: Implement functionality for quizzes or feedback forms, ensuring they provide immediate responses and maintain user engagement.
6. **Create Contact Form**: Develop and integrate a contact form that captures user inquiries and sends them to a designated endpoint.
7. **Ensure Responsiveness**: Utilize Tailwind CSS utilities to make the app responsive and functional on various screen sizes.
8. **Testing**: Conduct thorough testing for usability, performance, and responsiveness across different devices.

## USER EXPERIENCE
Users will begin their journey on the hero section where they are greeted with an engaging headline and a call-to-action. As they scroll down, they will find well-organized content that is easy to read and visually appealing. Interactive elements will encourage user participation, and the contact form will provide a simple way for users to get in touch for more information. The overall experience will be seamless, emphasizing clarity and simplicity in navigation.