's'

app/globals.css

@@ -18,3 +18,67 @@ body {
   color: var(--foreground);
   font-family: var(--font-sans);
 }
+
+@keyframes float {
+  0%, 100% {
+    transform: translate(0, 0) scale(1);
+    opacity: 0.6;
+  }
+  25% {
+    transform: translate(10px, -20px) scale(1.1);
+    opacity: 0.9;
+  }
+  50% {
+    transform: translate(-15px, 10px) scale(0.9);
+    opacity: 0.7;
+  }
+  75% {
+    transform: translate(5px, 15px) scale(1.05);
+    opacity: 0.8;
+  }
+}
+
+@keyframes shimmer {
+  0% {
+    background-position: -200% 0;
+  }
+  100% {
+    background-position: 200% 0;
+  }
+}
+
+@keyframes pulse-glow {
+  0%, 100% {
+    box-shadow: 0 0 20px rgba(139, 92, 246, 0.3);
+  }
+  50% {
+    box-shadow: 0 0 40px rgba(139, 92, 246, 0.5);
+  }
+}
+
+@keyframes gradient-shift {
+  0% {
+    background-position: 0% 50%;
+  }
+  50% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0% 50%;
+  }
+}
+
+.animate-shimmer {
+  background: linear-gradient(
+    90deg,
+    transparent 0%,
+    rgba(255, 255, 255, 0.4) 50%,
+    transparent 100%
+  );
+  background-size: 200% 100%;
+  animation: shimmer 2s infinite;
+}
+
+.animate-pulse-glow {
+  animation: pulse-glow 3s ease-in-out infinite;
+}

app/page.tsx

@@ -1,31 +1,11 @@
-import { SiteHeader } from "~/components/layout/site-header";
-import { SiteFooter } from "~/components/layout/site-footer";
 import { Hero } from "~/components/sections/hero";
-import { ValueGrid } from "~/components/sections/value-grid";
-import { EntryGrid } from "~/components/sections/entry-grid";
-import { Methodology } from "~/components/sections/methodology";
-import { Scenarios } from "~/components/sections/scenarios";
-import { Ecosystem } from "~/components/sections/ecosystem";
-import { ContentPreview } from "~/components/sections/content-preview";
-import { Trust } from "~/components/sections/trust";
-import { FinalCta } from "~/components/sections/final-cta";
 
 export default function HomePage() {
   return (
     <div className="min-h-screen bg-white">
-      <SiteHeader />
       <main>
         <Hero />
-        <ValueGrid />
-        <EntryGrid />
-        <Methodology />
-        <Scenarios />
-        <Ecosystem />
-        <ContentPreview />
-        <Trust />
-        <FinalCta />
       </main>
-      <SiteFooter />
     </div>
   );
 }

components/sections/entry-grid.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import Link from "next/link";
-import { MapPin, BookOpen, Crown, ArrowRight } from "lucide-react";
+import { MapPin, BookOpen, Crown, Zap, Users, ArrowRight } from "lucide-react";
 import { motion } from "framer-motion";
 import { ENTRY_PATHS } from "~/lib/data";
 
@@ -9,25 +9,33 @@ const ICON_MAP = {
   MapPin,
   BookOpen,
   Crown,
+  Zap,
+  Users,
 } as const;
 
 const ACCENT_STYLES = {
-  blue: "border-l-blue-500/80 hover:border-l-blue-500",
-  green: "border-l-emerald-500/80 hover:border-l-emerald-500",
-  amber: "border-l-amber-500/80 hover:border-l-amber-500",
+  blue: "border-l-4 border-l-blue-500 bg-gradient-to-r from-blue-50/80 to-white hover:from-blue-100/80",
+  green: "border-l-4 border-l-emerald-500 bg-gradient-to-r from-emerald-50/80 to-white hover:from-emerald-100/80",
+  amber: "border-l-4 border-l-amber-500 bg-gradient-to-r from-amber-50/80 to-white hover:from-amber-100/80",
 } as const;
 
+const CARD_EMOJI: Record<string, string> = {
+  nav: "🧭",
+  arbitrage: "⚡",
+  salon: "🎯",
+};
+
 export function EntryGrid() {
   return (
-    <section className="bg-white py-16 md:py-24">
+    <section className="bg-gradient-to-b from-violet-50/30 to-white py-20 md:py-28">
       <div className="container mx-auto px-4 md:px-6">
         <motion.h2
           initial={{ opacity: 0, y: 12 }}
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true, margin: "-80px" }}
-          className="text-center text-2xl font-semibold text-neutral-900 md:text-3xl"
+          className="text-center text-2xl font-bold text-neutral-900 md:text-3xl"
         >
