fix:首页轮播、图片等增加

src/views/pc/style/index.less

@@ -320,6 +320,51 @@ li {
       display: flex;
     }
   }
+  // swiper滑动
+  .ai-tech-carousel {
+    position: relative;
+    padding-bottom: 50px; // 为进度条留出空间
+
+    :deep(.swiper-slide) {
+      padding: 0 10px;
+      
+      .slide-content {
+        border-radius: 8px;
+        overflow: hidden;
+        transition: all 0.3s ease;
+        cursor: pointer;
+        
+        &.active {
+          transform: scale(1.05);
+          box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
+        }
+        
+        img {
+          width: 100%;
+          height: auto;
+          display: block;
+        }
+        
+        .slide-info {
+        padding: 15px;
+        background: #f8f9fa;
+        
+        h3 {
+          margin: 0 0 10px 0;
+          font-size: 18px;
+          color: #1f2937;
+        }
+        
+        p {
+          margin: 0;
+          font-size: 14px;
+          color: #6b7280;
+          line-height: 1.5;
+        }
+      }
+    }
+  }
+}
 }
 // 第四屏 应用场景
 .screens-four{
@@ -346,7 +391,9 @@ li {
         font-weight:700;
       }
     }
-
+    .desc{
+      padding-bottom:46px;
+    }
     p {
       font-size: 18px;
       color: rgba(153, 153, 153, 1);
@@ -354,6 +401,132 @@ li {
       margin: 0 auto;
     }
   }
+  
+.tech-carousel {
+  position: relative;
+  padding-bottom: 30px; // 为进度条留出空间
+
+  :deep(.swiper-slide) {
+    padding: 0 8px;
+    border-radius: none;
+
+    .slide-content {
+      position: relative;
+      border-radius: 0px;
+      overflow: hidden;
+      transition: transform 0.3s ease, box-shadow 0.3s ease;
+
+      &:hover {
+        transform: translateY(-5px);
+        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
+      }
+
+      img {
+        width: 100%;
+        max-width: 100%;
+        height: auto;
+        display: block;
+        border-radius: none;
+      }
+    }
+  }
+
+  // 自定义进度条样式
+  :deep(.swiper-pagination-custom) {
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 100px;
+    height: 4px;
+
+    .progress-bar {
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.1);
+      border-radius: 2px;
+      overflow: hidden;
+
+      .progress-fill {
+        height: 100%;
+        background: rgba(31, 92, 172, 1);
+        border-radius: 2px;
+        transition: width 0.1s linear;
+      }
+    }
+  }
+}
+
+// 应用场景图片底部-标题遮罩
+.image-overlay {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 80px;
+  background: rgba(0, 10, 48, .5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  p {
+    color: white;
+    font-size: 28px;
+    font-weight: 700;
+    margin: 0;
+  }
+}
+
+.hover-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 10, 48, .5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 16px;
+  z-index: 10;
+
+  .overlay-content {
+    text-align: center;
+    color: white;
+    padding: 0 15px;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    height: 100%;
+    align-items: center;
+
+    h3 {
+      font-size: 28px;
+      font-weight: 700;
+      padding: 55px 0 10px;
+    }
+
+    p {
+      font-size: 16px;
+      font-weight: 400;
+      letter-spacing: 0.96px;
+      line-height: 21px;
+      margin: 0;
+      text-align: left;
+    }
+  }
+}
+
+  // 淡入淡出动画
+  .fade-enter-active,
+  .fade-leave-active {
+    transition: opacity 0.3s ease;
+  }
+
+  .fade-enter-from,
+  .fade-leave-to {
+    opacity: 0;
+  }
 
 }
 // 第五屏 合作伙伴