From ec092d648e836bbbbdd42f52e32d90e486ae6cdc Mon Sep 17 00:00:00 2001
From: TermiNexus <wyt18222152539wyt@163.com>
Date: Tue, 29 Sep 2026 15:10:25 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E9=A6=96=E9=A1=B5):=20=E6=89=8B=E6=9C=BA?=
 =?UTF-8?q?=E7=AB=AF=E6=98=BE=E7=A4=BA=E8=A1=A5=E5=81=BF=E6=A0=87=E8=AF=AD?=
 =?UTF-8?q?=E4=B8=8E=E5=BA=95=E9=83=A8=E7=BB=9F=E8=AE=A1=E7=BF=BB=E7=89=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 「结果不佳? 我们补偿！」去掉 hidden md:block

- .hero-stats 原先 767px 以下 display:none !important，改为竖向堆叠显示（两组并排放不下）

- 移动端统计标题字号 24px 降为 18px，翻牌区高度改自适应
---
 src/assets/gvsds-page.css | 10 ++++++++--
 src/views/HomeView.vue    |  8 ++++----
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/assets/gvsds-page.css b/src/assets/gvsds-page.css
index d108123..a4bf646 100644
--- a/src/assets/gvsds-page.css
+++ b/src/assets/gvsds-page.css
@@ -570,10 +570,16 @@ html[data-theme-mode=dark] .M-FlipCard .digital:before {
     }
 }
 
-/* ── Mobile: 底部统计翻牌区 移动端隐藏（原逻辑保留） ── */
+/* ── Mobile: 底部统计翻牌区 改竖向排列 ──
+   原先这里整块 display:none，手机上看不到两组数字。
+   两组并排放不下（每组 8 张 48px 卡片，卡片盒宽 405px，两组合计 810px 远超手机可用宽度），
+   故 767px 以下堆叠成上下两行；transform: scale 不改变布局宽度，靠 origin-left 收在左侧即可 */
 @media (max-width: 767px) {
     .hero-stats {
-        display: none !important;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 24px;
+        height: auto;
     }
 }
 
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 189f9a9..1d78281 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -16,7 +16,7 @@
                 <span>你好 2026！</span>
               </div>
               <div class="block text-[22px] sm:text-[26px] md:text-[34px] text-[#FFF] mt-3">银河锋锐 —— 全站式部署项目</div>
-              <div class="hidden md:block text-[17px] md:text-[20px] text-[#FFF] mt-5 font-medium">结果不佳? 我们补偿！</div>
+              <div class="block text-[17px] md:text-[20px] text-[#FFF] mt-5 font-medium">结果不佳? 我们补偿！</div>
               <div class="inline-flex items-center gap-3 mt-4 pl-1.5 pr-4 py-1.5 rounded-xl bg-black border border-white/15">
                 <span class="grid place-items-center w-9 h-9 rounded-lg bg-sky-400/20 text-sky-200 flex-shrink-0">
                   <svg class="w-[18px] h-[18px]" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" /></svg>
@@ -50,15 +50,15 @@
           </div>
         </div>
         <!-- 底部统计翻牌（鼠标悬停某一组：老虎机式乱翻，最后逐个落回正常值） -->
-        <div class="hero-stats 2xl:h-[198px] h-[100px] sm:h-[120px] pr-[16px] sm:pr-[30px] 2xl:pr-[174px] xl:pr-[100px] flex justify-between 2xl:justify-start md:justify-start md:gap-[80px] lg:gap-[160px] 2xl:gap-[267px] items-start hidden md:flex">
+        <div class="hero-stats 2xl:h-[198px] md:h-[120px] pr-[16px] sm:pr-[30px] 2xl:pr-[174px] xl:pr-[100px] flex flex-col md:flex-row justify-between md:justify-start gap-6 md:gap-[80px] lg:gap-[160px] 2xl:gap-[267px] items-start">
           <div>
-            <div class="font-['DIN_Condensed'] font-bold leading-none tracking-normal uppercase mb-[8px] md:mb-[4px] 2xl:mb-[12px] text-[24px] sm:text-[23px] md:text-[24px] text-[#FFF] opacity-80 [text-shadow:0_2px_8px_rgba(0,0,0,0.6)]">Total Code Size (characters)</div>
+            <div class="font-['DIN_Condensed'] font-bold leading-none tracking-normal uppercase mb-[8px] md:mb-[4px] 2xl:mb-[12px] text-[18px] sm:text-[23px] md:text-[24px] text-[#FFF] opacity-80 [text-shadow:0_2px_8px_rgba(0,0,0,0.6)]">Total Code Size (characters)</div>
             <div class="flex gap-[3px] sm:gap-1 scale-[0.65] sm:scale-[0.8] 2xl:scale-[1] origin-left" data-flip-group="code" @mouseenter="spinGroup('code')">
               <div v-for="(d, i) in codeDigits" :key="'c' + d.idx" class="M-FlipCard down flip-win bg-bg-primary"><div class="digital front" :class="'number' + codeFront[i]"></div><div class="digital back" :class="'number' + codeBack[i]"></div></div>
             </div>
           </div>
           <div>
-            <div class="font-['DIN_Condensed'] font-bold leading-none tracking-normal uppercase mb-[8px] md:mb-[4px] 2xl:mb-[12px] text-[24px] sm:text-[23px] md:text-[24px] text-[#FFF] opacity-80 [text-shadow:0_2px_8px_rgba(0,0,0,0.6)]">Maximum Insurance Amount (CNY)</div>
+            <div class="font-['DIN_Condensed'] font-bold leading-none tracking-normal uppercase mb-[8px] md:mb-[4px] 2xl:mb-[12px] text-[18px] sm:text-[23px] md:text-[24px] text-[#FFF] opacity-80 [text-shadow:0_2px_8px_rgba(0,0,0,0.6)]">Maximum Insurance Amount (CNY)</div>
             <div class="flex gap-[3px] sm:gap-1 scale-[0.65] sm:scale-[0.8] 2xl:scale-[1] origin-left" data-flip-group="insurance" @mouseenter="spinGroup('insurance')">
               <div v-for="(d, i) in insuranceDigits" :key="'i' + d.idx" class="M-FlipCard down flip-win bg-bg-primary"><div class="digital front" :class="'number' + insuranceFront[i]"></div><div class="digital back" :class="'number' + insuranceBack[i]"></div></div>
             </div>