Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Create a professional, responsive landing page for a law office located in Taboão da Serra - SP. The main purpose is to instill trust, showcase services, and convert visitors into contacts via WhatsApp. The design will focus on a sophisticated and welcoming aesthetic that aligns with legal standards.

## CORE FEATURES
1. **Header**: Fixed header with space for the logo, editable office name, and a menu linking to key sections: Home, About, Areas of Practice, Reviews, Location, and Contact.
2. **Main Section**: Engaging hero section with a compelling title and subtitle, along with buttons for scheduling appointments and exploring areas of practice.
3. **About the Professional**: Section featuring a professional photo and editable text detailing the lawyer's experience, qualifications, and specialties.
4. **Areas of Practice**: Editable card layout presenting different legal specialties with brief descriptions and "Learn More" buttons.
5. **Client Reviews**: Display of client testimonials with an average rating and a link to view more reviews on Google.
6. **Contact Information**: Clear presentation of the office address, phone number, business hours, embedded Google Map, and direct contact options via WhatsApp.

## 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 feature a header, main section with hero text, about section, areas of practice, client reviews, location, and a contact form, all structured for easy navigation and mobile responsiveness.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specified, but can be added if necessary for form handling.

## IMPLEMENTATION STEPS
1. Set up a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. Create a header component that includes a logo placeholder, editable text for the office name, and a responsive navigation menu.
3. Develop the main section with a background image that reflects a legal atmosphere, incorporating the title, subtitle, and buttons ("Schedule Appointment" and "View Areas of Practice").
4. Create an "About the Professional" section featuring an editable photo and text fields for the lawyer's details.
5. Implement the "Areas of Practice" section using cards, ensuring each card is editable and includes relevant icons and descriptions.
6. Design a "Client Reviews" section with an average rating display and three testimonial cards, ensuring there is a link to view more reviews.
7. Build the "Contact Information" section that clearly presents the address, phone number, and embedded Google Map, including WhatsApp contact options.
8. Create a simple contact form with validation for name, phone, email, area related, and a message field, ensuring the form is user-friendly and data is handled securely.
9. Ensure the entire site is responsive, testing across different devices and screen sizes, and implement smooth scrolling for navigation.

## USER EXPERIENCE
The user will have a clear and intuitive journey, starting from the header that provides easy navigation. The main section will capture their attention with compelling text and direct call-to-action buttons. As they scroll down, they will gain insights into the lawyer's expertise, areas of practice, and client feedback, ultimately leading them to contact options. The form and WhatsApp integration will facilitate easy communication, ensuring users feel supported and informed throughout their experience.