Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project involves creating a landing page for a movie website featuring "Cineby." The main purpose of this site is to showcase films, provide information, and engage users with a clean, minimalist design that emphasizes usability and visual appeal.

## CORE FEATURES
1. **Hero Section**: A captivating hero section that includes a prominent title, tagline, and call-to-action button leading to featured content or a subscription.
2. **Featured Movies**: A section highlighting popular or new movies with images, brief descriptions, and links to more details or trailers.
3. **About Cineby**: A dedicated area explaining what Cineby is, its mission, and its unique offerings to engage the audience.
4. **Testimonials**: A section for user reviews or testimonials to build trust and credibility with potential visitors.
5. **Contact Information**: Easy access for users to contact support or inquire about collaborations, featuring a simple contact form.
6. **Newsletter Signup**: An invitation for users to subscribe to updates and exclusive content related to Cineby.

## 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 consists of a vertical flow with the hero section at the top, followed by featured movies, about section, testimonials, contact info, and newsletter signup, ensuring each section is distinct and visually appealing.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this landing page as it is mostly static content.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create the Layout**: Design the main layout structure using Tailwind CSS to ensure responsiveness and accessibility.
3. **Build the Hero Section**: Implement the hero section with a captivating title, tagline, and button using the primary color for accents.
4. **Develop the Featured Movies Section**: Create dynamic components to display movie cards that can pull in data from a mock API or static JSON file.
5. **Design the About Cineby Section**: Add content that explains the website’s purpose, using the defined typography and styles.
6. **Implement Testimonials**: Add a section for user testimonials, using cards or a simple list format to maintain the minimalist design.
7. **Set Up Contact Information**: Create a contact form with fields for name, email, and message, styled according to the design specifications.
8. **Add Newsletter Signup**: Implement a simple form for newsletter signup at the bottom of the page, ensuring it is easy to access and visually appealing.
9. **Responsive Design Testing**: Test the website on various devices to ensure all elements are responsive and user-friendly.

## USER EXPERIENCE
Key user interactions include easy navigation through sections, intuitive access to movie details, and straightforward forms for contact and newsletter signup. The minimalist design ensures that users are not overwhelmed by information, allowing for a smooth browsing experience. The use of whitespace and a clean layout will help guide users naturally through the content.