Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
"Prompt Barcelona" is a minimalist landing page designed to showcase the essence of Barcelona through a clean and simple interface. The main purpose is to provide users with an intuitive experience that highlights key features, such as attractions, cultural insights, and contact information, while maintaining a focus on visual appeal and ease of navigation.

## CORE FEATURES
1. **Hero Section**: A captivating introduction to Barcelona with a striking image and a concise tagline that invites users to explore more.
2. **Features Overview**: A section highlighting the main attractions and experiences in Barcelona, presented in a visually appealing manner with icons and brief descriptions.
3. **Testimonials**: A collection of user testimonials or reviews that provide social proof and encourage visitors to engage with the content.
4. **Call to Action (CTA)**: Prominent buttons encouraging users to sign up for newsletters, download guides, or contact for more information.
5. **Contact Information**: An easily accessible section with contact details and a simple form for inquiries.

## 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 structure will consist of a full-width hero section at the top, followed by a grid layout for features, a testimonials section, a prominent CTA, and a footer with contact details.

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

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui components for styling and UI components.
3. **Create Layout**: Design the main layout with the hero section, features grid, testimonials, CTA, and footer.
4. **Implement Hero Section**: Add a background image, title, and description in the hero section with appropriate styles.
5. **Build Features Section**: Create a grid layout for the features, using icons and descriptive text for each feature.
6. **Add Testimonials**: Implement a carousel or grid for user testimonials, styled to fit the minimalist aesthetic.
7. **Set Up CTA**: Design and position the CTA buttons prominently, linking them to relevant actions (e.g., newsletter sign-up).
8. **Create Contact Form**: Add a simple contact form with fields for name, email, and message, styled according to the design specifications.
9. **Optimize for Responsiveness**: Ensure that all sections are responsive and visually appealing on all device sizes.
10. **Deploy**: Deploy the application using a platform like Vercel or Netlify for live access.

## USER EXPERIENCE
Users will be greeted by a visually engaging hero section that immediately draws them into the content. Navigation will be straightforward, with clear sections leading them through the highlights of Barcelona. The testimonials will build trust, while the CTA will facilitate user engagement. The minimalist design will ensure a focus on content without distractions, providing a seamless experience across devices.