假肢 Hero

使用 Vite 构建一个 React + TypeScript + Tailwind CSS 单页 Hero 区域。整个页面都位于 `src/App.tsx` 中。除 `react`、`react-dom`、`lucide-react` 和 Tailwind 外，不使用其他库。

**背景：**
- 一个全屏、自动播放、静音、循环且带 `playsInline` 的背景 `<video>` 元素，使用绝对定位和 `inset-0 w-full h-full object-cover`。
- 视频 URL（必须完全一致）：`https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260508_215831_c6a8989c-d716-4d8d-8745-e972a2eec711.mp4`
- 根 wrapper：`relative min-h-screen overflow-hidden bg-[#f0f0ee]`。
- 前景内容 wrapper：`relative z-10 flex flex-col min-h-screen`。

**Logo（内联 SVG 组件）：**
- `width="18" height="18"`、`viewBox="0 0 256 256"`、`fill="none"`。
- 单个 path，使用 `fill="rgb(84, 84, 84)"` 和 `d="M 160 88 L 194 34 L 216 0 L 256 0 L 256 40 L 221.5 93.5 L 200 128 L 256 128 L 256 256 L 96 256 L 96 168 L 64.246 220 L 40 256 L 0 256 L 0 216 L 34 162 L 56 128 L 0 128 L 0 0 L 160 0 Z"`。

**Navbar（居中、胶囊样式，两个独立胶囊）：**
- `<nav>` classes：`flex items-center justify-center pt-4 sm:pt-6 px-4 sm:px-8 gap-2 sm:gap-3`。
- 左侧圆形 logo 容器：`flex items-center justify-center rounded-full w-10 h-10 sm:w-11 sm:h-11 shrink-0`，inline style `backgroundColor: '#EDEDED'`，包含 Logo。
- 右侧胶囊容器：`flex items-center gap-4 sm:gap-10 rounded-xl px-4 sm:px-8 py-2.5 sm:py-3`，inline style `backgroundColor: '#EDEDED'`。
- 导航链接数组：`['故事', '产品', '帮助', '支持']`。每个 anchor：`text-[12px] sm:text-[14px] font-medium text-gray-700 hover:text-gray-900 transition-colors duration-200`。

**Hero 内容（左下对齐）：**
- 外层：`flex-1 flex items-end pb-10 sm:pb-16 lg:pb-20 px-6 sm:px-12 md:px-20 lg:px-28`。
- 内层：`max-w-xs`。四个垂直排列的元素，每个都带 `mb-3`：

1. Badge 链接：`inline-flex items-center gap-1.5 text-[11.5px] font-medium text-blue-500 hover:text-blue-600 transition-colors mb-3 group`。文本：`曾亮相印度 Shark Tank`，后接 span 中的箭头 `→`，span 使用 `inline-block transition-transform duration-200 group-hover:translate-x-0.5`。

2. 标题 `<h1>`：`text-[1.5rem] sm:text-[1.75rem] leading-[1.15] font-medium text-gray-900 tracking-tight mb-3`。文本：`为永不放弃的人打造简单、智能的假肢。`

3. 辅助文本 `<p>`：`text-[13px] text-gray-400 font-normal mb-3`。文本：`立即重获行动能力。`

4. CTA anchor：`inline-flex items-center gap-2 text-[13px] font-medium text-blue-500 border border-blue-400 rounded-full px-5 py-2.5 hover:bg-blue-500 hover:text-white hover:border-blue-500 transition-all duration-200 group`。文本：`免费试配`，后接 span 中的箭头 `→`，span 使用 `transition-transform duration-200 group-hover:translate-x-0.5`。

**动画/微交互：**
- group hover 时，箭头 span 向右平移 `0.5`（`group-hover:translate-x-0.5`）。
- CTA 在 hover 时填充蓝色（背景 + 文本 + 边框过渡，200ms）。
- 导航链接在 hover 时从 gray-700 变为 gray-900。

**字体：**使用 Tailwind 默认的 sans-serif 系统字体栈（不使用自定义字体）。所有字号均严格采用上述像素/rem 值（`11.5px`、`12px`、`13px`、`14px`、`1.5rem`、`1.75rem`）。

**颜色：**页面背景 `#f0f0ee`；胶囊背景 `#EDEDED`；强调色 `blue-500/600/400`；文本 `gray-900/700/400`。

不要添加任何其他区域，不接入 Supabase，不添加路由。只实现上述单个 Hero 页面。