但是D

css/index.css

@@ -4952,15 +4952,17 @@ html {
 }
 
 /* Mobile Overrides for Index Page */
+/* 注意：移动端 banner 样式已在第 698 行定义，这里不要重复设置 */
+
+/*
+以下样式已被注释，因为与第 698 行的移动端样式冲突
+导致 swiper-slide 高度变成 400px 而不是 200px
 
 @media (max-width: 768px) {
-
-  /* Banner Adjustment */
   .banner-cont .swiper-slide {
     height: auto !important;
     min-height: 400px;
     padding-bottom: 60px;
-    /* Space for pagination */
   }
 
   .banner-cont .swiper-slide .section-content {
@@ -4994,80 +4996,81 @@ html {
   }
 
   /* Feature Cards (Banner-S) */
-  .banner .banner-s {
-    margin-top: 0;
-    padding-top: 0;
-    padding-bottom: 40px;
-  }
+.banner .banner-s {
+  margin-top: 0;
+  padding-top: 0;
+  padding-bottom: 40px;
+}
 
-  .banner .banner-s .banner-list {
-    display: grid;
-    grid-template-columns: 1fr;
-    gap: 15px;
-    padding: 0 15px;
-  }
+.banner .banner-s .banner-list {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 15px;
+  padding: 0 15px;
+}
 
-  .banner-s .banner-list .banner-item {
-    max-width: 100%;
-    min-width: 0;
-    flex: auto;
-  }
+.banner-s .banner-list .banner-item {
+  max-width: 100%;
+  min-width: 0;
+  flex: auto;
+}
 
-  /* Hot Products - Card View */
-  .products-table thead {
-    display: none;
-  }
+/* Hot Products - Card View */
+.products-table thead {
+  display: none;
+}
 
-  .products-table,
-  .products-table tbody,
-  .products-table tr,
-  .products-table td {
-    display: block;
-    width: 100%;
-  }
+.products-table,
+.products-table tbody,
+.products-table tr,
+.products-table td {
+  display: block;
+  width: 100%;
+}
 
-  .products-table tr {
-    margin-bottom: 15px;
-    background: rgba(30, 41, 59, 0.4);
-    border: 1px solid rgba(148, 163, 184, 0.1);
-    border-radius: 12px;
-    padding: 15px;
-  }
+.products-table tr {
+  margin-bottom: 15px;
+  background: rgba(30, 41, 59, 0.4);
+  border: 1px solid rgba(148, 163, 184, 0.1);
+  border-radius: 12px;
+  padding: 15px;
+}
 
-  .products-table td {
-    text-align: right;
-    padding: 8px 0;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    border-bottom: 1px solid rgba(148, 163, 184, 0.05);
-  }
+.products-table td {
+  text-align: right;
+  padding: 8px 0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid rgba(148, 163, 184, 0.05);
+}
 
-  .products-table td:last-child {
-    border-bottom: none;
-  }
+.products-table td:last-child {
+  border-bottom: none;
+}
 
-  .products-table td::before {
-    content: attr(data-label);
-    float: left;
-    font-weight: 600;
-    color: rgba(148, 163, 184, 0.8);
-  }
+.products-table td::before {
+  content: attr(data-label);
+  float: left;
+  font-weight: 600;
+  color: rgba(148, 163, 184, 0.8);
+}
 
-  /* Solution Wrapper - Stacked */
-  .solution-wrapper {
-    display: flex;
-    flex-direction: column;
-  }
+/* Solution Wrapper - Stacked */
+.solution-wrapper {
+  display: flex;
+  flex-direction: column;
+}
 
-  .solution-tabs {
-    display: none;
-    /* Hide desktop tabs */
-  }
+.solution-tabs {
+  display: none;
+  /* Hide desktop tabs */
+}
+}
 
-  /* We might need to restructure the HTML to show all solutions stacked or use a mobile slider
+*/
+/* We might need to restructure the HTML to show all solutions stacked or use a mobile slider
      For now, let's assume we stack them or show a simple list. 
      Actually, if HTML structure depends on clicks to show/hide, we need JS or CSS modification.
      Let's style the active one well first, or maybe show all?
-  */
-}
+  */