Yoga Coach

Build a high-performance, agency-grade Landing Page section called "Yoga Coach" in React 19, TypeScript, and Tailwind CSS with Framer Motion.

## 1. Overview & Visual Objective
Build a full-screen, two-section yoga coach landing page using React + TypeScript + Vite + Tailwind CSS v4 + Motion (framer-motion successor) + hls.js. The page has NO scrolling -- it is exactly viewport-sized with two states: a hero video screen and a second "collection" screen that slides up after the video ends.

Visual Aesthetics & Mood:
single viewport no scroll two-state screen fullscreen hero video that slides up into collection view bold all-caps condensed display typography poster-like massive uppercase text calm wellness energy dramatic sliding panel transition minimal stark confident editorial athletic serene focused

## 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)