Power AI

创建一个全屏深色 hero section，其中包含循环背景视频、navbar、headline、subtitle、CTA button，以及底部的 logo marquee。以下是确切规格：

主题与颜色（index.css CSS variables）：
背景：260 87% 3%（深邃的暗蓝紫色）
前景：40 6% 95%（灰白色）
Hero 副文本：40 6% 82%
正文字体：Geist Sans（通过 @fontsource/geist-sans）
Headline 字体：General Sans（从 Fontshare 加载：https://api.fontshare.com/v2/css?f[]=general-sans@400,500,600,700&display=swap）

背景视频（Index page wrapper）：
视频 URL：https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260328_065045_c44942da-53c6-4804-b734-f9e07fc22e08.mp4
采用 absolute 定位，设置 inset-0 w-full h-full object-cover，位于所有内容之后
初始 opacity: 0
由自定义 JS 控制的淡化循环：开始时用 0.5s 淡入，结束时用 0.5s 淡出，并使用 requestAnimationFrame。触发 ended 时，opacity 重置为 0，等待 100ms，然后从 0 开始重新播放
视频上不使用渐变 overlays
wrapper div 设置 overflow-hidden，hero 内容位于其上方的 relative z-10 div 中

模糊 overlay shape（在内容后方居中）：
w-[984px] h-[527px] opacity-90 bg-gray-950 blur-[82px]
采用绝对定位，设置 top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2
pointer-events-none
hero section 设置 overflow-visible，使模糊效果不被裁剪

Navbar：
全宽，py-5 px-8，flex row 并设置 justify-between
左侧：logo image（src/assets/logo.png，高度 32px）
中间：nav items——“功能”（带 ChevronDown）、“解决方案”、“方案”、“学习”（带 ChevronDown）。每项都是 button，使用 text-foreground/90 和 hover transition
右侧：“注册”button，使用 heroSecondary variant，rounded-full px-4 py-2
Navbar 下方：一条 1px divider line，渐变为 from-transparent via-foreground/20 to-transparent，偏移 mt-[3px]

Hero 内容（通过 flex-1 在剩余空间中垂直居中）：
Headline：“Power AI”，设置 text-[220px]、font-normal、leading-[1.02]、tracking-[-0.024em]，font-family General Sans
“Power ”使用普通的 text-foreground
“AI”使用 bg-clip-text text-transparent，backgroundImage：linear-gradient(to left, #6366f1, #a855f7, #fcd34d)（靛蓝 → 紫色 → 琥珀色）
Subtitle：“人才招聘领域有史以来部署的 / 最强大 AI”——text-hero-sub、text-lg、leading-8、max-w-md、mt-[9px]、opacity-80
CTA：“预约咨询”button，使用 heroSecondary variant，px-[29px] py-[24px]，mt-[25px]

Logo marquee（固定在 hero 底部，pb-10）：
容器：max-w-5xl mx-auto
左侧：静态文字“深受全球 / 各地品牌信赖”，使用 text-foreground/50 text-sm
右侧：无限滚动 marquee，包含 logos：Vortex、Nimbus、Prysma、Cirrus、Kynder、Halcyn（复制一组以实现无缝循环）
每个 logo：一个 liquid-glass 24x24 rounded-lg icon，显示名称的首字母，旁边是使用 text-base font-semibold text-foreground 的名称
Marquee 动画：translateX(0%) → translateX(-50%)，20s linear infinite
logos 之间设置 gap-16，文字与 marquee 之间设置 gap-12

Liquid glass utility class（位于 index.css）：
.liquid-glass { background: rgba(255, 255, 255, 0.01); background-blend-mode: luminosity; backdrop-filter: blur(4px); border: none; box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.1); position: relative; overflow: hidden; }
.liquid-glass::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.4px; background: linear-gradient(180deg, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.15) 20%, rgba(255,255,255,0) 40%, rgba(255,255,255,0) 60%, rgba(255,255,255,0.15) 80%, rgba(255,255,255,0.45) 100%); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }

Section 结构：min-h-screen flex flex-col——navbar 位于顶部，内容通过 flex-1 flex items-center justify-center 居中，marquee 位于底部。