Redesign landing page and add Caddy deployment for nomadro.com

Co-authored-by: Cursor <cursoragent@cursor.com>

app/about/page.tsx

@@ -1,25 +1,27 @@
 import Link from "next/link";
-import { SiteHeader } from "~/components/layout/site-header";
-import { SiteFooter } from "~/components/layout/site-footer";
 
 export default function AboutPage() {
   return (
-    <div className="min-h-screen bg-white">
-      <SiteHeader />
-      <main className="container mx-auto px-4 py-16 md:px-6 md:py-24">
-        <h1 className="text-3xl font-semibold text-neutral-900">关于 Nomadro</h1>
-        <p className="mt-6 max-w-2xl text-neutral-600">
-          Nomadro 是中文数字游民操作系统，致力于帮助更多人从固定工位走向自由生活与自由收入。
-          我们提供城市探索、学习路径、会员社区三大核心模块，从地点、技能、工具到社群，构建完整的数字游民支持体系。
+    <div
+      className="flex min-h-dvh flex-col bg-[#f8f7fc] px-5 py-10"
+      style={{
+        paddingTop: "max(2.5rem, calc(1.5rem + var(--safe-top)))",
+        paddingBottom: "max(2.5rem, calc(1.5rem + var(--safe-bottom)))",
+      }}
+    >
+      <div className="mx-auto w-full max-w-md">
+        <h1 className="text-xl font-bold text-neutral-900">关于 Nomadro</h1>
+        <p className="mt-4 text-sm leading-relaxed text-neutral-600">
+          Nomadro 是中文数字游民操作系统，提供游民导航、地理套利、直播工具箱等模块，
+          帮助更多人从固定工位走向自由生活与自由收入。
         </p>
         <Link
           href="/"
-          className="mt-8 inline-block text-sm font-medium text-neutral-700 hover:text-neutral-900"
+          className="mt-8 inline-block text-sm text-violet-600 active:text-violet-800"
         >
           ← 返回首页
         </Link>
-      </main>
-      <SiteFooter />
+      </div>
     </div>
   );
 }

app/contact/page.tsx

@@ -1,32 +1,44 @@
 import Link from "next/link";
-import { SiteHeader } from "~/components/layout/site-header";
-import { SiteFooter } from "~/components/layout/site-footer";
 
 export default function ContactPage() {
   return (
-    <div className="min-h-screen bg-white">
-      <SiteHeader />
-      <main className="container mx-auto px-4 py-16 md:px-6 md:py-24">
-        <h1 className="text-3xl font-semibold text-neutral-900">联系我们</h1>
-        <p className="mt-6 max-w-2xl text-neutral-600">
+    <div
+      className="flex min-h-dvh flex-col bg-[#f8f7fc] px-5 py-10"
+      style={{
+        paddingTop: "max(2.5rem, calc(1.5rem + var(--safe-top)))",
+        paddingBottom: "max(2.5rem, calc(1.5rem + var(--safe-bottom)))",
+      }}
+    >
+      <div className="mx-auto w-full max-w-md">
+        <h1 className="text-xl font-bold text-neutral-900">联系我们</h1>
+        <p className="mt-4 text-sm leading-relaxed text-neutral-600">
           加入数字游民社群，获取最新动态与交流机会。
         </p>
-        <Link
-          href="https://meetup.hackrobot.cn"
-          target="_blank"
-          rel="noopener noreferrer"
-          className="mt-6 inline-block rounded-lg bg-neutral-900 px-6 py-3 text-white hover:bg-neutral-800"
-        >
-          加入社群
-        </Link>
+        <div className="mt-6 flex flex-col gap-3">
+          <Link
+            href="https://nomadro.live"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex h-12 items-center justify-center rounded-2xl bg-violet-600 text-sm font-medium text-white active:bg-violet-700"
+          >
+            🎬 直播工具箱
+          </Link>
+          <Link
+            href="https://vip.hackrobot.cn"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex h-12 items-center justify-center rounded-2xl border border-neutral-200 bg-white text-sm font-medium text-neutral-700 active:bg-neutral-50"
+          >
+            👑 会员社群
+          </Link>
+        </div>
         <Link
           href="/"
-          className="ml-4 mt-8 inline-block text-sm font-medium text-neutral-700 hover:text-neutral-900"
+          className="mt-8 inline-block text-sm text-violet-600 active:text-violet-800"
         >
           ← 返回首页
         </Link>
-      </main>
-      <SiteFooter />
+      </div>
     </div>
   );
 }

