SpeakUp Venture Hero

Create a full-screen hero section (100vh, min-height 600px) for a creative agency site called **Speakup**. Build it in React + TypeScript with Tailwind CSS and use `lucide-react` for icons.

**Fonts**
- Load `Recoleta Regular` from: `<link href="https://db.onlinewebfonts.com/c/67415ab41a7350f81536b69763e6d031?family=Recoleta+Regular" rel="stylesheet">`
- Load `Inter` (weights 400, 500, 600, 700) from Google Fonts.
- Use `Recoleta Regular` only for the H1 heading. Use `Inter` for all other text (body, nav, buttons, logo wordmark).
- Extend Tailwind with `fontFamily: { recoleta: ['"Recoleta Regular"', 'serif'], inter: ['Inter', 'sans-serif'] }`.
- In `index.css`, set `html, body` to `font-family: 'Inter', sans-serif` with antialiased smoothing, and add a `.font-recoleta` utility.

**Colors (extend Tailwind)**
- `brand.green = #0E7824` (heading only)
- `brand.dark = #2D2D2F` (logo, nav text, buttons)

**Background video (no overlay, full cover)**
- URL: `https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260508_150921_27df94bd-d1e3-4440-9f55-314c4611902b.mp4`
- Attributes: `autoPlay muted loop playsInline`
- Positioned `absolute inset-0 w-full h-full object-cover`.

**Logo component** (`Logo.tsx`) — accepts `className` and `color` props; renders this SVG with `fill={color}`:
```
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="none">
  <path d="M 128.005 191.173 C 128.448 156.208 156.93 128 192 128 L 192 64 L 128 64 C 128 99.346 99.346 128 64 128 L 64 192 L 128 192 Z M 192 256 L 64 256 C 28.654 256 0 227.346 0 192 L 0 64 L 64 64 L 64 0 L 192 0 C 227.346 0 256 28.654 256 64 L 256 192 L 192 192 Z" />
</svg>
```
Default color `#2D2D2F`.

**Navbar** (z-20, padding `px-6 md:px-12 lg:px-16 pt-6 md:pt-8`, flex between):
- Left: Logo (`w-8 h-8 md:w-9 md:h-9`) + wordmark `SPEAK` (bold) + `UP` (black weight), color `#2D2D2F`, tracking-tight, `text-lg md:text-xl`.
- Center (hidden below lg, gap-8 xl:gap-10): links — `Projects`, `The Team`, `Products`, `Our Story`, `Say Hello!` — text-sm, font-medium, `#2D2D2F`, hover turns `#0E7824` via `transition-colors`.
- Right (hidden below lg): pill button "Begin a venture", `rounded-full bg-[#2D2D2F] text-white text-sm font-medium px-7 py-3.5 shadow-sm hover:bg-black transition-colors`.
- Mobile: hamburger (`Menu` icon from lucide) toggles a full-screen white overlay (`fixed inset-0 z-50`) with `X` close button, stacked links `text-2xl`, and the same pill CTA.

**Hero content** (z-10, `px-6 md:px-12 lg:px-16 mt-8 md:mt-16 lg:mt-24 max-w-7xl`):
- H1 using `font-recoleta` color `#0E7824`, `leading-[1.05] tracking-tight`, sizes `text-[56px] sm:text-7xl md:text-8xl lg:text-[128px]`, content: `Crafting the` / line break / `improbable`.
- Paragraph: `mt-6 md:mt-8 text-[#2D2D2F] font-inter text-base md:text-lg max-w-md leading-[1.5]`, text: `We bring your boldest digital visions to reality.` / `<br class="hidden sm:block">` / `Because it cannot be done is where we all begin now`.
- CTA below (`mt-8 md:mt-10`): pill `rounded-full bg-[#2D2D2F] text-white text-base font-medium px-10 py-4 shadow-md hover:bg-black transition-colors`, label `Begin a venture`.

**Animations / interactions**
- Color transitions on all links and buttons via `transition-colors`.
- Hamburger state via `useState`; no overlay/tint on the video.

**Responsiveness**
- Mobile: smaller heading (56px), stacked layout, hamburger menu.
- Tablet (md): larger heading, increased spacing.
- Desktop (lg+): nav + right CTA visible, heading 128px.

**File layout**
- `index.html` with font links and `<title>Speakup</title>`.
- `tailwind.config.js` with the font and color extensions.
- `src/index.css` with Tailwind directives + body font + `.font-recoleta`.
- `src/components/Logo.tsx`, `src/components/Hero.tsx`, and `src/App.tsx` rendering `<Hero />` inside `<main>`.