Next.js Lead-Focused Agency Site

I want a slick, lightning-fast website built with Next.js that positions my agency front-and-center and, most importantly, turns visitors into qualified leads. The entire experience—from the first fold to the final click—should guide a prospect toward filling out our contact form.

### Project: Next.js Website for Uplift Kolektiv

**Tech stack:**
- Next.js
- TailwindCSS
- Framer Motion (for animations)

---

### Requirements & Features

1. **Intro Animation (Landing Page):**
- When the user first visits the site, a **large logo** appears in the center of the screen.
- The **background is blurred** for a nice visual effect.
- A **motto** appears under the logo (e.g., *United by sound, lifted by the rhythm*).
- After a few seconds or on scroll/click:
- The logo **shrinks smoothly** and moves to its permanent spot in the top left.
- The blurred background disappears and is replaced with a **full-screen image or video background**.
- The menu + logo + motto remain visible on top of the background.

---

2. **Main Layout after Intro:**
- Top area: **Small logo** + **Motto** under it.
- Navigation menu with buttons:
- *Who are we?*
- *Gallery*
- *Artists*
- *Contact Us*
- The background remains **image/video** fullscreen with a light overlay for readability.

---

3. **Gallery Page:**
- Automatically loads images from either a **local folder** or a **Zipline folder** (e.g., `zipline.diced.sh`).
- Images can have **tags** for filtering (used later for the Artists pages).

---

4. **Artists Pages:**
- Dynamic route: **`/artist/[artist]`**
- Artist data comes from a **YAML file** with a fixed structure:

```yaml
name: "DJ Example Name"
artist-tag: "tag" # Used to automatically pull images with this tag from the Gallery
profile-url: "/public/artists/tag.jpg" # URL or local path for the profile picture
Genre: "genre1, genre2, genre3" # Behaves like tags
Description: "Artist description displayed on the page"
variables for any secrets.

Deliverables
1. Source code pushed to my private Git repo.
2. Deployed production build live on the provided domain.
3. Brief README covering install, build, and environment setup.
4. One round of revisions after first review to iron out any missed details.

Acceptance criteria
• Lighthouse scores 90+ for Performance and Best Practices.
• Contact form submits reliably and captures every required field.
• Visual layout matches agreed Figma (or your equivalent design mock-ups) within reason.
• No console errors in latest Chrome, Safari, and Firefox.

Keep the build clean, focused, and conversion-oriented, and we’ll have a site that pays for itself in leads.