大法东方大厦发阿萨

css/index.css

@@ -2,6 +2,12 @@
    首页专属样式 - 整体深色科技风格
    ============================================ */
 
+/* CSS 变量：统一的容器边距 */
+#index {
+  --container-max-width: 1440px;
+  --container-padding-x: 20px;
+}
+
 /* 首页整体背景 - 统一深色，避免白色闪烁 */
 #index {
   background: linear-gradient(180deg, #020617 0%, #0F172A 50%, #020617 100%);
@@ -20,16 +26,11 @@
   box-shadow: 0 4px 24px rgba(15, 23, 42, 0.4);
 }
 
-/* 首页导航栏：与轮播图文案、banner-list 保持左对齐 */
+/* 首页导航栏：使用统一的容器系统 */
 #index .nav-header {
-  max-width: 1440px;
+  max-width: var(--container-max-width);
   margin: 0 auto;
-  padding: 0 20px;
+  padding: 0 var(--container-padding-x);
-}
-
-/* nav-menu 的第一个菜单项额外增加 20px 左边距，与 banner-list 对齐 */
-#index .nav-menu {
-  margin-left: 20px;
 }
 
 /* 首页导航文字颜色 */
@@ -195,15 +196,15 @@
 }
 */
 
-/* 轮播文字层：使用与 banner-list 相同的左边距计算 */
+/* 轮播文字层：使用统一的容器系统 */
 .banner-cont .swiper-slide .section-content {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 100%;
-  max-width: 1440px;
+  max-width: var(--container-max-width);
-  padding: 0 40px;  /* 40px = section-content的20px + banner-list的20px */
+  padding: 0 var(--container-padding-x);
   box-sizing: border-box;
   z-index: 10;
   text-align: left;
@@ -342,7 +343,7 @@
 .banner .banner-s .banner-list {
   display: flex;
   flex-wrap: wrap;
-  padding: 0 20px;
+  padding: 0;  /* 移除额外的 padding，使用 section-content 的统一边距 */
 }
 
 .banner-s .banner-list .banner-item {