Keel

Build a high-performance, agency-grade Creative section called "Keel" in React 19, TypeScript, and Tailwind CSS with Framer Motion.

## 1. Overview & Visual Objective
Create an ultra-refined, interactive Creative with cinematic transitions and smooth spring physics.

Visual Aesthetics & Mood:
keel-scroll-film-hero;performance partnership revenue-share software studio SEO conversion retention growth agency full-screen scroll-driven video frame-by-frame scrub blue sky cinematic background chrome clouds white typography editorial serif branding left rail navigation grid-system layout fixed panels cross-fade storytelling framed geometry hairline rules spark star markers mono labels technical interface asymmetrical composition left-aligned headline premium minimalist web design TT Ramillas serif Inter body JetBrains Mono microcopy black CTA compact arrow button blue gradient atmosphere grain texture no dark overlay geometric frame animation moving guide lines pixel-dither transition pixelated hole reveal sparkling edge center-opening mask video zoom transition interactive canvas effect work showcase section vertical progress rail tick marks percentage counter scrolling service list parallax sky background slow zoom custom software search engine optimization conversion systems retention loops performance-based pricing no retainers shared upside partnership model modern creative technology studio sophisticated experimental immersive polished motion-led responsive cinematic interface design

## 2. Technical Stack & Dependencies
- Framework: React 19 + TypeScript + Vite
- Styling: Tailwind CSS v4 + Lucide React icons
- Animation Engine: Framer Motion (layout animations, spring physics, scroll-linked parallax)