Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project involves creating a landing page for "Barbearia e Estética Fio do Bigode", a barbershop that offers a range of grooming services. The purpose of the landing page is to attract new clients by showcasing services, providing essential information, and enabling easy contact.

## CORE FEATURES
1. **Hero Section**: A visually impactful hero section with a catchy tagline and a call-to-action (CTA) button encouraging visitors to book an appointment.
2. **Services Offered**: A detailed list of services provided, such as beard trimming, haircuts, skin treatments, and relaxing massages, presented in an engaging format.
3. **Testimonials**: A section featuring customer reviews and ratings to build trust and credibility with potential clients.
4. **Contact Information**: Easy access to the barbershop's address, phone number, and operational hours, along with a Google Maps integration for directions.
5. **Photo Gallery**: A showcase of high-quality images of the barbershop's interior, services, and satisfied clients to enhance visual appeal.
6. **Booking CTA**: Prominent call-to-action buttons throughout the page to encourage visitors to book an appointment or contact the barbershop directly.

## 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 single-page structure, with sections for the hero, services, testimonials, contact information, and photo gallery, all smoothly scrolling into view.

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

## IMPLEMENTATION STEPS
1. **Set up the React Project**: Initialize a new React application using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Layout Components**: Develop reusable components for the hero section, services list, testimonials, contact info, and gallery.
4. **Implement Styling**: Use Tailwind CSS classes to apply the minimalist design, ensuring responsiveness across devices.
5. **Integrate Google Maps**: Embed Google Maps for the location section.
6. **Optimize for SEO**: Add meta tags, alt text for images, and ensure the site is crawlable by search engines.
7. **Deploy the Landing Page**: Choose a hosting platform (e.g., Vercel, Netlify) and deploy the application.

## USER EXPERIENCE
Visitors will have a seamless experience navigating through the landing page. The hero section will immediately draw attention, followed by easy access to services and testimonials that establish trust. Contact information will be readily available, and the booking CTA will facilitate quick appointments. The overall layout will be responsive, ensuring a pleasant user experience on both mobile and desktop devices.