Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project will be a comprehensive landing page designed for a dentist's website featuring three different clinics. The main purpose is to showcase each clinic's services, promote dental health, and encourage potential patients to book appointments. The design will focus on SEO optimization and advertising strategies to attract local clientele.

## CORE FEATURES
1. **Hero Section**: A visually appealing introduction that highlights the clinics with a call-to-action (CTA) button for booking appointments.
2. **Clinic Overview**: Individual sections for each clinic, including images, descriptions, services offered, and links to learn more or book appointments.
3. **Testimonials**: A dedicated section to showcase positive patient feedback and experiences, aimed at building trust with potential clients.
4. **Contact Information**: A clear and accessible contact section with phone numbers, email addresses, and an integrated contact form for inquiries.
5. **Appointment Booking**: An easy-to-use interactive calendar or booking system that allows users to schedule appointments directly from the website.

## 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 follow a single-column structure with a clear hierarchy, featuring the hero section at the top, followed by clinic overviews, testimonials, and contact information in a sequential manner.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS for rapid UI development and responsiveness.
- **UI Components**: shadcn/ui for consistent and modern design elements.
- **State Management**: React's built-in state management for handling form inputs and booking statuses.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui components.
2. **Create Main Layout**: Develop the main structure of the landing page, including the header, hero section, clinic sections, testimonials, and contact section.
3. **Integrate Typography**: Import and apply Inter font from Google Fonts throughout the application.
4. **Design Hero Section**: Implement the hero section with a background image, introductory text, and a prominent booking button styled with the primary color.
5. **Develop Clinic Sections**: Create individual components for each clinic's overview, including images and service descriptions, ensuring proper spacing and alignment.
6. **Add Testimonials**: Implement a carousel or grid layout for testimonials, with styling that highlights each quote effectively.
7. **Contact Section**: Design the contact section with clear contact methods and an interactive form for inquiries.
8. **Implement Appointment Booking**: Integrate an appointment booking system that allows users to select dates and times and submit their information.
9. **Optimize for SEO**: Ensure all text is optimized for search engines, including meta tags and alt text for images.
10. **Test Responsiveness**: Review the application on various devices and screen sizes to ensure a seamless user experience.

## USER EXPERIENCE
Key user interactions will include easy navigation through clinic information, a quick and efficient booking process, and an intuitive contact form. Users will enjoy a clean interface with minimal distractions, allowing them to focus on the services offered. The responsive design will ensure that the experience remains consistent across different devices, providing a smooth and engaging journey from discovery to booking an appointment.