From de36e75f869ffd48797b33796f146f27e935dbd3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B2=A1=E5=A4=8D=E4=B9=A0?= <2353956224@qq.com>
Date: Fri, 27 Feb 2026 18:09:06 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/PageAdvantage.vue | 29 ++++++++++++
 src/components/PageContact.vue   | 79 ++++++++++++++++++++++++++++++++
 src/components/PageProduct.vue   | 33 ++++++++++++-
 3 files changed, 140 insertions(+), 1 deletion(-)

diff --git a/src/components/PageAdvantage.vue b/src/components/PageAdvantage.vue
index 2c23d11..e5b8d0c 100644
--- a/src/components/PageAdvantage.vue
+++ b/src/components/PageAdvantage.vue
@@ -141,6 +141,35 @@
   50% { transform: translateY(-12px); }
 }
 
+@media (min-width: 1921px) {
+  .section-title {
+    margin-left: 0;
+    max-width: 22ch;
+  }
+
+  .section-card{
+  position: relative;
+  width: clamp(400px, 32vw, 1600px);;
+  height: clamp(200px, 16vw, 800px);
+  background: #FFFFFF;
+  box-shadow: 0px 39px 113px 0px rgba(2,190,172,0.2);
+  border-radius: 2px 100px 2px 2px;
+  padding: 10% ;
+  margin-left: -20%;
+
+  font-size: @font-desc;
+  line-height: 1.8;
+  color: #888;
+
+  .douhao-img{
+    position: absolute;
+    height: 20%;
+    left: 40%;
+    top: 15%;
+  }
+}
+}
+
 @media (max-width: 768px) {
   .content-wrapper {
     flex-direction: column-reverse;
diff --git a/src/components/PageContact.vue b/src/components/PageContact.vue
index 8e2a7e6..f4dc3cd 100644
--- a/src/components/PageContact.vue
+++ b/src/components/PageContact.vue
@@ -9,6 +9,10 @@
         <p class="section-desc anim-item">
           Personalize your chat keyboard and get tailored, high-EQ responses for every conversation
         </p>
+        <div class="download-btns anim-item">
+          <a href="#"><img src="/src/assets/images/android.png" class="store-btn-img" /></a>
+          <a href="#"><img src="/src/assets/images/appStore.png" class="store-btn-img" /></a>
+        </div>
       </div>
       <div class="image-side">
         <img src="/src/assets/images/four-phone.png" class="phone-img anim-item" />
@@ -66,6 +70,24 @@
   line-height: 1.8;
   color: #888;
   max-width: 90%;
+  margin-bottom: clamp(14px, 2.2vh, 32px);
+}
+
+.download-btns {
+  display: flex;
+  gap: clamp(10px, 2vw, 30px);
+  align-items: center;
+}
+
+.store-btn-img {
+  height: clamp(36px, 6.2vh, 110px);
+  width: auto;
+  display: block;
+  transition: transform 0.3s;
+
+  &:hover {
+    transform: translateY(-2px);
+  }
 }
 
 .image-side {
@@ -142,6 +164,52 @@
   }
 }
 
+@media (min-width: 1921px) {
+  .content-wrapper {
+    max-width: 1600px;
+    width: min(86vw, 1600px);
+    gap: clamp(12px, 1.2vw, 28px);
+    justify-content: center;
+    padding: 0 clamp(36px, 3vw, 72px);
+  }
+
+  .text-side {
+    flex: 0 1 min(42vw, 760px);
+    max-width: min(42vw, 760px);
+  }
+
+  .section-title {
+    font-size: clamp(52px, 2.9vw, 82px);
+    line-height: 1.24;
+    max-width: 16ch;
+    margin-bottom: clamp(18px, 2vh, 34px);
+  }
+
+  .section-desc {
+    max-width: 34ch;
+    line-height: 1.9;
+    font-size: clamp(18px, 1.05vw, 24px);
+  }
+
+  .download-btns {
+    gap: clamp(12px, 1.4vw, 24px);
+  }
+
+  .store-btn-img {
+    height: clamp(44px, 5.8vh, 92px);
+  }
+
+  .image-side {
+    flex: 0 1 min(30vw, 520px);
+    width: min(30vw, 520px);
+    justify-content: center;
+  }
+
+  .phone-img {
+    height: min(78vh, 860px);
+  }
+}
+
 @media (max-width: 768px) {
   .content-wrapper {
     flex-direction: column;
@@ -150,6 +218,17 @@
   }
   .section-title { text-align: center; }
   .section-desc { text-align: center; }
+  .text-side {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+  .download-btns {
+    justify-content: center;
+  }
+  .store-btn-img {
+    height: clamp(34px, 6vh, 56px);
+  }
   .phone-img {
     height: clamp(220px, 38vh, 420px);
     width: auto;
diff --git a/src/components/PageProduct.vue b/src/components/PageProduct.vue
index cc23b37..cf0bb41 100644
--- a/src/components/PageProduct.vue
+++ b/src/components/PageProduct.vue
@@ -166,11 +166,42 @@ bottom: -200%;
   position: absolute;
   right: 8vh;
   bottom: -9vh;
-  height: clamp(200px, 100vh, 2000px);
+  height: clamp(200px, 100vh, 4000px);
   width: auto;
   pointer-events: none;
 }
 
+@media (min-width: 1921px) {
+  .page-product {
+    padding: 8vh 5vw 10vh 5vw;
+  }
+
+  .content-wrapper {
+    max-width: none;
+    padding: 0 42vw 0 6vw;
+  }
+
+  .text-side {
+    max-width: min(46vw, 920px);
+  }
+
+  .section-title {
+    font-size: clamp(52px, 3vw, 88px);
+    line-height: 1.18;
+  }
+
+  .section-desc {
+    max-width: 34ch;
+    line-height: 1.9;
+  }
+
+  .two-phone {
+    right: 4vw;
+    bottom: -6vh;
+    height: min(92vh, 1100px);
+  }
+}
+
 @media (max-width: 768px) {
   .content-wrapper {
     flex-direction: column;