Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Cameros Comparte is a responsive landing page designed to foster a community in the Sierra de Cameros. The platform enables residents to share items and time without monetary exchange, promoting recycling and social interaction. The site will serve as an entry point for users to understand the community's offerings and sign up for participation.

## CORE FEATURES
1. **Hero Section**: A welcoming introduction to Cameros Comparte, emphasizing community values and the importance of sharing.
2. **How It Works**: A detailed explanation of the platform's purpose, including sharing items and time banking.
3. **Categories**: Interactive cards representing various categories of shared items and services, such as Internet learning, pet care, health and beauty, and more.
4. **Contact Form**: A simple form for interested users to submit their information to join the platform, including name, location, and email.
5. **Responsive Design**: The layout is fully responsive, ensuring usability on both desktop and mobile devices.

## 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**: Fixed top menu with sections for Home, How It Works, Categories, and Contact. The hero section will feature a large image or graphic with a call-to-action.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not specified, but could utilize React's built-in state management or Context API if needed.

## IMPLEMENTATION STEPS
1. **Set up the project**: Initialize a new React project with TypeScript and install Tailwind CSS and necessary dependencies.
2. **Create the Layout**: Develop the main structure with a fixed top navigation menu linking to each section.
3. **Develop the Hero Section**: Implement the hero section with a welcoming message and call-to-action button.
4. **Build the How It Works Section**: Create content that explains how the platform operates, utilizing clear and concise language.
5. **Design the Categories Section**: Implement cards for each category, ensuring they are visually appealing and easy to understand.
6. **Implement the Contact Form**: Create a form with fields for name, location dropdown, and email. Set up basic form validation.
7. **Ensure Responsiveness**: Test the layout on various screen sizes to ensure it is fully responsive and user-friendly.

## USER EXPERIENCE
Users will land on the hero section, where they can read about Cameros Comparte and navigate to the How It Works section. After understanding the functionality, users can explore categories to see what is available. The contact form will allow them to easily join the community. The design will maintain simplicity and clarity, encouraging users to engage without overwhelming them with information.