app/globals.css

@@ -1,8 +1,10 @@
 @import "tailwindcss";
 
 :root {
-  --background: #ffffff;
+  --background: #f8f7fc;
   --foreground: #171717;
+  --safe-top: env(safe-area-inset-top, 0px);
+  --safe-bottom: env(safe-area-inset-bottom, 0px);
 }
 
 @theme inline {
@@ -13,72 +15,22 @@
   --font-mono: var(--font-geist-mono), ui-monospace, monospace;
 }
 
+html {
+  height: 100%;
+}
+
 body {
+  min-height: 100%;
   background: var(--background);
   color: var(--foreground);
   font-family: var(--font-sans);
+  -webkit-tap-highlight-color: transparent;
+  -webkit-font-smoothing: antialiased;
 }
 
-@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;
+.text-gradient {
+  background: linear-gradient(135deg, #7c3aed 0%, #0891b2 100%);
+  -webkit-background-clip: text;
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
 }

app/layout.tsx

@@ -1,28 +1,39 @@
 import "./globals.css";
 
-import { type Metadata } from "next";
+import { type Metadata, type Viewport } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 
+export const viewport: Viewport = {
+  width: "device-width",
+  initialScale: 1,
+  maximumScale: 5,
+  viewportFit: "cover",
+  themeColor: "#f8f7fc",
+};
+
 export const metadata: Metadata = {
+  metadataBase: new URL("https://nomadro.com"),
   title: "Nomadro | 中文数字游民操作系统",
   description:
-    "从城市、技能、工具到社群，一站开始你的数字游民生活。探索城市、学习路径、会员社区，帮你从固定工位走向自由生活与自由收入。",
+    "从城市探索到远程收入，从 AI 自动化到直播变现。游民导航、地理套利、直播工具箱，一站开启你的自由生活。",
   keywords: [
     "数字游民",
     "远程工作",
     "旅居",
     "自由职业",
-    "城市探索",
+    "直播工具箱",
+    "地理套利",
     "学习路径",
     "会员社区",
   ],
   openGraph: {
     title: "Nomadro | 中文数字游民操作系统",
     description:
-      "从城市、技能、工具到社群，一站开始你的数字游民生活。",
+      "从城市探索到远程收入，从 AI 自动化到直播变现，一站开启你的自由生活。",
     type: "website",
+    url: "https://nomadro.live",
   },
-  icons: [{ rel: "icon", url: "/nomadro.ico" }],
+  icons: [{ rel: "icon", url: "/favicon.ico" }],
 };
 
 const geist = Geist({

app/page.tsx

@@ -2,10 +2,19 @@ import { Hero } from "~/components/sections/hero";
 
 export default function HomePage() {
   return (
-    <div className="min-h-screen bg-white">
-      <main>
+    <div
+      className="flex min-h-dvh flex-col"
+      style={{ minHeight: "100dvh" }}
+    >
+      <main className="flex flex-1 flex-col">
         <Hero />
       </main>
+      <footer
+        className="shrink-0 py-5 text-center text-[11px] text-neutral-400"
+        style={{ paddingBottom: "max(1.25rem, var(--safe-bottom))" }}
+      >
+        © {new Date().getFullYear()} Nomadro
+      </footer>
     </div>
   );
 }