-          选择你的入口
+          🚀 选择你的入口
         </motion.h2>
         <motion.p
           initial={{ opacity: 0 }}
@@ -38,10 +46,11 @@ export function EntryGrid() {
           三大路径，对应不同的需求和阶段
         </motion.p>
 
-        <div className="mt-12 grid gap-6 md:grid-cols-3">
+        <div className="mt-14 grid gap-6 md:grid-cols-3">
           {ENTRY_PATHS.map((path, i) => {
-            const Icon = ICON_MAP[path.icon];
+            const Icon = ICON_MAP[path.icon as keyof typeof ICON_MAP] ?? MapPin;
             const accent = ACCENT_STYLES[path.accent];
+            const emoji = CARD_EMOJI[path.id] ?? "✨";
             return (
               <motion.div
                 key={path.id}
@@ -49,23 +58,25 @@ export function EntryGrid() {
                 whileInView={{ opacity: 1, y: 0 }}
                 viewport={{ once: true, margin: "-40px" }}
                 transition={{ delay: i * 0.08 }}
+                whileHover={{ y: -4 }}
               >
                 <Link
                   href={path.href}
                   target="_blank"
                   rel="noopener noreferrer"
-                  className={`group block rounded-xl border border-neutral-200 bg-white p-6 transition-all hover:-translate-y-1 hover:shadow-lg ${accent} border-l-4`}
+                  className={`group block rounded-2xl border border-neutral-200/80 p-6 transition-all hover:shadow-xl ${accent}`}
                 >
-                  <Icon className="h-10 w-10 text-neutral-600" />
-                  <h3 className="mt-4 text-lg font-semibold text-neutral-900">
+                  <span className="text-2xl">{emoji}</span>
+                  <Icon className="mt-3 h-10 w-10 text-neutral-600 transition-transform group-hover:scale-110" />
+                  <h3 className="mt-4 text-lg font-bold text-neutral-900">
                     {path.title}
                   </h3>
                   <p className="mt-2 text-sm text-neutral-600">
                     {path.description}
                   </p>
-                  <span className="mt-4 inline-flex items-center gap-1 text-sm font-medium text-neutral-700 group-hover:text-neutral-900">
+                  <span className="mt-4 inline-flex items-center gap-1 text-sm font-semibold text-neutral-700 group-hover:text-neutral-900">
                     {path.cta}
-                    <ArrowRight className="h-4 w-4 transition-transform group-hover:translate-x-1" />
+                    <ArrowRight className="h-4 w-4 transition-transform group-hover:translate-x-2" />
                   </span>
                 </Link>
               </motion.div>

components/sections/final-cta.tsx

@@ -10,15 +10,15 @@ const ICONS = [MapPin, BookOpen, Crown] as const;
 
 export function FinalCta() {
   return (
-    <section className="bg-neutral-900 py-16 text-white md:py-24">
+    <section className="relative overflow-hidden bg-gradient-to-br from-violet-900 via-fuchsia-900 to-cyan-900 py-20 text-white md:py-28">
       <div className="container mx-auto px-4 md:px-6">
         <motion.h2
           initial={{ opacity: 0, y: 12 }}
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true, margin: "-80px" }}
-          className="text-center text-2xl font-semibold md:text-3xl"
+          className="text-center text-2xl font-bold md:text-3xl"
         >
-          从这里开始你的数字游民路径
+          ✨ 从这里开始你的数字游民路径
         </motion.h2>
         <motion.p
           initial={{ opacity: 0 }}
@@ -48,7 +48,7 @@ export function FinalCta() {
                 <Button
                   variant="outline"
                   size="lg"
-                  className="w-full min-w-[200px] border-neutral-600 bg-transparent text-white hover:bg-neutral-800 hover:text-white sm:w-auto"
+                  className="w-full min-w-[200px] border-white/40 bg-white/10 text-white backdrop-blur-sm hover:bg-white/20 hover:border-white/60 sm:w-auto"
                 >
                   <Icon className="mr-2 h-4 w-4" />
                   {cta.label}

components/sections/hero.tsx

@@ -1,138 +1,108 @@
 "use client";
 
 import Link from "next/link";
-import { MapPin, BookOpen, Crown } from "lucide-react";
+import { MapPin, Zap, Users, ArrowRight } from "lucide-react";
 import { motion } from "framer-motion";
-import { HERO_TAGS } from "~/lib/data";
-import { Button } from "~/components/ui/button";
+import { ENTRY_CARDS } from "~/lib/data";
+import { Particles } from "~/components/ui/particles";
 
-const HERO_CARDS = [
-  {
-    title: "探索城市",
-    desc: "找到适合远程生活的地方",
-    icon: MapPin,
-    href: "https://meetup.hackrobot.cn",
-  },
-  {
-    title: "学习专题",
-    desc: "从零搭建你的技能与收入结构",
-    icon: BookOpen,
-    href: "https://digital.hackrobot.cn",
-  },
-  {
-    title: "会员社区",
-    desc: "进入更高密度的人脉与资源网络",
-    icon: Crown,
-    href: "https://vip.hackrobot.cn",
-  },
-];
+const ICON_MAP = {
+  MapPin,
+  Zap,
+  Users,
+} as const;
+
+const ACCENT_STYLES = {
+  blue: "from-blue-500/20 to-cyan-500/10 border-blue-300/80 hover:border-blue-400 hover:shadow-2xl",
+  emerald: "from-emerald-500/20 to-teal-500/10 border-emerald-300/80 hover:border-emerald-400 hover:shadow-2xl",
+  amber: "from-amber-500/20 to-orange-500/10 border-amber-300/80 hover:border-amber-400 hover:shadow-2xl",
+} as const;
+
+const CARD_EMOJI = {
+  nav: "🧭",
+  arbitrage: "⚡",
+  salon: "🎯",
+} as const;
+
+const ICON_COLORS = {
+  blue: "text-blue-600",
+  emerald: "text-emerald-600",
+  amber: "text-amber-600",
+} as const;
 
 export function Hero() {
   return (
-    <section className="relative overflow-hidden bg-white">
-      <div className="container mx-auto px-4 py-16 md:px-6 md:py-24 lg:py-32">
-        <div className="grid gap-12 lg:grid-cols-2 lg:gap-16">
-          <div className="flex flex-col justify-center">
-            <motion.div
-              initial={{ opacity: 0, y: 16 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ duration: 0.5 }}
-            >
-              <h1 className="text-3xl font-semibold tracking-tight text-neutral-900 sm:text-4xl md:text-5xl">
-                中文数字游民操作系统
-              </h1>
-              <p className="mt-4 text-lg text-neutral-600 md:text-xl">
-                从城市、技能、工具到社群，一站开始
-              </p>
-              <p className="mt-2 text-base text-neutral-500">
-                帮你从固定工位，走向自由生活与自由收入
-              </p>
-            </motion.div>
-
-            <motion.p
-              initial={{ opacity: 0 }}
-              animate={{ opacity: 1 }}
-              transition={{ delay: 0.2, duration: 0.4 }}
-              className="mt-6 max-w-lg text-sm text-neutral-500"
-            >
-              数字游民不只是旅行，而是「地点自由 + 收入结构 + 系统工具 + 社群连接」的组合。
-            </motion.p>
-
-            <motion.div
-              initial={{ opacity: 0, y: 12 }}
-              animate={{ opacity: 1, y: 0 }}
-              transition={{ delay: 0.3, duration: 0.4 }}
-              className="mt-8 flex flex-wrap gap-3"
-            >
-              <Link
-                href="https://meetup.hackrobot.cn"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <Button size="lg" className="min-w-[180px]">
-                  开始你的数字游民路径
-                </Button>
-              </Link>
-              <Link
-                href="https://meetup.hackrobot.cn"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <Button variant="outline" size="lg">
-                  探索适合你的城市
-                </Button>
-              </Link>
-              <Link
-                href="https://digital.hackrobot.cn"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                <Button variant="ghost" size="lg">
-                  查看学习专题
-                </Button>
-              </Link>
-            </motion.div>
-
-            <motion.div
-              initial={{ opacity: 0 }}
-              animate={{ opacity: 1 }}
-              transition={{ delay: 0.5 }}
-              className="mt-10 flex flex-wrap gap-2"
-            >
-              {HERO_TAGS.map((tag, i) => (
-                <span
-                  key={tag}
-                  className="rounded-full border border-neutral-200 bg-neutral-50 px-3 py-1 text-xs text-neutral-600"
-                >
-                  {tag}
-                </span>
-              ))}
-            </motion.div>
-          </div>
+    <section className="relative min-h-[100dvh] overflow-hidden bg-gradient-to-br from-violet-50 via-white to-cyan-50">
+      <Particles />
+      <div
+        className="pointer-events-none absolute inset-0 opacity-30"
+        style={{
+          backgroundImage: `radial-gradient(circle at 20% 80%, rgba(139, 92, 246, 0.15) 0%, transparent 50%),
+            radial-gradient(circle at 80% 20%, rgba(6, 182, 212, 0.15) 0%, transparent 50%)`,
+        }}
+      />
+      <div className="container relative mx-auto flex min-h-[100dvh] flex-col justify-center px-3 py-6 sm:px-4 sm:py-8 md:px-6 md:py-16 lg:py-24">
+        <div className="mx-auto max-w-4xl text-center">
+          <motion.div
+            initial={{ opacity: 0, y: 16 }}
+            animate={{ opacity: 1, y: 0 }}
+            transition={{ delay: 0.1, duration: 0.5 }}
+          >
+            <h1 className="text-2xl font-bold tracking-tight sm:text-4xl md:text-5xl lg:text-6xl">
+              <span className="bg-gradient-to-r from-violet-600 via-fuchsia-500 to-cyan-600 bg-clip-text text-transparent">
+                数字游民
+              </span>{" "}
+              <span className="text-neutral-800">nomadro</span>
+            </h1>
+          </motion.div>
 
           <motion.div
-            initial={{ opacity: 0, x: 24 }}
-            animate={{ opacity: 1, x: 0 }}
-            transition={{ delay: 0.4, duration: 0.5 }}
-            className="flex flex-col gap-4 lg:justify-center"
+            initial={{ opacity: 0, y: 24 }}
+            animate={{ opacity: 1, y: 0 }}
+            transition={{ delay: 0.3, duration: 0.5 }}
+            className="mt-6 flex flex-col gap-3 sm:mt-8 sm:gap-4 lg:mt-12 lg:grid lg:grid-cols-3 lg:gap-6"
           >
-            <div className="grid gap-4 sm:grid-cols-3">
-              {HERO_CARDS.map((card, i) => (
-                <Link
-                  key={card.title}
-                  href={card.href}
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="group flex flex-col rounded-xl border border-neutral-200 bg-white p-5 shadow-sm transition-all hover:-translate-y-1 hover:shadow-md"
+            {ENTRY_CARDS.map((card, i) => {
+              const Icon = ICON_MAP[card.icon];
+              const accent = ACCENT_STYLES[card.accent];
+              const emoji = CARD_EMOJI[card.id];
+              const iconColor = ICON_COLORS[card.accent];
+              return (
+                <motion.div
+                  key={card.id}
+                  initial={{ opacity: 0, y: 20 }}
+                  animate={{ opacity: 1, y: 0 }}
+                  transition={{ delay: 0.4 + i * 0.1, duration: 0.4 }}
+                  whileHover={{ scale: 1.01, y: -2 }}
                 >
-                  <card.icon className="h-8 w-8 text-neutral-400 transition-colors group-hover:text-neutral-700" />
-                  <h3 className="mt-3 font-medium text-neutral-900">
-                    {card.title}
-                  </h3>
-                  <p className="mt-1 text-sm text-neutral-500">{card.desc}</p>
-                </Link>
-              ))}
-            </div>
+                  <Link
+                    href={card.href}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className={`group relative flex items-center gap-4 overflow-hidden rounded-2xl border-2 bg-gradient-to-br p-4 transition-all duration-300 active:scale-[0.99] lg:flex-col lg:items-stretch lg:gap-0 lg:p-6 ${accent}`}
+                  >
+                    <div className="absolute -right-6 -top-6 text-5xl opacity-20 transition-transform group-hover:scale-110 group-hover:opacity-30 sm:-right-8 sm:-top-8 sm:text-6xl">
+                      {emoji}
+                    </div>
+                    <div className={`relative flex h-11 w-11 shrink-0 items-center justify-center self-start rounded-xl bg-white/80 shadow-sm lg:h-12 lg:w-12 ${iconColor}`}>
+                      <Icon className="h-5 w-5 group-hover:scale-110 transition-transform lg:h-6 lg:w-6" />
+                    </div>
+                    <div className="relative min-w-0 flex-1 lg:mt-4">
+                      <h2 className="text-base font-bold text-neutral-900 lg:text-xl">
+                        {card.label}
+                      </h2>
+                      <p className="mt-0.5 text-sm text-neutral-600">
+                        {card.title}
+                      </p>
+                      <p className="mt-1 hidden text-xs text-neutral-500 lg:block">
+                        {card.description}
+                      </p>
+                    </div>
+                    <ArrowRight className="relative h-5 w-5 shrink-0 text-neutral-400 transition-all group-hover:translate-x-1 group-hover:text-violet-500 lg:absolute lg:right-4 lg:top-4" />
+                  </Link>
+                </motion.div>
+              );
+            })}
           </motion.div>
         </div>
       </div>

components/sections/methodology.tsx

@@ -13,15 +13,15 @@ const ICON_MAP = {
 
 export function Methodology() {
   return (
-    <section className="bg-neutral-50 py-16 md:py-24">
+    <section className="bg-gradient-to-b from-white to-cyan-50/20 py-20 md:py-28">
       <div className="container mx-auto px-4 md:px-6">
         <motion.h2
           initial={{ opacity: 0, y: 12 }}
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true, margin: "-80px" }}
-          className="text-center text-2xl font-semibold text-neutral-900 md:text-3xl"
+          className="text-center text-2xl font-bold text-neutral-900 md:text-3xl"
         >
-          数字游民，不只是旅行
+          🌍 数字游民，不只是旅行
         </motion.h2>
         <motion.p
           initial={{ opacity: 0 }}
@@ -38,11 +38,12 @@ export function Methodology() {
             return (
               <motion.div
                 key={sys.id}
+                whileHover={{ y: -4 }}
                 initial={{ opacity: 0, y: 20 }}
                 whileInView={{ opacity: 1, y: 0 }}
                 viewport={{ once: true, margin: "-40px" }}
                 transition={{ delay: i * 0.05 }}
-                className="rounded-xl border border-neutral-200 bg-white p-6"
+                className="rounded-2xl border-2 border-neutral-200/80 bg-white p-6 shadow-sm transition-all hover:border-cyan-200 hover:shadow-xl"
               >
                 <Icon className="h-9 w-9 text-neutral-600" />
                 <h3 className="mt-4 font-medium text-neutral-900">

components/sections/scenarios.tsx

@@ -7,15 +7,15 @@ import { SCENARIOS } from "~/lib/data";
 
 export function Scenarios() {
   return (
-    <section className="bg-white py-16 md:py-24">
+    <section className="bg-gradient-to-b from-cyan-50/20 to-white py-20 md:py-28">
       <div className="container mx-auto px-4 md:px-6">
         <motion.h2
           initial={{ opacity: 0, y: 12 }}
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true, margin: "-80px" }}
-          className="text-center text-2xl font-semibold text-neutral-900 md:text-3xl"
+          className="text-center text-2xl font-bold text-neutral-900 md:text-3xl"
         >
-          找到你的场景
+          🎯 找到你的场景
         </motion.h2>
         <motion.p
           initial={{ opacity: 0 }}
@@ -39,7 +39,7 @@ export function Scenarios() {
                 href={s.href}
                 target="_blank"
                 rel="noopener noreferrer"
-                className="group block rounded-xl border border-neutral-200 bg-neutral-50/50 p-5 transition-all hover:border-neutral-300 hover:bg-white hover:shadow-md"
+                className="group block rounded-2xl border-2 border-neutral-200/80 bg-white p-5 transition-all hover:border-fuchsia-200 hover:shadow-xl"
               >
                 <p className="font-medium text-neutral-900">{s.pain}</p>
                 <p className="mt-1 text-sm text-neutral-500">{s.path}</p>

components/sections/trust.tsx

@@ -8,15 +8,15 @@ const ICON_MAP = [Target, Layers, Handshake] as const;
 
 export function Trust() {
   return (
-    <section className="bg-neutral-50 py-16 md:py-24">
+    <section className="bg-gradient-to-b from-white to-amber-50/20 py-20 md:py-28">
       <div className="container mx-auto px-4 md:px-6">
         <motion.h2
           initial={{ opacity: 0, y: 12 }}
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true, margin: "-80px" }}
-          className="text-center text-2xl font-semibold text-neutral-900 md:text-3xl"
+          className="text-center text-2xl font-bold text-neutral-900 md:text-3xl"
         >
-          我们的原则
+          💎 我们的原则
         </motion.h2>
         <motion.p
           initial={{ opacity: 0 }}
@@ -37,7 +37,7 @@ export function Trust() {
                 whileInView={{ opacity: 1, y: 0 }}
                 viewport={{ once: true, margin: "-40px" }}
                 transition={{ delay: i * 0.06 }}
-                className="rounded-xl border border-neutral-200 bg-white p-6 text-center"
+                className="rounded-2xl border-2 border-neutral-200/80 bg-white p-6 text-center shadow-sm transition-all hover:border-amber-200 hover:shadow-lg"
               >
                 <Icon className="mx-auto h-9 w-9 text-neutral-600" />
                 <h3 className="mt-4 font-medium text-neutral-900">

components/sections/value-grid.tsx

@@ -11,17 +11,25 @@ const ICON_MAP = {
   Users,
 } as const;
 
+const ACCENT_COLORS = [
+  "from-blue-500 to-cyan-500",
+  "from-emerald-500 to-teal-500",
+  "from-violet-500 to-fuchsia-500",
+  "from-amber-500 to-orange-500",
+] as const;
+
+
 export function ValueGrid() {
   return (
-    <section className="bg-neutral-50 py-16 md:py-24">
+    <section className="bg-gradient-to-b from-white to-violet-50/30 py-20 md:py-28">
       <div className="container mx-auto px-4 md:px-6">
         <motion.h2
           initial={{ opacity: 0, y: 12 }}
           whileInView={{ opacity: 1, y: 0 }}
           viewport={{ once: true, margin: "-80px" }}
-          className="text-center text-2xl font-semibold text-neutral-900 md:text-3xl"
+          className="text-center text-2xl font-bold text-neutral-900 md:text-3xl"
         >
-          你能在这里获得什么
+          🎯 你能在这里获得什么
         </motion.h2>
         <motion.p
           initial={{ opacity: 0 }}
@@ -29,23 +37,27 @@ export function ValueGrid() {
           viewport={{ once: true }}
           className="mx-auto mt-3 max-w-2xl text-center text-neutral-600"
         >
-          不是功能列表，而是实实在在的结果
+          不是功能列表，而是实实在在的结果 ✨
         </motion.p>
 
-        <div className="mt-12 grid gap-6 sm:grid-cols-2 lg:grid-cols-4">
+        <div className="mt-14 grid gap-6 sm:grid-cols-2 lg:grid-cols-4">
           {VALUE_PROPOSITIONS.map((item, i) => {
             const Icon = ICON_MAP[item.icon];
+            const gradient = ACCENT_COLORS[i];
             return (
               <motion.div
                 key={item.id}
                 initial={{ opacity: 0, y: 20 }}
                 whileInView={{ opacity: 1, y: 0 }}
                 viewport={{ once: true, margin: "-40px" }}
-                transition={{ delay: i * 0.05 }}
-                className="rounded-xl border border-neutral-200 bg-white p-6 shadow-sm transition-all hover:shadow-md"
+                transition={{ delay: i * 0.08 }}
+                whileHover={{ y: -4 }}
+                className="group rounded-2xl border-2 border-neutral-200/80 bg-white p-6 shadow-sm transition-all hover:border-violet-200 hover:shadow-xl hover:shadow-violet-100/50"
               >
-                <Icon className="h-10 w-10 text-neutral-600" />
-                <h3 className="mt-4 font-medium text-neutral-900">
+                <div className={`inline-flex h-12 w-12 items-center justify-center rounded-xl bg-gradient-to-br ${gradient} text-white shadow-lg transition-transform group-hover:scale-110`}>
+                  <Icon className="h-6 w-6" />
+                </div>
+                <h3 className="mt-4 font-semibold text-neutral-900">
                   {item.title}
                 </h3>
                 <p className="mt-2 text-sm text-neutral-600">

components/ui/particles.tsx

@@ -0,0 +1,30 @@
+"use client";
+
+const PARTICLES = Array.from({ length: 50 }, (_, i) => ({
+  size: 4 + (i % 6),
+  left: (i * 17.3) % 100,
+  top: (i * 23.7) % 100,
+  duration: 10 + (i % 8),
+  delay: (i * 0.3) % 5,
+}));
+
+export function Particles() {
+  return (
+    <div className="pointer-events-none absolute inset-0 overflow-hidden">
+      {PARTICLES.map((p, i) => (
+        <div
+          key={i}
+          className="absolute rounded-full bg-gradient-to-br from-violet-400/50 via-fuchsia-400/40 to-cyan-400/50 blur-[1px]"
+          style={{
+            width: `${p.size}px`,
+            height: `${p.size}px`,
+            left: `${p.left}%`,
+            top: `${p.top}%`,
+            animation: `float ${p.duration}s ease-in-out infinite`,
+            animationDelay: `${p.delay}s`,
+          }}
+        />
+      ))}
+    </div>
+  );
+}

lib/data.ts

@@ -5,7 +5,9 @@
 
 export const NAV_LINKS = [
   { href: "/", label: "首页", external: false },
-  { href: "https://meetup.hackrobot.cn", label: "探索城市", external: true },
+  { href: "https://nav.hackrobot.cn", label: "游民导航", external: true },
+  { href: "https://hackrobot.cn", label: "地理套利", external: true },
+  { href: "https://nomadyt.com/", label: "同城沙龙", external: true },
   { href: "https://digital.hackrobot.cn", label: "学习路径", external: true },
   { href: "https://vip.hackrobot.cn", label: "会员社区", external: true },
   { href: "/about", label: "关于", external: false },
@@ -13,10 +15,41 @@ export const NAV_LINKS = [
 
 export const HERO_TAGS = [
   "城市探索",
-  "远程技能",
-  "自动化杠杆",
+  "地理套利",
+  "AI自动化",
   "社群连接",
-  "会员成长",
+  "同城沙龙",
+] as const;
+
+/** 入口页主卡片：游民导航、地理套利、同城沙龙 */
+export const ENTRY_CARDS = [
+  {
+    id: "nav",
+    label: "游民导航",
+    title: "出海赚美金",
+    description: "资源导航、工具推荐、出海指南",
+    href: "https://nav.hackrobot.cn",
+    icon: "MapPin",
+    accent: "blue",
+  },
+  {
+    id: "arbitrage",
+    label: "地理套利",
+    title: "AI自动化杠杆",
+    description: "低成本工作室、自建云手机、自动化系统",
+    href: "https://hackrobot.cn",
+    icon: "Zap",
+    accent: "emerald",
+  },
+  {
+    id: "salon",
+    label: "同城沙龙",
+    title: "线下连接与交流",
+    description: "城市聚会、主题沙龙、同频人面对面",
+    href: "https://nomadyt.com/",
+    icon: "Users",
+    accent: "amber",
+  },
 ] as const;
 
 export const VALUE_PROPOSITIONS = [
@@ -48,30 +81,30 @@ export const VALUE_PROPOSITIONS = [
 
 export const ENTRY_PATHS = [
   {
-    id: "meetup",
-    title: "探索城市与连接同类人",
-    description: "适合想找目的地、找活动、找社群、找线下连接的人",
-    cta: "进入社区与城市探索",
-    href: "https://meetup.hackrobot.cn",
+    id: "nav",
+    title: "游民导航 · 出海赚美金",
+    description: "适合想找资源、工具、出海指南的人",
+    cta: "进入导航",
+    href: "https://nav.hackrobot.cn",
     icon: "MapPin",
     accent: "blue",
   },
   {
-    id: "digital",
-    title: "学习路径、专题内容与实战资源",
-    description: "适合还没跑通技能变现、远程工作、副业体系的人",
-    cta: "进入学习与专题",
-    href: "https://digital.hackrobot.cn",
-    icon: "BookOpen",
+    id: "arbitrage",
+    title: "地理套利 · AI自动化杠杆",
+    description: "适合想搭建低成本工作室、自建云手机、自动化系统的人",
+    cta: "进入工作室",
+    href: "https://hackrobot.cn",
+    icon: "Zap",
     accent: "green",
   },
   {
-    id: "vip",
-    title: "核心会员、私域社群与持续成长",
-    description: "适合已经认可品牌，想获得全模块解锁、社群、问答、长期更新的人",
-    cta: "进入会员中心",
-    href: "https://vip.hackrobot.cn",
-    icon: "Crown",
+    id: "salon",
+    title: "同城沙龙 · 线下连接",
+    description: "适合想参加城市聚会、主题沙龙、面对面交流的人",
+    cta: "探索同城活动",
+    href: "https://nomadyt.com/",
+    icon: "Users",
     accent: "amber",
   },
 ] as const;