Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to upgrade the existing website sina.pk into a minimalist landing page that highlights its key offerings. The focus will be on simplicity and clarity, using a clean design and thoughtful typography to enhance user engagement and conversion.

## CORE FEATURES
1. **Hero Section**: A striking hero section with a compelling headline, subheading, and a prominent call-to-action (CTA) button to capture visitors' attention immediately.
2. **Features Overview**: A section that highlights the main features or services offered, presented in an easily digestible format with icons and brief descriptions.
3. **Testimonials**: A section showcasing user testimonials to build credibility and trust, enhancing the site's persuasive power.
4. **Call to Action**: A repeated, strategically placed CTA encouraging users to take action, such as signing up or contacting for more information.
5. **Contact Information**: An easily accessible contact section with a simple form for inquiries, ensuring users can reach out effortlessly.

## 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 follow a vertical flow, with the hero section at the top, followed by features, testimonials, the CTA, and the contact form, all designed to guide the user smoothly down the page.

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

## IMPLEMENTATION STEPS
1. **Set up React Environment**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create Layout Structure**: Implement the main layout using functional components for each section (Hero, Features, Testimonials, CTA, Contact).
4. **Develop Hero Section**: Design using Tailwind CSS, incorporating the primary color and typography specifications.
5. **Feature Section**: Create a grid or flex layout to present features, using icons and descriptions.
6. **Testimonials Section**: Design a simple carousel or grid for testimonials, ensuring it is visually appealing and easy to read.
7. **Implement CTA Buttons**: Style buttons according to the design specifications and ensure they are prominent.
8. **Contact Form**: Build a simple form that captures user inquiries and styles it according to the design guidelines.
9. **Test Responsiveness**: Ensure the entire layout is responsive and adjusts well on various screen sizes.
10. **Deploy**: Use a suitable platform for deployment (e.g., Vercel, Netlify) to make the site accessible online.

## USER EXPERIENCE
The user experience will focus on easy navigation and quick access to information. The clean layout encourages users to read through the sections without feeling overwhelmed. Each CTA will stand out, inviting users to engage further, while the contact section ensures they can easily reach out for more information. Overall, the design will provide a seamless and pleasant browsing experience, guiding users toward conversion goals effectively.