Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to showcase the services of a web and app creator specializing in accessibility compliance according to European Accessibility Law. The goal is to attract architects and interior design studios by presenting a clean, professional, and accessible online presence that highlights the creator's expertise and services.

## CORE FEATURES
1. **Hero Section**: A captivating introduction that includes a brief overview of services, a personal tagline, and a strong call-to-action (CTA) button leading to a contact form.
2. **Services Offered**: A section detailing the specific web and app development services available, emphasizing accessibility features and how they comply with European standards.
3. **Portfolio Showcase**: A gallery of past projects with images and descriptions, demonstrating the creator's experience and design capabilities.
4. **Testimonials**: A section featuring quotes or reviews from satisfied clients, enhancing credibility and trust.
5. **Contact Form**: A simple, accessible contact form for inquiries, ensuring ease of use for potential clients.
6. **Footer with Additional Links**: Links to social media profiles, privacy policy, and terms of service.

## 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**: A single-page layout with a clear vertical flow, starting from the hero section, followed by services, portfolio, testimonials, contact, and footer.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this landing page as it does not have complex state interactions.

## IMPLEMENTATION STEPS
1. **Set up the React project**: Create a new React project using Create React App with TypeScript template.
2. **Install dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create the layout**: Develop the main layout structure, ensuring responsive design with Tailwind’s utility classes.
4. **Implement the Hero Section**: Add a full-width hero section with a background image or color and clear typography.
5. **Build Service and Portfolio Sections**: Use grid or flexbox layouts to display services and portfolio items, ensuring accessibility features are highlighted.
6. **Integrate Testimonials**: Create a simple carousel or static section for testimonials, ensuring it is visually appealing and easy to read.
7. **Design the Contact Form**: Implement an accessible contact form with proper input labels and validation.
8. **Add Footer Links**: Include social media and other relevant links in the footer for easy navigation.
9. **Test for Accessibility**: Ensure the entire page complies with the European Accessibility standards, including keyboard navigation and screen reader compatibility.
10. **Deploy the landing page**: Use a hosting service to deploy the completed landing page for public access.

## USER EXPERIENCE
The user experience should be seamless and intuitive. Visitors will start at the hero section with a compelling message and CTA. They can easily scroll down to learn about services offered, view past work in the portfolio, read client testimonials, and finally reach the contact form. The design should prioritize accessibility, ensuring all users, including those with disabilities, can navigate and interact with the content effectively. The use of a minimalist style will help keep the focus on the content and enhance user engagement.