提示词
使用 React、Tailwind CSS 和 Lucide React icons 创建一个 "Stellar.ai" 落地页 hero section。使用 Inter 字体（从 Google Fonts 导入）。页面采用白色背景（bg-white），max-width 为 max-w-7xl，并通过 mx-auto 居中。
字体：从 Google Fonts 导入 Inter（字重 400、500、600、700）。在 body 上设置 font-family: 'Inter', sans-serif。
自定义 CSS 动画（位于 index.css）：
@keyframes fadeInUp -- 从 opacity: 0; transform: translateY(30px) 到 opacity: 1; transform: translateY(0)。Class .animate-fade-in-up 使用此动画，并设置 0.6s ease-out forwards。
@keyframes fadeInOverlay -- 从 opacity: 0 到 opacity: 1。Class .animate-fade-in-overlay 使用此动画，并设置 0.4s ease-out forwards。
@keyframes fadeInDialog -- 从 opacity: 0 到 opacity: 1。Class .animate-slide-up-overlay 使用此动画，并设置 0.5s ease-out forwards，同时带有 transform: translate(-50%, -50%)。
每个主要 section 都使用 .animate-fade-in-up，并通过内联样式设置错开的 animationDelay（从 0.1s 开始，每次递增 0.1s）。每个元素的内联 opacity 初始值均为 0，以便动画将其变为可见。
Tailwind config：使用默认配置，不添加自定义 theme extensions。使用标准 content paths。
NAVIGATION（animationDelay: 0.1s）：
px-6 py-4 flex items-center justify-between max-w-7xl mx-auto
左侧：Lucide Star icon（w-5 h-5，fill-black）+ "Stellar.ai" 文本（text-lg font-semibold）
中间（移动端隐藏，hidden md:flex items-center gap-8）："解决方案" 搭配 ChevronDown、"面向团队" 搭配 ChevronDown、"关于我们"、"学习中心"——全部使用 text-sm text-gray-700 hover:text-black
右侧："登录" 链接（text-sm text-gray-700）+ "免费开始使用" 按钮（bg-black text-white px-5 py-2.5 rounded-full text-sm font-medium hover:bg-gray-800 transition-colors）
HERO SECTION（px-6 pt-24 pb-32 max-w-7xl mx-auto text-center）：
评价 Badge（delay: 0.2s）：inline-flex items-center gap-2 mb-8。包含一个带边框的正方形（w-6 h-6 border border-gray-300 rounded），内部放置填充样式的 Star icon，旁边是 "来自 18.3K+ 位用户的 4.9 分评价"（text-sm font-medium text-black）。
主标题（delay: 0.3s）：text-6xl md:text-7xl lg:text-[80px] font-normal leading-[1.1] tracking-tight mb-5。第一行："更聪明地工作。更快速地行动。" 第二行："AI 为你赋能。"，使用渐变文本（bg-gradient-to-r from-black via-gray-500 to-gray-400 bg-clip-text text-transparent）。
副标题（delay: 0.4s）：text-lg md:text-xl text-gray-600 mb-8 max-w-2xl mx-auto。文本："智能自动化与你喜爱的工具同步，简化任务、提高产出并节省时间。"
CTA Button（delay: 0.5s）：bg-black text-white px-8 py-3 rounded-full text-base font-medium hover:bg-gray-800 transition-colors mb-12。文本："开始免费试用"。
Tab Bar（delay: 0.6s）：居中的 bg-gray-100 rounded-lg p-1 容器。
移动端（md:hidden）：2x2 网格，包含 4 个按钮：分析（BarChart3）、训练（BookOpen）、测试（Users）、部署（Rocket）。Active：bg-white text-black shadow-sm。Inactive：text-gray-600。
桌面端（hidden md:flex）：相同的 4 个按钮横向排列，并带有垂直分隔线（w-px h-5 bg-gray-300）。
Tabs 使用 setInterval 每 4s 自动循环。State：useState('analyse')。
Video + Overlay Section（delay: 0.7s）：
容器：relative rounded-3xl overflow-hidden h-[400px] md:h-[500px]
Video：src="https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260319_165750_358b1e72-c921-48b7-aaac-f200994f32fb.mp4"，autoPlay、loop、muted、playsInline、w-full h-full object-cover。
每个 tab 对应 1 个条件式 Overlay，共 4 个；外层使用 animate-fade-in-overlay，内部卡片使用 animate-slide-up-overlay：
a. 分析："设置你的 AI 工作区" 向导，带有进度为 25% 的紫色进度条和 4 个步骤
b. 训练："AI 模型训练"，带有进度为 67% 的橙色进度条和 4 项指标
c. 测试："测试套件结果"，显示绿色成功状态和 127/127 项测试
d. 部署："部署到生产环境"，包含 4 个检查清单项目和“立即部署”按钮
公司 Logos（delay: 0.8s）：mt-24 flex，包含 INTERSCOPE、SPOTIFY、Nexera（圆点网格）、M3（serif italic）、LAURA COLE（LC 圆形）、vertex（圆点）原文提示词（English）
Create a "Stellar.ai" landing page hero section using React, Tailwind CSS, and Lucide React icons. Use the Inter font (imported from Google Fonts). The page has a white background (bg-white), max-width max-w-7xl, and is centered with mx-auto.
Font: Import Inter (weights 400, 500, 600, 700) from Google Fonts. Set font-family: 'Inter', sans-serif on the body.
Custom CSS animations (in index.css):
@keyframes fadeInUp -- from opacity: 0; transform: translateY(30px) to opacity: 1; transform: translateY(0). Class .animate-fade-in-up uses this with 0.6s ease-out forwards.
@keyframes fadeInOverlay -- from opacity: 0 to opacity: 1. Class .animate-fade-in-overlay uses this with 0.4s ease-out forwards.
@keyframes fadeInDialog -- from opacity: 0 to opacity: 1. Class .animate-slide-up-overlay uses this with 0.5s ease-out forwards and has transform: translate(-50%, -50%).
Every major section uses .animate-fade-in-up with staggered animationDelay inline styles (starting at 0.1s and incrementing by 0.1s). Each element starts with opacity: 0 inline so the animation fills it to visible.
Tailwind config: Default config with no custom theme extensions. Uses standard content paths.
NAVIGATION (animationDelay: 0.1s):
px-6 py-4 flex items-center justify-between max-w-7xl mx-auto
Left: Lucide Star icon (w-5 h-5, fill-black) + "Stellar.ai" text (text-lg font-semibold)
Center (hidden on mobile, hidden md:flex items-center gap-8): "Solutions" with ChevronDown, "For Teams" with ChevronDown, "About Us", "Learn Hub" -- all text-sm text-gray-700 hover:text-black
Right: "Login" link (text-sm text-gray-700) + "Get started free" button (bg-black text-white px-5 py-2.5 rounded-full text-sm font-medium hover:bg-gray-800 transition-colors)
HERO SECTION (px-6 pt-24 pb-32 max-w-7xl mx-auto text-center):
Reviews Badge (delay: 0.2s): inline-flex items-center gap-2 mb-8. Contains a bordered square (w-6 h-6 border border-gray-300 rounded) with a filled Star icon inside, plus "4.9 rating from 18.3K+ users" (text-sm font-medium text-black).
Main Heading (delay: 0.3s): text-6xl md:text-7xl lg:text-[80px] font-normal leading-[1.1] tracking-tight mb-5. First line: "Work Smarter. Move Faster." Second line: "AI Powers You Up." with gradient text (bg-gradient-to-r from-black via-gray-500 to-gray-400 bg-clip-text text-transparent).
Subheading (delay: 0.4s): text-lg md:text-xl text-gray-600 mb-8 max-w-2xl mx-auto. Text: "Intelligent automation syncs with the tools you love to streamline tasks, boost output, and save time."
CTA Button (delay: 0.5s): bg-black text-white px-8 py-3 rounded-full text-base font-medium hover:bg-gray-800 transition-colors mb-12. Text: "Begin Free Trial".
Tab Bar (delay: 0.6s): Centered bg-gray-100 rounded-lg p-1 container.
Mobile (md:hidden): 2x2 grid with 4 buttons: Analyse (BarChart3), Train (BookOpen), Testing (Users), Deploy (Rocket). Active: bg-white text-black shadow-sm. Inactive: text-gray-600.
Desktop (hidden md:flex): Same 4 buttons in row with vertical dividers (w-px h-5 bg-gray-300).
Tabs auto-cycle every 4s using setInterval. State: useState('analyse').
Video + Overlay Section (delay: 0.7s):
Container: relative rounded-3xl overflow-hidden h-[400px] md:h-[500px]
Video: src="https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260319_165750_358b1e72-c921-48b7-aaac-f200994f32fb.mp4", autoPlay, loop, muted, playsInline, w-full h-full object-cover.
4 Conditional Overlays per tab with animate-fade-in-overlay outer and animate-slide-up-overlay inner card:
a. Analyse: "Set Up Your AI Workspace" wizard with purple progress bar at 25%, 4 steps
b. Train: "AI Model Training" with orange progress at 67%, 4 metrics
c. Testing: "Test Suite Results" with green success, 127/127 tests
d. Deploy: "Deploy to Production" with 4 checklist items, Deploy Now button
Company Logos (delay: 0.8s): mt-24 flex with INTERSCOPE, SPOTIFY, Nexera (dot grid), M3 (serif italic), LAURA COLE (LC circle), vertex (dots)
