hotfix: mobile reading issue

Author: Charliechen114514

site/.vitepress/theme/components/HomeHeroVisual.vue

@@ -249,7 +249,9 @@ onBeforeUnmount(() => {
 
 @media (max-width: 639px) {
   .hero-visual {
-    max-width: 100%;
+    /* 手机端父容器(.image-container)是 width:auto 按内容撑开,max-width:100% 会相对它而非视口,
+       故直接按视口约束:100vw - 48px(= 手机端 hero 左右各 24px 内边距后的内容宽度)。 */
+    max-width: calc(100vw - 48px);
   }
   .terminal__body {
     font-size: 13px;

site/.vitepress/theme/custom.css

@@ -475,8 +475,14 @@
   display: none !important;
 }
 
+/* 移动端把标题(.container)置于终端(.image)上方:order 1 < 2(桌面本就是 container 在左,不受影响) */
+.VPHero .container {
+  order: 1 !important;
+}
+
 .VPHero .image {
-  margin: 24px auto 0 !important;
+  order: 2 !important;
+  margin: 40px auto 0 !important;
 }
 
 .VPHero .image-container {
@@ -486,7 +492,7 @@
 
 @media (min-width: 640px) {
   .VPHero .image {
-    margin: 32px auto 0 !important;
+    margin: 40px auto 0 !important;
   }
 }
 
@@ -508,6 +514,17 @@
   }
 }
 
+/* ── Proof 条:移动端(<960,hero 堆叠)夹在标题与终端之间;桌面端(≥960)仍在 hero 下方 ──
+   两个实例按视口切换显隐。移动端那条放在 home-hero-actions-after(标题块末尾、终端之前),
+   底边距归零——终端的 margin-top 提供 proof→终端 的间隙。 */
+.proof-on-mobile { display: none; }
+.proof-on-desktop { display: block; }
+.proof-on-mobile .proof-strip { margin-bottom: 0 !important; }
+@media (max-width: 959px) {
+  .proof-on-mobile { display: block; }
+  .proof-on-desktop { display: none; }
+}
+
 /* ── Feature Card Entrance Animation ────────────────────────── */
 
 @keyframes feature-fade-up {

site/.vitepress/theme/index.ts

@@ -20,7 +20,8 @@ export default {
   Layout() {
     return h(DefaultTheme.Layout, null, {
       'home-hero-image': () => h(HomeHeroVisual),
-      'home-hero-after': () => h(ProofStrip),
+      'home-hero-actions-after': () => h('div', { class: 'proof-on-mobile' }, [h(ProofStrip)]),
+      'home-hero-after': () => h('div', { class: 'proof-on-desktop' }, [h(ProofStrip)]),
       'home-features-before': () => h(HomeTipBanner),
       'home-features-after': () => h(HomeRoadmap),
     })