refactor(web): 拆分 LandingPage 为可复用组件（HeaderBar/Hero/AnimatedSection 等），新增 pages 结构并完成集成；构建通过

web/src/components/landing/FeaturesSection.tsx

@@ -0,0 +1,56 @@
+import { motion } from 'framer-motion'
+import AnimatedSection from './AnimatedSection'
+import { CryptoFeatureCard } from '../CryptoFeatureCard'
+import { Code, Cpu, Lock, Rocket } from 'lucide-react'
+
+export default function FeaturesSection() {
+  return (
+    <AnimatedSection id='features'>
+      <div className='max-w-7xl mx-auto'>
+        <motion.div className='text-center mb-16' initial={{ opacity: 0, y: 30 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }}>
+          <motion.div
+            className='inline-flex items-center gap-2 px-4 py-2 rounded-full mb-6'
+            style={{ background: 'rgba(240, 185, 11, 0.1)', border: '1px solid rgba(240, 185, 11, 0.2)' }}
+            whileHover={{ scale: 1.05 }}
+          >
+            <Rocket className='w-4 h-4' style={{ color: 'var(--brand-yellow)' }} />
+            <span className='text-sm font-semibold' style={{ color: 'var(--brand-yellow)' }}>
+              核心功能
+            </span>
+          </motion.div>
+          <h2 className='text-4xl font-bold mb-4' style={{ color: 'var(--brand-light-gray)' }}>
+            为什么选择 NOFX？
+          </h2>
+          <p className='text-lg' style={{ color: 'var(--text-secondary)' }}>
+            开源、透明、社区驱动的 AI 交易操作系统
+          </p>
+        </motion.div>
+
+        <div className='grid md:grid-cols-2 lg:grid-cols-3 gap-8 max-w-7xl mx-auto'>
+          <CryptoFeatureCard
+            icon={<Code className='w-8 h-8' />}
+            title='100% 开源与自托管'
+            description='你的框架，你的规则。非黑箱，支持自定义提示词和多模型。'
+            features={['完全开源代码', '支持自托管部署', '自定义 AI 提示词', '多模型支持（DeepSeek、Qwen）']}
+            delay={0}
+          />
+          <CryptoFeatureCard
+            icon={<Cpu className='w-8 h-8' />}
+            title='多代理智能竞争'
+            description='AI 策略在沙盒中高速战斗，最优者生存，实现策略进化。'
+            features={['多 AI 代理并行运行', '策略自动优化', '沙盒安全测试', '跨市场策略移植']}
+            delay={0.1}
+          />
+          <CryptoFeatureCard
+            icon={<Lock className='w-8 h-8' />}
+            title='安全可靠交易'
+            description='企业级安全保障，完全掌控你的资金和交易策略。'
+            features={['本地私钥管理', 'API 权限精细控制', '实时风险监控', '交易日志审计']}
+            delay={0.2}
+          />
+        </div>
+      </div>
+    </AnimatedSection>
+  )
+}
+