Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Create a minimalist landing page that embodies the concepts of invisible infrastructure, cohesion, stewardship, and intentional design. The purpose of this page is to communicate the core principles and identity of the brand, presenting information in a calm, structured manner that feels both inevitable and composed.

## CORE FEATURES
1. **Hero Section**: A centered headline "Worlds. Built to hold." with a subtle fade-in effect, accompanied by two short sentences. The focus is on clarity and stillness.
   
2. **Capabilities Section**: A vertically stacked list of capabilities (Brand Architecture, Visual Direction, Digital Presence, IP Strategy) displayed with generous spacing and a clean sans-serif font, allowing for a staggered fade-in.

3. **PBZ Collective Section**: A clearly labeled section with minimal supporting text, set against a dark, structured background. Transition effects mimic panels sliding into place.

4. **Not The Official Photographer Section**: Another labeled section with a minimal supporting line, featuring dark editorial photography. The composition is controlled and maintains a structured language similar to the PBZ section.

5. **Identity Reveal Section**: Features the keithofox logo appearing centered with significant breathing room and the text "Independent studio" underneath. This transition should feel earned with a simple fade-in.

6. **Contact Section**: A minimal area displaying only an email address with subtle hover interactions and strong negative space.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist design focusing on clean lines, ample white space, and simple typography without decorative elements. Avoids corporate aesthetics and gimmicky effects.
- **Color Mode**: Light theme with dark text on light backgrounds (primarily deep matte black for background elements).
- **Layout**: A single-page structure flowing from the Hero section through each Capability, PBZ Collective, Not The Official Photographer, Identity Reveal, and ending with the Contact section. Each section transitions smoothly without jarring effects.
- **Typography**: 
  - **Headline Font**: Modern serif that is sharp and clean (e.g., 'Playfair Display' or 'Merriweather').
  - **Body Font**: Clean grotesque sans-serif (e.g., 'Inter' or 'Neue Haas Grotesk'). Maintain precise hierarchy without exaggerated tracking or heavy bolding.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS for utility-first styling.
- **UI Components**: Utilize shadcn/ui for consistent UI design.
- **State Management**: Not required for a static landing page.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create Layout Components**: Build components for each section (Hero, Capabilities, PBZ Collective, Not The Official Photographer, Identity Reveal, Contact).
4. **Implement Typography**: Use the specified fonts for all text elements, ensuring proper hierarchy and spacing.
5. **Design Transitions**: Use CSS transitions for subtle effects between sections, ensuring scrolling feels calm and controlled.
6. **Finalize Styling**: Apply Tailwind CSS classes to achieve the minimalist design, ensuring no decorative elements are included.

## USER EXPERIENCE
The user experience should feel intuitive and fluid, with each scroll seamlessly transitioning to the next section. The calm scrolling behavior and intentional design elements should evoke a sense of architectural depth without overwhelming the user. Each section should provide clear information with sufficient breathing room, inviting the user to engage without distraction. The contact section should encourage user interaction with a clear call-to-action for inquiries.