Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to showcase a premium copywriter portfolio. The primary purpose is to create a high-quality, visually appealing homepage that communicates professionalism, strategic thinking, and marketing expertise, ultimately driving visitors to engage and convert into clients.

## CORE FEATURES
1. **Hero Section**: A captivating introduction that sets the tone of the website, featuring a compelling headline, subheadline, and a strong call-to-action (CTA) button.
2. **Portfolio Showcase**: A section displaying selected works with brief descriptions, allowing potential clients to easily navigate through previous projects.
3. **Services Overview**: A concise list of services offered, emphasizing the unique value proposition and expertise in copywriting and marketing.
4. **Testimonials**: A section dedicated to client reviews and endorsements, building trust and establishing authority in the field.
5. **About Me**: A personal branding section where the copywriter shares their philosophy, approach, and background, making a personal connection with visitors.
6. **Final CTA**: A strong concluding section encouraging visitors to take action, such as booking a call or contacting for more information.

## 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 should be structured with a clear vertical rhythm, maintaining balance and negative space. Each section should feel distinct yet cohesive, guiding the visitor's eye smoothly through the content.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specified, but consider using React's built-in state management for simplicity.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui for styling components.
3. **Create Component Structure**: Build the main components: HeroSection, Portfolio, Services, Testimonials, AboutMe, and FinalCTA.
4. **Implement Layout**: Structure the layout using Flexbox and Grid as needed to create a responsive design.
5. **Apply Styles**: Use Tailwind CSS classes to apply the specified design principles, ensuring proper spacing, typography, and color usage.
6. **Add Animations**: Implement subtle animations using CSS for transitions and hover states, enhancing the user experience without being distracting.
7. **Optimize for Mobile**: Ensure that all components are responsive and provide an optimal experience across devices.
8. **Conduct Testing**: Test the application for usability, performance, and responsiveness before deployment.

## USER EXPERIENCE
Visitors will be guided through the landing page seamlessly, starting from the Hero Section that captures their attention. As they scroll, they will encounter the portfolio showcase, services overview, and testimonials, each designed to build trust and authority. Clear CTAs will invite them to take action, leading to increased engagement and conversion rates. The overall experience will feel curated, purposeful, and sophisticated, instilling confidence in the copywriter's expertise.