Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a minimalist landing page designed to promote the "نحب راكب فيديو ابتاع سمارا علاء" video platform. The main purpose of the landing page is to attract users with engaging content, highlight the platform's features, and drive conversions through clear calls to action.

## CORE FEATURES
1. **Hero Section**: A captivating introduction with a strong headline, subheading, and a call-to-action button to encourage users to sign up or learn more.
2. **Features Overview**: A section showcasing the main features of the platform, emphasizing video quality, user experience, and unique offerings.
3. **Testimonials**: A dedicated area for user testimonials to build trust and credibility with potential users.
4. **Call to Action (CTA)**: Strategically placed buttons throughout the page to encourage user engagement, such as signing up or watching a demo.
5. **Contact Information**: A simple contact form or details for users to reach out for support or inquiries.

## 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 be a single-page scrollable format, with sections clearly defined for the hero, features, testimonials, CTA, and contact. Each section will be visually distinct yet cohesive, maintaining a clean and organized flow.

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

## IMPLEMENTATION STEPS
1. **Set up the React project**: Initialize the project using Create React App with TypeScript template.
2. **Install necessary packages**: Add Tailwind CSS and shadcn/ui for styling components.
3. **Create the main components**: Develop individual components for the hero section, features, testimonials, CTA, and contact information.
4. **Style components with Tailwind CSS**: Apply the specified design specifications using Tailwind classes for layout, spacing, and typography.
5. **Integrate Google Fonts**: Add Inter font to the project for both headings and body text.
6. **Implement responsive design**: Ensure the layout adapts to different screen sizes using Tailwind’s responsive utilities.
7. **Test functionality**: Verify that all links and CTAs work as intended and that the page displays correctly across different devices and browsers.

## USER EXPERIENCE
The user experience will focus on simplicity and efficiency. Users will be greeted with an attractive hero section that clearly communicates the platform's value. As they scroll down, they will encounter engaging content that showcases the features, followed by real user testimonials that enhance credibility. The CTAs will be prominent and persuasive, guiding users towards signing up or learning more. The overall design will encourage exploration while maintaining a clear path to conversion.