Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for a website dedicated to knowledgeable videos related to science. The goal is to provide a clean and engaging platform where users can easily access and explore educational video content. The landing page will focus on conversion, showcasing featured videos, and providing clear calls to action.

## CORE FEATURES
1. **Hero Section**: A visually striking introduction with a headline, subheading, and a prominent call-to-action button directing users to explore videos.
2. **Featured Videos**: A section that highlights a selection of popular or new science videos, allowing users to get a taste of the content available.
3. **Categories**: A categorized display of video topics (e.g., Physics, Chemistry, Biology), enabling users to navigate easily to their areas of interest.
4. **Testimonials**: A section featuring quotes or reviews from users who have benefited from the videos, enhancing credibility and encouraging new visitors to engage.
5. **Contact Form**: A simple contact form for inquiries, feedback, or suggestions, allowing users to connect with the site administrators easily.
6. **Newsletter Signup**: An option for users to subscribe to updates, helping to build a community and keep visitors informed about new content.

## 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 will consist of a full-width hero section at the top, followed by a grid display of featured videos, categorized sections, testimonials, and a footer with the contact form and newsletter signup.

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

## IMPLEMENTATION STEPS
1. **Set up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui components.
2. **Create the Hero Section**: Implement the hero section with a background image or color, headline, subheading, and a call-to-action button styled with the primary color.
3. **Build the Featured Videos Section**: Create a responsive grid layout to display featured videos, ensuring each video card has a title, thumbnail, and link to the video.
4. **Develop the Categories Section**: Set up links or buttons for each video category, styled appropriately with a hover effect using the primary color.
5. **Add Testimonials**: Implement a carousel or grid for testimonials, ensuring it integrates seamlessly into the minimalist design.
6. **Contact Form and Newsletter Signup**: Create a simple form with input fields for name and email, styled according to the design specifications, and add a submission button.
7. **Ensure Responsiveness**: Test and adjust the layout for different screen sizes, ensuring a smooth user experience across devices.

## USER EXPERIENCE
Users will arrive at the landing page and immediately see the hero section, prompting them to explore the videos. They can easily navigate through featured videos and categories, read testimonials, and find the contact form or newsletter signup at the bottom. The minimalist design ensures that users are not overwhelmed and can focus on discovering valuable science content. The responsive design will maintain usability on both mobile and desktop devices.