diff --git a/docs/en-us/index.md b/docs/en-us/index.md
index fa50519..7ac41a3 100644
--- a/docs/en-us/index.md
+++ b/docs/en-us/index.md
@@ -34,31 +34,38 @@ features:
   </p>
 </div>
 
+<script setup>
+import { useData } from 'vitepress'
+
+const { site } = useData()
+const base = site.value.base
+</script>
+
 <div class="stage-container">
-  <div class="stage-card">
+  <a :href="base + 'en-us/stage-0/0.1-learning-map/'" class="stage-card">
     <div class="stage-icon">🌱</div>
     <h3>Stage 0: Getting Started</h3>
     <p>Suitable for product, operations, and non-technical backgrounds. Understand AI programming logic through games and build confidence.</p>
-    <a href="./stage-0/0.1-learning-map/">Learn More →</a>
-  </div>
-  <div class="stage-card">
+    <span>Learn More →</span>
+  </a>
+  <a :href="base + 'en-us/stage-1/1.1-introduction-to-ai-ide/'" class="stage-card">
     <div class="stage-icon">🎨</div>
     <h3>Stage 1: AI Product Manager</h3>
     <p>Master the Vibe Coding workflow. Learn to break down requirements and independently complete high-fidelity web application prototypes.</p>
-    <a href="./stage-1/1.1-introduction-to-ai-ide/">Learn More →</a>
-  </div>
-  <div class="stage-card">
+    <span>Learn More →</span>
+  </a>
+  <a :href="base + 'en-us/stage-2/frontend/2.0-lovart-assets/'" class="stage-card">
     <div class="stage-icon">💻</div>
     <h3>Stage 2: Full-Stack Development</h3>
     <p>Dive deep into full-stack development. Frontend componentization, database design, backend API development, and deployment.</p>
-    <a href="./stage-2/frontend/2.0-lovart-assets/">Learn More →</a>
-  </div>
-  <div class="stage-card">
+    <span>Learn More →</span>
+  </a>
+  <a :href="base + 'en-us/stage-3/core-skills/3.1-mcp-claudecode-skills/'" class="stage-card">
     <div class="stage-icon">🚀</div>
     <h3>Stage 3: Advanced Development</h3>
     <p>Build complex cross-platform applications. WeChat mini-program practical实战, challenge higher-level AI-native application development.</p>
-    <a href="./stage-3/core-skills/3.1-mcp-claudecode-skills/">Learn More →</a>
-  </div>
+    <span>Learn More →</span>
+  </a>
 </div>
 
 <style>
diff --git a/docs/ja-jp/index.md b/docs/ja-jp/index.md
index 2acc149..45f2d50 100644
--- a/docs/ja-jp/index.md
+++ b/docs/ja-jp/index.md
@@ -34,31 +34,38 @@ features:
   </p>
 </div>
 
+<script setup>
+import { useData } from 'vitepress'
+
+const { site } = useData()
+const base = site.value.base
+</script>
+
 <div class="stage-container">
-  <div class="stage-card">
+  <a :href="base + 'ja-jp/stage-0/0.1-learning-map/'" class="stage-card">
     <div class="stage-icon">🌱</div>
     <h3>Stage 0: 入門</h3>
     <p>プロダクト、運用、非技術的背景に適しています。ゲームを通じて AI プログラミングロジックを理解し、自信を構築しましょう。</p>
-    <a href="./stage-0/0.1-learning-map/">詳しく見る →</a>
-  </div>
-  <div class="stage-card">
+    <span>詳しく見る →</span>
+  </a>
+  <a :href="base + 'ja-jp/stage-1/1.1-introduction-to-ai-ide/'" class="stage-card">
     <div class="stage-icon">🎨</div>
     <h3>Stage 1: AI プロダクトマネージャー</h3>
     <p>Vibe Coding ワークフローをマスターしましょう。要件を分解し、高品質な Web アプリケーションプロトタイプを独立して完成させる方法を学びます。</p>
-    <a href="./stage-1/1.1-introduction-to-ai-ide/">詳しく見る →</a>
-  </div>
-  <div class="stage-card">
+    <span>詳しく見る →</span>
+  </a>
+  <a :href="base + 'ja-jp/stage-2/frontend/2.0-lovart-assets/'" class="stage-card">
     <div class="stage-icon">💻</div>
     <h3>Stage 2: フルスタック開発</h3>
     <p>フルスタック開発に深く潜り込みましょう。フロントエンドコンポーネント化、データベース設計、バックエンド API 開発、デプロイメント。</p>
-    <a href="./stage-2/frontend/2.0-lovart-assets/">詳しく見る →</a>
-  </div>
-  <div class="stage-card">
+    <span>詳しく見る →</span>
+  </a>
+  <a :href="base + 'ja-jp/stage-3/core-skills/3.1-mcp-claudecode-skills/'" class="stage-card">
     <div class="stage-icon">🚀</div>
     <h3>Stage 3: 上級開発</h3>
     <p>複雑なクロスプラットフォームアプリケーションを構築しましょう。WeChat ミニプログラム実戦、より高レベルの AI ネイティブアプリケーション開発に挑戦します。</p>
-    <a href="./stage-3/core-skills/3.1-mcp-claudecode-skills/">詳しく見る →</a>
-  </div>
+    <span>詳しく見る →</span>
+  </a>
 </div>
 
 <style>
diff --git a/docs/zh-cn/index.md b/docs/zh-cn/index.md
index 5bdc803..b2be983 100644
--- a/docs/zh-cn/index.md
+++ b/docs/zh-cn/index.md
@@ -42,25 +42,25 @@ const base = site.value.base
 </script>
 
 <div class="stage-container">
-  <a :href="base + 'cn/stage-0/0.1-learning-map/'" class="stage-card">
+  <a :href="base + 'zh-cn/stage-0/0.1-learning-map/'" class="stage-card">
     <div class="stage-icon">🌱</div>
     <h3>Stage 0: 新手入门</h3>
     <p>适合产品、运营及非技术背景。通过做游戏理解 AI 编程逻辑，建立信心。</p>
     <span>查看详情 →</span>
   </a>
-  <a :href="base + 'cn/stage-1/1.1-introduction-to-ai-ide/'" class="stage-card">
+  <a :href="base + 'zh-cn/stage-1/1.1-introduction-to-ai-ide/'" class="stage-card">
     <div class="stage-icon">🎨</div>
     <h3>Stage 1: AI 产品经理</h3>
     <p>掌握 Vibe Coding 工作流。学会拆解需求，独立完成高保真 Web 应用原型。</p>
     <span>查看详情 →</span>
   </a>
-  <a :href="base + 'cn/stage-2/frontend/2.0-lovart-assets/'" class="stage-card">
+  <a :href="base + 'zh-cn/stage-2/frontend/2.0-lovart-assets/'" class="stage-card">
     <div class="stage-icon">💻</div>
     <h3>Stage 2: 初中级开发</h3>
     <p>深入全栈开发。前端组件化、数据库设计、后端 API 开发与部署上线。</p>
     <span>查看详情 →</span>
   </a>
-  <a :href="base + 'cn/stage-3/core-skills/3.1-mcp-claudecode-skills/'" class="stage-card">
+  <a :href="base + 'zh-cn/stage-3/core-skills/3.1-mcp-claudecode-skills/'" class="stage-card">
     <div class="stage-icon">🚀</div>
     <h3>Stage 3: 高级开发</h3>
     <p>构建复杂跨平台应用。微信小程序实战，挑战更高阶的 AI 原生应用开发。</p>