Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project will be a comprehensive multi-page web application designed to showcase a company website with a clean and minimalist aesthetic. It will include essential features such as a contact form, a user login/signup system, and the ability to present various content types like tutorials or products. The aim is to create a unique and engaging web presence that allows for continuous improvements based on user feedback and AI enhancements.

## CORE FEATURES
1. **Home Page**: A welcoming landing area that introduces the company, highlights key offerings, and includes a clear call-to-action (CTA).
2. **Contact Page**: A fully functional contact form that allows users to send messages directly to the specified email address.
3. **Content Pages**: Sections dedicated to tutorials, products, or other informative content, ensuring the website is informative and engaging.
4. **User Authentication**: A signup and login system to allow users to create accounts, enhancing user engagement and personalization.
5. **Dynamic Content Loading**: Ensure all images load properly, and links are functional, providing a seamless experience.
6. **Responsive Design**: The website must be optimized for mobile devices, ensuring it looks good and functions well on various screen sizes.

## 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 structured layout with a header, main content area, and footer. The header will include navigation links, the main area will present the content dynamically, and the footer will contain site information and credits.

## TECHNICAL REQUIREMENTS
- Framework: React with TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- State Management: React Context or Redux if needed for user authentication and state management.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install necessary dependencies (Tailwind CSS, shadcn/ui).
2. **Create Layout Components**: Develop the header, footer, and main layout components to structure the application.
3. **Implement Routing**: Set up React Router to manage navigation between the home, contact, and content pages.
4. **Build Home Page**: Design the home page with engaging content and a clear CTA, using the specified design guidelines.
5. **Develop Contact Form**: Create a contact page with a form that validates input and sends messages to the designated email using a backend service.
6. **User Authentication**: Implement signup and login features, allowing users to create accounts and manage their profiles.
7. **Add Content Pages**: Create tutorial or product pages where users can access valuable information.
8. **Test Functionality**: Ensure all links work, images load correctly, forms submit successfully, and the website is responsive on various devices.
9. **Deploy the Application**: Publish the completed website to the web, ensuring it's accessible to users.

## USER EXPERIENCE
Users will interact with the application through a straightforward navigation system. Upon entering the site, they will be greeted by an inviting home page that clearly outlines the company's offerings. The contact page will allow users to easily reach out for inquiries. Users can create accounts, log in, and access personalized content. The site will prioritize a smooth and engaging experience, encouraging users to explore and return for future visits.