diff --git a/f/web-kboss/src/assets/css/iconfont/demo_index.html b/f/web-kboss/src/assets/css/iconfont/demo_index.html
index 2357ca4..6c4feff 100644
--- a/f/web-kboss/src/assets/css/iconfont/demo_index.html
+++ b/f/web-kboss/src/assets/css/iconfont/demo_index.html
@@ -54,6 +54,24 @@
       <div class="content unicode" style="display: block;">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe624;</span>
+                <div class="name">右箭头</div>
+                <div class="code-name">&amp;#xe624;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe63c;</span>
+                <div class="name">上</div>
+                <div class="code-name">&amp;#xe63c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe63d;</span>
+                <div class="name">下</div>
+                <div class="code-name">&amp;#xe63d;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xe600;</span>
                 <div class="name">购物车空</div>
@@ -156,9 +174,9 @@
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1781579680075') format('woff2'),
-       url('iconfont.woff?t=1781579680075') format('woff'),
-       url('iconfont.ttf?t=1781579680075') format('truetype');
+  src: url('iconfont.woff2?t=1782877614448') format('woff2'),
+       url('iconfont.woff?t=1782877614448') format('woff'),
+       url('iconfont.ttf?t=1782877614448') format('truetype');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -184,6 +202,33 @@
       <div class="content font-class">
         <ul class="icon_lists dib-box">
           
+          <li class="dib">
+            <span class="icon iconfont icon-youjiantou"></span>
+            <div class="name">
+              右箭头
+            </div>
+            <div class="code-name">.icon-youjiantou
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-shang"></span>
+            <div class="name">
+              上
+            </div>
+            <div class="code-name">.icon-shang
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-xia"></span>
+            <div class="name">
+              下
+            </div>
+            <div class="code-name">.icon-xia
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon iconfont icon-gouwuchekong"></span>
             <div class="name">
@@ -337,6 +382,30 @@
       <div class="content symbol">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-youjiantou"></use>
+                </svg>
+                <div class="name">右箭头</div>
+                <div class="code-name">#icon-youjiantou</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-shang"></use>
+                </svg>
+                <div class="name">上</div>
+                <div class="code-name">#icon-shang</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-xia"></use>
+                </svg>
+                <div class="name">下</div>
+                <div class="code-name">#icon-xia</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-gouwuchekong"></use>
diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.css b/f/web-kboss/src/assets/css/iconfont/iconfont.css
index 2ca8bb6..2442933 100644
--- a/f/web-kboss/src/assets/css/iconfont/iconfont.css
+++ b/f/web-kboss/src/assets/css/iconfont/iconfont.css
@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 5043107 */
-  src: url('iconfont.woff2?t=1781579680075') format('woff2'),
-       url('iconfont.woff?t=1781579680075') format('woff'),
-       url('iconfont.ttf?t=1781579680075') format('truetype');
+  src: url('iconfont.woff2?t=1782877614448') format('woff2'),
+       url('iconfont.woff?t=1782877614448') format('woff'),
+       url('iconfont.ttf?t=1782877614448') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,18 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-youjiantou:before {
+  content: "\e624";
+}
+
+.icon-shang:before {
+  content: "\e63c";
+}
+
+.icon-xia:before {
+  content: "\e63d";
+}
+
 .icon-gouwuchekong:before {
   content: "\e600";
 }
diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.js b/f/web-kboss/src/assets/css/iconfont/iconfont.js
index 68ef109..872a4ca 100644
--- a/f/web-kboss/src/assets/css/iconfont/iconfont.js
+++ b/f/web-kboss/src/assets/css/iconfont/iconfont.js
@@ -1 +1 @@
-window._iconfont_svg_string_5043107='<svg><symbol id="icon-gouwuchekong" viewBox="0 0 1028 1024"><path d="M332.8 790.528q19.456 0 36.864 7.168t30.208 19.968 20.48 30.208 7.68 36.864-7.68 36.864-20.48 30.208-30.208 20.48-36.864 7.68q-20.48 0-37.888-7.68t-30.208-20.48-20.48-30.208-7.68-36.864 7.68-36.864 20.48-30.208 30.208-19.968 37.888-7.168zM758.784 792.576q19.456 0 37.376 7.168t30.72 19.968 20.48 30.208 7.68 36.864-7.68 36.864-20.48 30.208-30.72 20.48-37.376 7.68-36.864-7.68-30.208-20.48-20.48-30.208-7.68-36.864 7.68-36.864 20.48-30.208 30.208-19.968 36.864-7.168zM930.816 210.944q28.672 0 44.544 7.68t22.528 18.944 6.144 24.064-3.584 22.016-13.312 37.888-22.016 62.976-23.552 68.096-18.944 53.248q-13.312 40.96-33.28 56.832t-49.664 15.872l-35.84 0-65.536 0-86.016 0-96.256 0-253.952 0 14.336 92.16 517.12 0q49.152 0 49.152 41.984 0 20.48-9.728 35.84t-38.4 14.336l-49.152 0-94.208 0-118.784 0-119.808 0-99.328 0-55.296 0q-20.48 0-34.304-9.216t-23.04-24.064-14.848-32.256-8.704-32.768q-1.024-6.144-5.632-29.696t-11.264-58.88-14.848-78.848-16.384-87.552q-19.456-103.424-44.032-230.4l-76.8 0q-15.36 0-25.6-7.68t-16.896-18.432-9.216-23.04-2.56-22.528q0-20.48 13.824-33.792t37.376-12.288l103.424 0q20.48 0 32.768 6.144t19.456 15.36 10.24 18.944 5.12 16.896q2.048 8.192 4.096 23.04t4.096 30.208q3.072 18.432 6.144 38.912l700.416 0zM892.928 302.08l-641.024-2.048 35.84 185.344 535.552 1.024z"  ></path></symbol><symbol id="icon-icon_guanji-kaiji" viewBox="0 0 1024 1024"><path d="M554.67 128h-85.33v426.67h85.33V128z m206.29 92.37l-60.37 60.37C767.57 335.57 810.67 418.56 810.67 512c0 164.91-133.76 298.67-298.67 298.67S213.33 676.91 213.33 512c0-93.44 43.09-176.43 110.08-231.25l-60.37-60.37C180.69 290.77 128 395.09 128 512c0 212.05 171.95 384 384 384s384-171.95 384-384c0-116.91-52.69-221.23-135.04-291.63z"  ></path></symbol><symbol id="icon-icon_arrow_left" viewBox="0 0 1024 1024"><path d="M669.472 162.88l49.504 49.696-294.56 300.48 297.024 297.952-49.088 50.08-346.56-347.616z"  ></path></symbol><symbol id="icon-fasong" viewBox="0 0 1024 1024"><path d="M931.392 11.264L45.12 530.688c-28.736 16.896-43.52 39.424-45.12 61.248v8.128c2.048 26.112 23.04 49.984 61.632 60.416l171.968 46.592a34.304 34.304 0 0 0 41.28-25.536 35.584 35.584 0 0 0-23.808-43.136L79.68 592l873.408-511.872-95.232 703.488c-1.408 10.432-9.152 15.68-18.752 12.992l-365.632-100.288 296.32-305.856a36.416 36.416 0 0 0 0-50.24 33.728 33.728 0 0 0-48.704 0l-324.8 335.36a110.72 110.72 0 0 0-7.872 9.088 35.52 35.52 0 0 0-16.128 30.784 104 104 0 0 0-5.248 32.64v206.4c0 49.664 53.568 79.168 93.568 51.712l166.272-114.368c10.24-6.976 16-19.136 15.232-31.872a35.712 35.712 0 0 0-19.2-29.504 33.28 33.28 0 0 0-34.24 2.304L435.84 937.856v-178.432l385.472 105.6c49.6 13.632 97.472-19.072 104.576-71.808l97.152-717.568c8.448-60.48-40-94.72-91.648-64.384z" fill="#666666" ></path></symbol><symbol id="icon-fuzhi" viewBox="0 0 1024 1024"><path d="M731.68184 676.057473 731.68184 183.323259c0-30.233582-24.512277-54.745858-54.747905-54.745858L184.216093 128.577401c-30.233582 0-54.746882 24.512277-54.746882 54.745858l0 492.734214c0 30.207999 24.5133 54.746882 54.746882 54.746882l492.717841 0C707.16854 730.804355 731.68184 706.265472 731.68184 676.057473zM622.1891 676.057473 238.962975 676.057473c-30.233582 0-54.746882-24.538883-54.746882-54.745858L184.216093 238.07014c0-30.233582 24.5133-54.746882 54.746882-54.746882l383.226125 0c30.233582 0 54.744835 24.512277 54.744835 54.746882l0 383.242498C676.933935 651.51859 652.421658 676.057473 622.1891 676.057473zM841.17458 292.817022l-54.745858 0 0 54.746882c30.232558 0 54.745858 24.5133 54.745858 54.759161l0 383.228171c0 30.206976-24.5133 54.745858-54.745858 54.745858L403.201573 840.297095c-30.233582 0-54.746882-24.538883-54.746882-54.745858l-54.746882 0 0 54.745858c0 30.207999 24.5133 54.747905 54.746882 54.747905l492.719888 0c30.234605 0 54.747905-24.539906 54.747905-54.747905L895.922485 347.563904C895.922485 317.329299 871.408161 292.817022 841.17458 292.817022z" fill="#666666" ></path></symbol><symbol id="icon-dalei-quanbuchanpin" viewBox="0 0 1024 1024"><path d="M961.815077 230.423807L533.942199 4.419159a58.51253 58.51253 0 0 0-44.615805 0L62.184923 231.155214a58.51253 58.51253 0 0 0-35.107518 54.12409 57.781124 57.781124 0 0 0 35.107518 54.124091L490.057801 565.408043a53.392684 53.392684 0 0 0 21.942199 4.38844 51.198464 51.198464 0 0 0 21.942199-4.38844l427.141471-226.004648a59.243937 59.243937 0 0 0 35.107519-54.855497 57.781124 57.781124 0 0 0-34.376112-54.124091z m-36.570331 54.855497L512 503.969887l-413.244746-219.421989L512 66.588722z"  ></path><path d="M961.08367 457.159862a32.913298 32.913298 0 0 0-43.152991 16.822353 33.644705 33.644705 0 0 0 8.045473 37.301738L512 731.437348 98.023848 512.01536a33.644705 33.644705 0 0 0 7.314066-37.301739 32.181892 32.181892 0 0 0-19.016572-17.553759 30.719078 30.719078 0 0 0-24.136419 0A61.438157 61.438157 0 0 0 27.077405 512.01536a57.781124 57.781124 0 0 0 35.107518 54.12409l427.872878 226.736055a58.51253 58.51253 0 0 0 21.942199 4.38844 48.272838 48.272838 0 0 0 21.942199-5.119846l427.141471-226.004649a60.70675 60.70675 0 0 0 35.107519-54.12409 57.781124 57.781124 0 0 0-35.107519-54.855498z"  ></path><path d="M961.08367 684.627324a32.913298 32.913298 0 0 0-43.152991 16.822353 31.450485 31.450485 0 0 0 8.045473 36.570331L512 955.979183l-415.438965-219.421988a32.913298 32.913298 0 0 0 9.508286-12.433913 30.719078 30.719078 0 0 0 0-24.136419 29.987672 29.987672 0 0 0-16.090946-15.359539 32.913298 32.913298 0 0 0-26.330639 0 59.243937 59.243937 0 0 0-35.838925 54.124091 57.781124 57.781124 0 0 0 35.107519 54.12409l427.872878 226.736055A58.51253 58.51253 0 0 0 512 1024a53.392684 53.392684 0 0 0 22.673606-5.119846l426.410064-225.273242a60.70675 60.70675 0 0 0 35.107519-54.855497 58.51253 58.51253 0 0 0-35.107519-54.124091z"  ></path></symbol><symbol id="icon-ziyuanguanliqi" viewBox="0 0 1024 1024"><path d="M942.08 1013.76h-332.8a64 64 0 0 1-64-64V613.76a64 64 0 0 1 64-67.2h332.8a64 64 0 0 1 64 67.2v333.44a64 64 0 0 1-64 66.56z m-329.6-396.8v330.24l329.6-3.2-3.84-330.24z m-3.2 0zM942.08 479.36h-332.8a64 64 0 0 1-64-64V79.36a64 64 0 0 1 64-64h332.8a64 64 0 0 1 64 67.2v330.24a64 64 0 0 1-64 66.56z m-329.6-396.8v330.24l329.6-3.84-3.84-329.6z m-3.2 0zM414.72 479.36h-332.8a64 64 0 0 1-64-64V79.36a64 64 0 0 1 64-64h332.8a64 64 0 0 1 64 67.2v330.24a64 64 0 0 1-64 66.56z m-328.96-396.8v330.24l328.96-3.84-3.2-329.6z m-3.84 0zM448 815.36H50.56a34.56 34.56 0 0 1-35.2-35.2 35.2 35.2 0 0 1 35.2-35.2H448a35.2 35.2 0 0 1 35.2 35.2 35.2 35.2 0 0 1-35.2 35.2z" fill="#323333" ></path><path d="M248.32 1013.76a35.2 35.2 0 0 1-35.2-35.2V582.4a35.2 35.2 0 0 1 35.2-35.2 34.56 34.56 0 0 1 35.2 35.2v396.16a35.2 35.2 0 0 1-35.2 35.2z" fill="#323333" ></path></symbol><symbol id="icon-shequfuwu" viewBox="0 0 1024 1024"><path d="M150.1 485.2c-4.2 0-8.5-1.6-11.8-4.7-6.8-6.5-7-17.3-0.5-24l343-357.2c7.9-8.3 19.1-13 30.6-13S534 91 542 99.3l344.2 357c6.5 6.8 6.3 17.5-0.4 24-6.8 6.5-17.5 6.3-24-0.4l-344.2-357c-1.6-1.7-3.8-2.6-6.1-2.6s-4.4 0.9-6 2.6L162.4 480c-3.4 3.5-7.8 5.2-12.3 5.2zM804.6 826H219.5V516.7c0-9.4 7.6-17 17-17s17 7.6 17 17V792h517.1V516.7c0-9.4 7.6-17 17-17s17 7.6 17 17V826z" fill="#333333" ></path><path d="M637.6 737c-18.2 0-33-14.8-33-33 0-39.8-25.8-75.1-62.8-87.6 8.1 17.3 20.3 45 24 64.1l0.1 0.6c0.7 4.8-1.2 9.6-5 12.9l-0.3 0.3c-3.1 2.5-15 11.2-40 19.9l-2.1 0.9-0.7 0.2-0.7 0.1c-0.6 0.1-1.6 0.4-2.9 0.5-3 0.4-6 0.1-8.8-0.9l-0.3-0.1c-23.6-8.6-37-17.5-40.3-19.9-5-3.3-7.4-9.1-6.2-14.7 3.6-18.7 14.9-44.7 24-63.9-37 12.5-62.9 47.8-62.9 87.6 0 18.2-14.8 33-33 33s-33-14.8-33-33c0-53.7 26.7-102.8 70.8-131.9-12-13.6-20.7-29.9-25.3-47.7-6-23.2-4.8-47.3 3.5-69.7 8.3-22.4 23.1-41.5 42.7-55.2 19.6-13.7 42.7-20.9 66.6-20.9s46.9 7.2 66.6 20.9c19.6 13.7 34.4 32.7 42.7 55.2 8.3 22.5 9.5 46.6 3.4 69.8-4.6 17.8-13.2 34-25.2 47.6 43.9 29 70.8 78.2 71.1 132 0 18.1-14.8 32.9-33 32.9zM529.3 588.5l6.8 1.4c26.1 5.5 49.8 19.9 66.6 40.6 16.8 20.7 26.1 46.8 26.1 73.5 0 4.9 4 8.8 8.8 8.8 4.9 0 8.8-4 8.8-8.8-0.3-50.2-27.9-95.8-72.1-118.9l-15.8-8.3 13.5-11.6c29.2-25 39.9-66.1 26.6-102.3-13.4-36.1-48.2-60.3-86.7-60.3s-73.3 24.2-86.7 60.3c-13.4 36.1-2.7 77.2 26.6 102.2l13.5 11.6-15.8 8.3c-44.3 23.2-71.8 68.7-71.8 118.8 0 4.9 4 8.8 8.8 8.8 4.9 0 8.8-4 8.8-8.8 0-26.7 9.3-52.8 26.1-73.5 16.8-20.7 40.5-35.1 66.7-40.6l6.7-1.4 4.6 5c2 2.1 4.2 4.1 6.7 5.8l5.8 4 6.1-4c2.3-1.5 4.4-3.4 6.3-5.5l5-5.1z m-45.5 90c5.2 3.1 14.6 8.1 28 13.1 14.4-4.9 23.7-9.8 28.8-12.9-4.9-17.9-16.5-44.1-26.5-64.1l-1.9-3.9-1.9 3.8c-12.8 25.5-22.3 48.7-26.5 64zM512 569.8c-41.2 0-74.8-33.5-74.8-74.8s33.5-74.8 74.8-74.8 74.8 33.5 74.8 74.8-33.6 74.8-74.8 74.8z m0-125.4c-27.9 0-50.6 22.7-50.6 50.6 0 27.9 22.7 50.6 50.6 50.6 27.9 0 50.6-22.7 50.6-50.6 0-27.9-22.7-50.6-50.6-50.6z" fill="#333333" ></path></symbol><symbol id="icon-fuzhi-" viewBox="0 0 1024 1024"><path d="M263.2 761.3H145.4c-45.5 0-82.5-37-82.5-82.5V150.6c0-45.5 37-82.5 82.5-82.5h488.9c45.5 0 82.5 37 82.5 82.5v70.1c0 11-9 20-20 20s-20-9-20-20v-70.1c0-23.4-19-42.5-42.5-42.5H145.4c-23.4 0-42.5 19-42.5 42.5v528.3c0 23.4 19 42.5 42.5 42.5h117.8c11 0 20 9 20 20s-8.9 19.9-20 19.9z" fill="#1C1C1C" ></path><path d="M897.2 971.1H400.9c-42.5 0-77.2-34.6-77.2-77.2V358.4c0-42.5 34.6-77.2 77.2-77.2h496.4c42.5 0 77.2 34.6 77.2 77.2V894c-0.1 42.5-34.7 77.1-77.3 77.1zM400.9 321.2c-20.5 0-37.2 16.7-37.2 37.2V894c0 20.5 16.7 37.2 37.2 37.2h496.4c20.5 0 37.2-16.7 37.2-37.2V358.4c0-20.5-16.7-37.2-37.2-37.2H400.9z" fill="#1C1C1C" ></path></symbol><symbol id="icon-dingdanguanli" viewBox="0 0 1024 1024"><path d="M871.04 120.32h-104.96v-6.4c0-62.72-51.2-113.92-113.92-113.92H371.84c-62.72 0-113.92 51.2-113.92 113.92v5.76H152.32C103.68 120.32 64 159.36 64 208.64v651.52C64 950.4 137.6 1024 227.84 1024h568.32c90.24 0 163.84-73.6 163.84-163.84V208.64c0-49.28-39.68-88.32-88.96-88.32z m-549.12-6.4c0-27.52 22.4-49.92 49.92-49.92h280.32c27.52 0 49.92 22.4 49.92 49.92V256H321.92V113.92zM896 860.16c0 55.04-44.8 99.84-99.84 99.84H227.84C172.8 960 128 915.2 128 860.16V208.64c0-13.44 10.88-24.32 24.32-24.32h104.96V288c0 17.92 14.08 32 32 32h444.16c17.92 0 32-14.08 32-32V184.32h104.96c13.44 0 24.32 10.88 24.32 24.32v651.52z" fill="#333333" ></path><path d="M734.08 448H289.92c-17.92 0-32 14.08-32 32s14.08 32 32 32h444.16c17.92 0 32-14.08 32-32s-14.08-32-32-32zM734.08 640H289.92c-17.92 0-32 14.08-32 32s14.08 32 32 32h444.16c17.92 0 32-14.08 32-32s-14.08-32-32-32z" fill="#333333" ></path></symbol><symbol id="icon-kefu" viewBox="0 0 1051 1024"><path d="M55.351351 553.402811v110.924108a83.027027 83.027027 0 0 0 166.054054 0v-110.924108a83.027027 83.027027 0 0 0-166.054054 0z m763.101406 211.552865A137.852541 137.852541 0 0 1 774.918919 664.326919v-110.924108A138.378378 138.378378 0 0 1 912.328649 415.135135C898.131027 214.071351 730.499459 55.351351 525.837838 55.351351 321.148541 55.351351 153.544649 214.071351 139.347027 415.135135A138.461405 138.461405 0 0 1 276.756757 553.402811v110.924108a138.378378 138.378378 0 0 1-276.756757 0v-110.924108a138.378378 138.378378 0 0 1 83.303784-126.865297C91.883243 189.523027 286.72 0 525.837838 0s433.954595 189.523027 442.534054 426.537514A138.461405 138.461405 0 0 1 1051.675676 553.402811v110.924108a138.378378 138.378378 0 0 1-184.790487 130.269405 470.763243 470.763243 0 0 1-188.858811 121.21946A96.809514 96.809514 0 0 1 580.912432 1010.162162h-82.528864c-53.690811 0-97.113946-43.174054-97.113946-96.864865 0-53.607784 43.284757-96.864865 97.141621-96.864865h82.473514c34.954378 0 65.536 18.265946 82.639567 45.803244a415.273514 415.273514 0 0 0 154.900757-97.28zM830.27027 553.402811v110.924108a83.027027 83.027027 0 0 0 166.054054 0v-110.924108a83.027027 83.027027 0 0 0-166.054054 0zM498.438919 954.810811h82.473513c23.302919 0 41.79027-18.487351 41.790271-41.513514 0-23.053838-18.570378-41.513514-41.790271-41.513513h-82.473513c-23.302919 0-41.79027 18.487351-41.79027 41.513513 0 23.053838 18.570378 41.513514 41.79027 41.513514z" fill="#666666" ></path></symbol><symbol id="icon-ditu_diqiu_o" viewBox="0 0 1024 1024"><path d="M550.4 896h-17.066667C332.8 896 170.666667 733.866667 170.666667 533.333333S332.8 170.666667 533.333333 170.666667h21.333334c192 12.8 341.333333 170.666667 341.333333 362.666666 0 174.933333-123.733333 320-290.133333 354.133334-17.066667 4.266667-38.4 8.533333-55.466667 8.533333z m-34.133333-42.666667v-145.066666l-59.733334-81.066667 123.733334-123.733333 59.733333 59.733333h115.2l76.8 76.8v8.533333c12.8-38.4 21.333333-76.8 21.333333-119.466666 0-166.4-128-302.933333-290.133333-320L473.6 298.666667l59.733333 59.733333V469.333333l-98.133333 98.133334-187.733333-179.2c-21.333333 42.666667-34.133333 93.866667-34.133334 145.066666 0 170.666667 132.266667 311.466667 302.933334 320zM366.933333 260.266667c-38.4 25.6-68.266667 51.2-93.866666 89.6l162.133333 162.133333 55.466667-55.466667V379.733333L413.866667 302.933333l12.8-12.8 72.533333-72.533333c-46.933333 4.266667-89.6 17.066667-132.266667 42.666667z m192 430.933333V853.333333c42.666667-4.266667 89.6-17.066667 136.533334-42.666666 38.4-21.333333 68.266667-51.2 93.866666-85.333334v-68.266666l-51.2-51.2h-115.2l-42.666666-42.666667-64 64 42.666666 64z" fill="#444444" ></path></symbol><symbol id="icon-xiaoxi" viewBox="0 0 1024 1024"><path d="M506.31 162.55C362.92 165.58 247.6 282.77 247.6 426.87V631.5l-79.76 106.34c-16.33 21.78-11.92 52.67 9.86 69.01a49.28 49.28 0 0 0 29.57 9.86h609.47c10.64 0 21-3.45 29.52-9.82l2.51-2.03c19.73-16.88 22.98-46.17 7.44-66.96l-79.87-106.79V426.87c0-146.01-118.37-264.37-264.37-264.37l-5.66 0.05z m5.66 62.68c111.36 0 201.64 90.28 201.64 201.64v215.08l0.13 2.83c0.61 6.58 3.26 12.82 7.64 17.82l1.31 1.49 67.21 89.89H234.14l69.92-93.2a31.371 31.371 0 0 0 6.27-18.82V426.87c0-111.36 90.28-201.64 201.64-201.64z"  ></path><path d="M453.31 839.11c0 34.65 28.09 62.73 62.73 62.73 34.65 0 62.73-28.09 62.73-62.73m-17.92-672.13c0.01-24.75-20.04-44.82-44.79-44.83-24.75-0.01-44.82 20.04-44.83 44.79v0.04"  ></path></symbol><symbol id="icon-AIzhushou" viewBox="0 0 1024 1024"><path d="M521.0112 4.608c151.808 0 278.784 47.4624 367.0528 137.728 88.2688 90.1632 137.9328 226.048 135.8848 377.344a511.9488 511.9488 0 0 1-47.5136 212.736c-102.7584 214.7328-307.3536 263.3728-472.4736 263.68-81.8176 0-163.2256-10.6496-242.2784-31.488H100.352a66.3552 66.3552 0 0 1-66.2528-76.0832l18.2272-129.024C23.04 711.4752 5.6832 635.904 0.768 534.016A501.1456 501.1456 0 0 1 368.0256 23.3472 610.2016 610.2016 0 0 1 521.0112 4.608z m0.1536 74.24a535.7056 535.7056 0 0 0-134.5024 16.384 426.6496 426.6496 0 0 0-311.6032 434.688c4.096 89.6512 18.7392 156.16 42.0352 192 8.2944 12.4416 11.776 27.4944 9.5744 42.3424l-17.8176 126.3104h155.136c6.0928 0 12.032 0.768 17.8688 2.4576 49.4592 13.6192 476.7744 123.5968 627.3024-191.488a444.1088 444.1088 0 0 0 40.7552-182.3744c2.4576-131.2256-38.2976-247.1936-114.688-324.096-76.288-76.8512-179.8656-116.224-314.0608-116.224z m-41.472 252.0064c4.1984 5.9392 7.68 12.288 10.3936 19.0464l10.8544 27.392 92.5696 228.5568c6.4512 12.032 10.5984 25.2416 12.3904 38.8608a31.744 31.744 0 0 1-10.0864 22.784c-6.4512 6.5536-15.36 10.24-24.7296 10.0864a29.2864 29.2864 0 0 1-24.7296-11.1104 68.7104 68.7104 0 0 1-8.6528-16.0768c-4.2496-7.0144-6.0928-13.4656-9.3184-18.944l-16.7936-44.4928H367.7696l-17.0496 45.1584c-4.1472 12.5952-9.728 24.576-16.8448 35.84a26.8288 26.8288 0 0 1-23.04 9.472 33.8432 33.8432 0 0 1-24.7296-9.8304 30.5664 30.5664 0 0 1-10.3424-22.528c0.1536-5.0176 0.9216-9.9328 2.4576-14.848a283.136 283.136 0 0 1 7.8848-21.504l90.7264-229.888c2.4576-6.656 5.7344-14.592 9.216-24.6784 2.9696-8.192 6.8608-15.7696 11.6224-23.04a46.4896 46.4896 0 0 1 16.0768-14.848 49.408 49.408 0 0 1 65.9968 14.592z m215.2448-19.1488a34.2016 34.2016 0 0 1 26.1632 10.5984c7.2704 9.216 10.8544 20.8384 9.8304 32.6144v278.784c1.024 11.776-2.56 23.552-9.8304 32.8704a33.9456 33.9456 0 0 1-26.112 10.8544 33.2288 33.2288 0 0 1-24.7296-10.8544 47.3088 47.3088 0 0 1-9.8816-25.8048V354.9184a46.336 46.336 0 0 1 9.8816-32.3584 32.768 32.768 0 0 1 24.6784-10.8544z m-256.1024 74.752L386.56 532.6848h105.472L438.8352 386.5088z" fill="#575757" ></path></symbol></svg>',(t=>{var c=(l=(l=document.getElementsByTagName("script"))[l.length-1]).getAttribute("data-injectcss"),l=l.getAttribute("data-disable-injectsvg");if(!l){var a,i,e,o,n,h=function(c,l){l.parentNode.insertBefore(c,l)};if(c&&!t.__iconfont__svg__cssinject__){t.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(c){console&&console.log(c)}}a=function(){var c,l=document.createElement("div");l.innerHTML=t._iconfont_svg_string_5043107,(l=l.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",l=l,(c=document.body).firstChild?h(l,c.firstChild):c.appendChild(l))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(a,0):(i=function(){document.removeEventListener("DOMContentLoaded",i,!1),a()},document.addEventListener("DOMContentLoaded",i,!1)):document.attachEvent&&(e=a,o=t.document,n=!1,d(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,s())})}function s(){n||(n=!0,e())}function d(){try{o.documentElement.doScroll("left")}catch(c){return void setTimeout(d,50)}s()}})(window);
\ No newline at end of file
+window._iconfont_svg_string_5043107='<svg><symbol id="icon-youjiantou" viewBox="0 0 1024 1024"><path d="M885.113 489.373L628.338 232.599c-12.496-12.497-32.758-12.497-45.254 0-12.497 12.497-12.497 32.758 0 45.255l203.3 203.3H158.025c-17.036 0-30.846 13.811-30.846 30.846 0 17.036 13.811 30.846 30.846 30.846h628.36L583.084 746.147c-12.497 12.496-12.497 32.758 0 45.255 6.248 6.248 14.438 9.372 22.627 9.372s16.379-3.124 22.627-9.372l256.775-256.775a31.999 31.999 0 0 0 0-45.254z" fill="" ></path></symbol><symbol id="icon-shang" viewBox="0 0 1024 1024"><path d="M904 692c0 8.189-3.124 16.379-9.372 22.628-12.497 12.496-32.759 12.496-45.256 0L512 377.255 174.628 714.628c-12.497 12.496-32.758 12.496-45.255 0-12.497-12.498-12.497-32.758 0-45.256l360-360c12.497-12.496 32.758-12.496 45.255 0l360 360C900.876 675.621 904 683.811 904 692z" fill="" ></path></symbol><symbol id="icon-xia" viewBox="0 0 1024 1024"><path d="M904 332c0-8.189-3.124-16.379-9.372-22.628-12.497-12.496-32.759-12.496-45.256 0L512 646.745 174.628 309.372c-12.497-12.496-32.758-12.496-45.255 0-12.497 12.498-12.497 32.758 0 45.256l360 360c12.497 12.496 32.758 12.496 45.255 0l360-360C900.876 348.379 904 340.189 904 332z" fill="" ></path></symbol><symbol id="icon-gouwuchekong" viewBox="0 0 1028 1024"><path d="M332.8 790.528q19.456 0 36.864 7.168t30.208 19.968 20.48 30.208 7.68 36.864-7.68 36.864-20.48 30.208-30.208 20.48-36.864 7.68q-20.48 0-37.888-7.68t-30.208-20.48-20.48-30.208-7.68-36.864 7.68-36.864 20.48-30.208 30.208-19.968 37.888-7.168zM758.784 792.576q19.456 0 37.376 7.168t30.72 19.968 20.48 30.208 7.68 36.864-7.68 36.864-20.48 30.208-30.72 20.48-37.376 7.68-36.864-7.68-30.208-20.48-20.48-30.208-7.68-36.864 7.68-36.864 20.48-30.208 30.208-19.968 36.864-7.168zM930.816 210.944q28.672 0 44.544 7.68t22.528 18.944 6.144 24.064-3.584 22.016-13.312 37.888-22.016 62.976-23.552 68.096-18.944 53.248q-13.312 40.96-33.28 56.832t-49.664 15.872l-35.84 0-65.536 0-86.016 0-96.256 0-253.952 0 14.336 92.16 517.12 0q49.152 0 49.152 41.984 0 20.48-9.728 35.84t-38.4 14.336l-49.152 0-94.208 0-118.784 0-119.808 0-99.328 0-55.296 0q-20.48 0-34.304-9.216t-23.04-24.064-14.848-32.256-8.704-32.768q-1.024-6.144-5.632-29.696t-11.264-58.88-14.848-78.848-16.384-87.552q-19.456-103.424-44.032-230.4l-76.8 0q-15.36 0-25.6-7.68t-16.896-18.432-9.216-23.04-2.56-22.528q0-20.48 13.824-33.792t37.376-12.288l103.424 0q20.48 0 32.768 6.144t19.456 15.36 10.24 18.944 5.12 16.896q2.048 8.192 4.096 23.04t4.096 30.208q3.072 18.432 6.144 38.912l700.416 0zM892.928 302.08l-641.024-2.048 35.84 185.344 535.552 1.024z"  ></path></symbol><symbol id="icon-icon_guanji-kaiji" viewBox="0 0 1024 1024"><path d="M554.67 128h-85.33v426.67h85.33V128z m206.29 92.37l-60.37 60.37C767.57 335.57 810.67 418.56 810.67 512c0 164.91-133.76 298.67-298.67 298.67S213.33 676.91 213.33 512c0-93.44 43.09-176.43 110.08-231.25l-60.37-60.37C180.69 290.77 128 395.09 128 512c0 212.05 171.95 384 384 384s384-171.95 384-384c0-116.91-52.69-221.23-135.04-291.63z"  ></path></symbol><symbol id="icon-icon_arrow_left" viewBox="0 0 1024 1024"><path d="M669.472 162.88l49.504 49.696-294.56 300.48 297.024 297.952-49.088 50.08-346.56-347.616z"  ></path></symbol><symbol id="icon-fasong" viewBox="0 0 1024 1024"><path d="M931.392 11.264L45.12 530.688c-28.736 16.896-43.52 39.424-45.12 61.248v8.128c2.048 26.112 23.04 49.984 61.632 60.416l171.968 46.592a34.304 34.304 0 0 0 41.28-25.536 35.584 35.584 0 0 0-23.808-43.136L79.68 592l873.408-511.872-95.232 703.488c-1.408 10.432-9.152 15.68-18.752 12.992l-365.632-100.288 296.32-305.856a36.416 36.416 0 0 0 0-50.24 33.728 33.728 0 0 0-48.704 0l-324.8 335.36a110.72 110.72 0 0 0-7.872 9.088 35.52 35.52 0 0 0-16.128 30.784 104 104 0 0 0-5.248 32.64v206.4c0 49.664 53.568 79.168 93.568 51.712l166.272-114.368c10.24-6.976 16-19.136 15.232-31.872a35.712 35.712 0 0 0-19.2-29.504 33.28 33.28 0 0 0-34.24 2.304L435.84 937.856v-178.432l385.472 105.6c49.6 13.632 97.472-19.072 104.576-71.808l97.152-717.568c8.448-60.48-40-94.72-91.648-64.384z" fill="#666666" ></path></symbol><symbol id="icon-fuzhi" viewBox="0 0 1024 1024"><path d="M731.68184 676.057473 731.68184 183.323259c0-30.233582-24.512277-54.745858-54.747905-54.745858L184.216093 128.577401c-30.233582 0-54.746882 24.512277-54.746882 54.745858l0 492.734214c0 30.207999 24.5133 54.746882 54.746882 54.746882l492.717841 0C707.16854 730.804355 731.68184 706.265472 731.68184 676.057473zM622.1891 676.057473 238.962975 676.057473c-30.233582 0-54.746882-24.538883-54.746882-54.745858L184.216093 238.07014c0-30.233582 24.5133-54.746882 54.746882-54.746882l383.226125 0c30.233582 0 54.744835 24.512277 54.744835 54.746882l0 383.242498C676.933935 651.51859 652.421658 676.057473 622.1891 676.057473zM841.17458 292.817022l-54.745858 0 0 54.746882c30.232558 0 54.745858 24.5133 54.745858 54.759161l0 383.228171c0 30.206976-24.5133 54.745858-54.745858 54.745858L403.201573 840.297095c-30.233582 0-54.746882-24.538883-54.746882-54.745858l-54.746882 0 0 54.745858c0 30.207999 24.5133 54.747905 54.746882 54.747905l492.719888 0c30.234605 0 54.747905-24.539906 54.747905-54.747905L895.922485 347.563904C895.922485 317.329299 871.408161 292.817022 841.17458 292.817022z" fill="#666666" ></path></symbol><symbol id="icon-dalei-quanbuchanpin" viewBox="0 0 1024 1024"><path d="M961.815077 230.423807L533.942199 4.419159a58.51253 58.51253 0 0 0-44.615805 0L62.184923 231.155214a58.51253 58.51253 0 0 0-35.107518 54.12409 57.781124 57.781124 0 0 0 35.107518 54.124091L490.057801 565.408043a53.392684 53.392684 0 0 0 21.942199 4.38844 51.198464 51.198464 0 0 0 21.942199-4.38844l427.141471-226.004648a59.243937 59.243937 0 0 0 35.107519-54.855497 57.781124 57.781124 0 0 0-34.376112-54.124091z m-36.570331 54.855497L512 503.969887l-413.244746-219.421989L512 66.588722z"  ></path><path d="M961.08367 457.159862a32.913298 32.913298 0 0 0-43.152991 16.822353 33.644705 33.644705 0 0 0 8.045473 37.301738L512 731.437348 98.023848 512.01536a33.644705 33.644705 0 0 0 7.314066-37.301739 32.181892 32.181892 0 0 0-19.016572-17.553759 30.719078 30.719078 0 0 0-24.136419 0A61.438157 61.438157 0 0 0 27.077405 512.01536a57.781124 57.781124 0 0 0 35.107518 54.12409l427.872878 226.736055a58.51253 58.51253 0 0 0 21.942199 4.38844 48.272838 48.272838 0 0 0 21.942199-5.119846l427.141471-226.004649a60.70675 60.70675 0 0 0 35.107519-54.12409 57.781124 57.781124 0 0 0-35.107519-54.855498z"  ></path><path d="M961.08367 684.627324a32.913298 32.913298 0 0 0-43.152991 16.822353 31.450485 31.450485 0 0 0 8.045473 36.570331L512 955.979183l-415.438965-219.421988a32.913298 32.913298 0 0 0 9.508286-12.433913 30.719078 30.719078 0 0 0 0-24.136419 29.987672 29.987672 0 0 0-16.090946-15.359539 32.913298 32.913298 0 0 0-26.330639 0 59.243937 59.243937 0 0 0-35.838925 54.124091 57.781124 57.781124 0 0 0 35.107519 54.12409l427.872878 226.736055A58.51253 58.51253 0 0 0 512 1024a53.392684 53.392684 0 0 0 22.673606-5.119846l426.410064-225.273242a60.70675 60.70675 0 0 0 35.107519-54.855497 58.51253 58.51253 0 0 0-35.107519-54.124091z"  ></path></symbol><symbol id="icon-ziyuanguanliqi" viewBox="0 0 1024 1024"><path d="M942.08 1013.76h-332.8a64 64 0 0 1-64-64V613.76a64 64 0 0 1 64-67.2h332.8a64 64 0 0 1 64 67.2v333.44a64 64 0 0 1-64 66.56z m-329.6-396.8v330.24l329.6-3.2-3.84-330.24z m-3.2 0zM942.08 479.36h-332.8a64 64 0 0 1-64-64V79.36a64 64 0 0 1 64-64h332.8a64 64 0 0 1 64 67.2v330.24a64 64 0 0 1-64 66.56z m-329.6-396.8v330.24l329.6-3.84-3.84-329.6z m-3.2 0zM414.72 479.36h-332.8a64 64 0 0 1-64-64V79.36a64 64 0 0 1 64-64h332.8a64 64 0 0 1 64 67.2v330.24a64 64 0 0 1-64 66.56z m-328.96-396.8v330.24l328.96-3.84-3.2-329.6z m-3.84 0zM448 815.36H50.56a34.56 34.56 0 0 1-35.2-35.2 35.2 35.2 0 0 1 35.2-35.2H448a35.2 35.2 0 0 1 35.2 35.2 35.2 35.2 0 0 1-35.2 35.2z" fill="#323333" ></path><path d="M248.32 1013.76a35.2 35.2 0 0 1-35.2-35.2V582.4a35.2 35.2 0 0 1 35.2-35.2 34.56 34.56 0 0 1 35.2 35.2v396.16a35.2 35.2 0 0 1-35.2 35.2z" fill="#323333" ></path></symbol><symbol id="icon-shequfuwu" viewBox="0 0 1024 1024"><path d="M150.1 485.2c-4.2 0-8.5-1.6-11.8-4.7-6.8-6.5-7-17.3-0.5-24l343-357.2c7.9-8.3 19.1-13 30.6-13S534 91 542 99.3l344.2 357c6.5 6.8 6.3 17.5-0.4 24-6.8 6.5-17.5 6.3-24-0.4l-344.2-357c-1.6-1.7-3.8-2.6-6.1-2.6s-4.4 0.9-6 2.6L162.4 480c-3.4 3.5-7.8 5.2-12.3 5.2zM804.6 826H219.5V516.7c0-9.4 7.6-17 17-17s17 7.6 17 17V792h517.1V516.7c0-9.4 7.6-17 17-17s17 7.6 17 17V826z" fill="#333333" ></path><path d="M637.6 737c-18.2 0-33-14.8-33-33 0-39.8-25.8-75.1-62.8-87.6 8.1 17.3 20.3 45 24 64.1l0.1 0.6c0.7 4.8-1.2 9.6-5 12.9l-0.3 0.3c-3.1 2.5-15 11.2-40 19.9l-2.1 0.9-0.7 0.2-0.7 0.1c-0.6 0.1-1.6 0.4-2.9 0.5-3 0.4-6 0.1-8.8-0.9l-0.3-0.1c-23.6-8.6-37-17.5-40.3-19.9-5-3.3-7.4-9.1-6.2-14.7 3.6-18.7 14.9-44.7 24-63.9-37 12.5-62.9 47.8-62.9 87.6 0 18.2-14.8 33-33 33s-33-14.8-33-33c0-53.7 26.7-102.8 70.8-131.9-12-13.6-20.7-29.9-25.3-47.7-6-23.2-4.8-47.3 3.5-69.7 8.3-22.4 23.1-41.5 42.7-55.2 19.6-13.7 42.7-20.9 66.6-20.9s46.9 7.2 66.6 20.9c19.6 13.7 34.4 32.7 42.7 55.2 8.3 22.5 9.5 46.6 3.4 69.8-4.6 17.8-13.2 34-25.2 47.6 43.9 29 70.8 78.2 71.1 132 0 18.1-14.8 32.9-33 32.9zM529.3 588.5l6.8 1.4c26.1 5.5 49.8 19.9 66.6 40.6 16.8 20.7 26.1 46.8 26.1 73.5 0 4.9 4 8.8 8.8 8.8 4.9 0 8.8-4 8.8-8.8-0.3-50.2-27.9-95.8-72.1-118.9l-15.8-8.3 13.5-11.6c29.2-25 39.9-66.1 26.6-102.3-13.4-36.1-48.2-60.3-86.7-60.3s-73.3 24.2-86.7 60.3c-13.4 36.1-2.7 77.2 26.6 102.2l13.5 11.6-15.8 8.3c-44.3 23.2-71.8 68.7-71.8 118.8 0 4.9 4 8.8 8.8 8.8 4.9 0 8.8-4 8.8-8.8 0-26.7 9.3-52.8 26.1-73.5 16.8-20.7 40.5-35.1 66.7-40.6l6.7-1.4 4.6 5c2 2.1 4.2 4.1 6.7 5.8l5.8 4 6.1-4c2.3-1.5 4.4-3.4 6.3-5.5l5-5.1z m-45.5 90c5.2 3.1 14.6 8.1 28 13.1 14.4-4.9 23.7-9.8 28.8-12.9-4.9-17.9-16.5-44.1-26.5-64.1l-1.9-3.9-1.9 3.8c-12.8 25.5-22.3 48.7-26.5 64zM512 569.8c-41.2 0-74.8-33.5-74.8-74.8s33.5-74.8 74.8-74.8 74.8 33.5 74.8 74.8-33.6 74.8-74.8 74.8z m0-125.4c-27.9 0-50.6 22.7-50.6 50.6 0 27.9 22.7 50.6 50.6 50.6 27.9 0 50.6-22.7 50.6-50.6 0-27.9-22.7-50.6-50.6-50.6z" fill="#333333" ></path></symbol><symbol id="icon-fuzhi-" viewBox="0 0 1024 1024"><path d="M263.2 761.3H145.4c-45.5 0-82.5-37-82.5-82.5V150.6c0-45.5 37-82.5 82.5-82.5h488.9c45.5 0 82.5 37 82.5 82.5v70.1c0 11-9 20-20 20s-20-9-20-20v-70.1c0-23.4-19-42.5-42.5-42.5H145.4c-23.4 0-42.5 19-42.5 42.5v528.3c0 23.4 19 42.5 42.5 42.5h117.8c11 0 20 9 20 20s-8.9 19.9-20 19.9z" fill="#1C1C1C" ></path><path d="M897.2 971.1H400.9c-42.5 0-77.2-34.6-77.2-77.2V358.4c0-42.5 34.6-77.2 77.2-77.2h496.4c42.5 0 77.2 34.6 77.2 77.2V894c-0.1 42.5-34.7 77.1-77.3 77.1zM400.9 321.2c-20.5 0-37.2 16.7-37.2 37.2V894c0 20.5 16.7 37.2 37.2 37.2h496.4c20.5 0 37.2-16.7 37.2-37.2V358.4c0-20.5-16.7-37.2-37.2-37.2H400.9z" fill="#1C1C1C" ></path></symbol><symbol id="icon-dingdanguanli" viewBox="0 0 1024 1024"><path d="M871.04 120.32h-104.96v-6.4c0-62.72-51.2-113.92-113.92-113.92H371.84c-62.72 0-113.92 51.2-113.92 113.92v5.76H152.32C103.68 120.32 64 159.36 64 208.64v651.52C64 950.4 137.6 1024 227.84 1024h568.32c90.24 0 163.84-73.6 163.84-163.84V208.64c0-49.28-39.68-88.32-88.96-88.32z m-549.12-6.4c0-27.52 22.4-49.92 49.92-49.92h280.32c27.52 0 49.92 22.4 49.92 49.92V256H321.92V113.92zM896 860.16c0 55.04-44.8 99.84-99.84 99.84H227.84C172.8 960 128 915.2 128 860.16V208.64c0-13.44 10.88-24.32 24.32-24.32h104.96V288c0 17.92 14.08 32 32 32h444.16c17.92 0 32-14.08 32-32V184.32h104.96c13.44 0 24.32 10.88 24.32 24.32v651.52z" fill="#333333" ></path><path d="M734.08 448H289.92c-17.92 0-32 14.08-32 32s14.08 32 32 32h444.16c17.92 0 32-14.08 32-32s-14.08-32-32-32zM734.08 640H289.92c-17.92 0-32 14.08-32 32s14.08 32 32 32h444.16c17.92 0 32-14.08 32-32s-14.08-32-32-32z" fill="#333333" ></path></symbol><symbol id="icon-kefu" viewBox="0 0 1051 1024"><path d="M55.351351 553.402811v110.924108a83.027027 83.027027 0 0 0 166.054054 0v-110.924108a83.027027 83.027027 0 0 0-166.054054 0z m763.101406 211.552865A137.852541 137.852541 0 0 1 774.918919 664.326919v-110.924108A138.378378 138.378378 0 0 1 912.328649 415.135135C898.131027 214.071351 730.499459 55.351351 525.837838 55.351351 321.148541 55.351351 153.544649 214.071351 139.347027 415.135135A138.461405 138.461405 0 0 1 276.756757 553.402811v110.924108a138.378378 138.378378 0 0 1-276.756757 0v-110.924108a138.378378 138.378378 0 0 1 83.303784-126.865297C91.883243 189.523027 286.72 0 525.837838 0s433.954595 189.523027 442.534054 426.537514A138.461405 138.461405 0 0 1 1051.675676 553.402811v110.924108a138.378378 138.378378 0 0 1-184.790487 130.269405 470.763243 470.763243 0 0 1-188.858811 121.21946A96.809514 96.809514 0 0 1 580.912432 1010.162162h-82.528864c-53.690811 0-97.113946-43.174054-97.113946-96.864865 0-53.607784 43.284757-96.864865 97.141621-96.864865h82.473514c34.954378 0 65.536 18.265946 82.639567 45.803244a415.273514 415.273514 0 0 0 154.900757-97.28zM830.27027 553.402811v110.924108a83.027027 83.027027 0 0 0 166.054054 0v-110.924108a83.027027 83.027027 0 0 0-166.054054 0zM498.438919 954.810811h82.473513c23.302919 0 41.79027-18.487351 41.790271-41.513514 0-23.053838-18.570378-41.513514-41.790271-41.513513h-82.473513c-23.302919 0-41.79027 18.487351-41.79027 41.513513 0 23.053838 18.570378 41.513514 41.79027 41.513514z" fill="#666666" ></path></symbol><symbol id="icon-ditu_diqiu_o" viewBox="0 0 1024 1024"><path d="M550.4 896h-17.066667C332.8 896 170.666667 733.866667 170.666667 533.333333S332.8 170.666667 533.333333 170.666667h21.333334c192 12.8 341.333333 170.666667 341.333333 362.666666 0 174.933333-123.733333 320-290.133333 354.133334-17.066667 4.266667-38.4 8.533333-55.466667 8.533333z m-34.133333-42.666667v-145.066666l-59.733334-81.066667 123.733334-123.733333 59.733333 59.733333h115.2l76.8 76.8v8.533333c12.8-38.4 21.333333-76.8 21.333333-119.466666 0-166.4-128-302.933333-290.133333-320L473.6 298.666667l59.733333 59.733333V469.333333l-98.133333 98.133334-187.733333-179.2c-21.333333 42.666667-34.133333 93.866667-34.133334 145.066666 0 170.666667 132.266667 311.466667 302.933334 320zM366.933333 260.266667c-38.4 25.6-68.266667 51.2-93.866666 89.6l162.133333 162.133333 55.466667-55.466667V379.733333L413.866667 302.933333l12.8-12.8 72.533333-72.533333c-46.933333 4.266667-89.6 17.066667-132.266667 42.666667z m192 430.933333V853.333333c42.666667-4.266667 89.6-17.066667 136.533334-42.666666 38.4-21.333333 68.266667-51.2 93.866666-85.333334v-68.266666l-51.2-51.2h-115.2l-42.666666-42.666667-64 64 42.666666 64z" fill="#444444" ></path></symbol><symbol id="icon-xiaoxi" viewBox="0 0 1024 1024"><path d="M506.31 162.55C362.92 165.58 247.6 282.77 247.6 426.87V631.5l-79.76 106.34c-16.33 21.78-11.92 52.67 9.86 69.01a49.28 49.28 0 0 0 29.57 9.86h609.47c10.64 0 21-3.45 29.52-9.82l2.51-2.03c19.73-16.88 22.98-46.17 7.44-66.96l-79.87-106.79V426.87c0-146.01-118.37-264.37-264.37-264.37l-5.66 0.05z m5.66 62.68c111.36 0 201.64 90.28 201.64 201.64v215.08l0.13 2.83c0.61 6.58 3.26 12.82 7.64 17.82l1.31 1.49 67.21 89.89H234.14l69.92-93.2a31.371 31.371 0 0 0 6.27-18.82V426.87c0-111.36 90.28-201.64 201.64-201.64z"  ></path><path d="M453.31 839.11c0 34.65 28.09 62.73 62.73 62.73 34.65 0 62.73-28.09 62.73-62.73m-17.92-672.13c0.01-24.75-20.04-44.82-44.79-44.83-24.75-0.01-44.82 20.04-44.83 44.79v0.04"  ></path></symbol><symbol id="icon-AIzhushou" viewBox="0 0 1024 1024"><path d="M521.0112 4.608c151.808 0 278.784 47.4624 367.0528 137.728 88.2688 90.1632 137.9328 226.048 135.8848 377.344a511.9488 511.9488 0 0 1-47.5136 212.736c-102.7584 214.7328-307.3536 263.3728-472.4736 263.68-81.8176 0-163.2256-10.6496-242.2784-31.488H100.352a66.3552 66.3552 0 0 1-66.2528-76.0832l18.2272-129.024C23.04 711.4752 5.6832 635.904 0.768 534.016A501.1456 501.1456 0 0 1 368.0256 23.3472 610.2016 610.2016 0 0 1 521.0112 4.608z m0.1536 74.24a535.7056 535.7056 0 0 0-134.5024 16.384 426.6496 426.6496 0 0 0-311.6032 434.688c4.096 89.6512 18.7392 156.16 42.0352 192 8.2944 12.4416 11.776 27.4944 9.5744 42.3424l-17.8176 126.3104h155.136c6.0928 0 12.032 0.768 17.8688 2.4576 49.4592 13.6192 476.7744 123.5968 627.3024-191.488a444.1088 444.1088 0 0 0 40.7552-182.3744c2.4576-131.2256-38.2976-247.1936-114.688-324.096-76.288-76.8512-179.8656-116.224-314.0608-116.224z m-41.472 252.0064c4.1984 5.9392 7.68 12.288 10.3936 19.0464l10.8544 27.392 92.5696 228.5568c6.4512 12.032 10.5984 25.2416 12.3904 38.8608a31.744 31.744 0 0 1-10.0864 22.784c-6.4512 6.5536-15.36 10.24-24.7296 10.0864a29.2864 29.2864 0 0 1-24.7296-11.1104 68.7104 68.7104 0 0 1-8.6528-16.0768c-4.2496-7.0144-6.0928-13.4656-9.3184-18.944l-16.7936-44.4928H367.7696l-17.0496 45.1584c-4.1472 12.5952-9.728 24.576-16.8448 35.84a26.8288 26.8288 0 0 1-23.04 9.472 33.8432 33.8432 0 0 1-24.7296-9.8304 30.5664 30.5664 0 0 1-10.3424-22.528c0.1536-5.0176 0.9216-9.9328 2.4576-14.848a283.136 283.136 0 0 1 7.8848-21.504l90.7264-229.888c2.4576-6.656 5.7344-14.592 9.216-24.6784 2.9696-8.192 6.8608-15.7696 11.6224-23.04a46.4896 46.4896 0 0 1 16.0768-14.848 49.408 49.408 0 0 1 65.9968 14.592z m215.2448-19.1488a34.2016 34.2016 0 0 1 26.1632 10.5984c7.2704 9.216 10.8544 20.8384 9.8304 32.6144v278.784c1.024 11.776-2.56 23.552-9.8304 32.8704a33.9456 33.9456 0 0 1-26.112 10.8544 33.2288 33.2288 0 0 1-24.7296-10.8544 47.3088 47.3088 0 0 1-9.8816-25.8048V354.9184a46.336 46.336 0 0 1 9.8816-32.3584 32.768 32.768 0 0 1 24.6784-10.8544z m-256.1024 74.752L386.56 532.6848h105.472L438.8352 386.5088z" fill="#575757" ></path></symbol></svg>',(t=>{var c=(l=(l=document.getElementsByTagName("script"))[l.length-1]).getAttribute("data-injectcss"),l=l.getAttribute("data-disable-injectsvg");if(!l){var a,i,o,e,n,h=function(c,l){l.parentNode.insertBefore(c,l)};if(c&&!t.__iconfont__svg__cssinject__){t.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(c){console&&console.log(c)}}a=function(){var c,l=document.createElement("div");l.innerHTML=t._iconfont_svg_string_5043107,(l=l.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",l=l,(c=document.body).firstChild?h(l,c.firstChild):c.appendChild(l))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(a,0):(i=function(){document.removeEventListener("DOMContentLoaded",i,!1),a()},document.addEventListener("DOMContentLoaded",i,!1)):document.attachEvent&&(o=a,e=t.document,n=!1,d(),e.onreadystatechange=function(){"complete"==e.readyState&&(e.onreadystatechange=null,s())})}function s(){n||(n=!0,o())}function d(){try{e.documentElement.doScroll("left")}catch(c){return void setTimeout(d,50)}s()}})(window);
\ No newline at end of file
diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.json b/f/web-kboss/src/assets/css/iconfont/iconfont.json
index c79f7bd..619556c 100644
--- a/f/web-kboss/src/assets/css/iconfont/iconfont.json
+++ b/f/web-kboss/src/assets/css/iconfont/iconfont.json
@@ -5,6 +5,27 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "1304892",
+      "name": "右箭头",
+      "font_class": "youjiantou",
+      "unicode": "e624",
+      "unicode_decimal": 58916
+    },
+    {
+      "icon_id": "1305406",
+      "name": "上",
+      "font_class": "shang",
+      "unicode": "e63c",
+      "unicode_decimal": 58940
+    },
+    {
+      "icon_id": "1305407",
+      "name": "下",
+      "font_class": "xia",
+      "unicode": "e63d",
+      "unicode_decimal": 58941
+    },
     {
       "icon_id": "1306",
       "name": "购物车空",
diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.ttf b/f/web-kboss/src/assets/css/iconfont/iconfont.ttf
index b894936..a0bd0b7 100644
Binary files a/f/web-kboss/src/assets/css/iconfont/iconfont.ttf and b/f/web-kboss/src/assets/css/iconfont/iconfont.ttf differ
diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.woff b/f/web-kboss/src/assets/css/iconfont/iconfont.woff
index 4d7fd20..99bbe8d 100644
Binary files a/f/web-kboss/src/assets/css/iconfont/iconfont.woff and b/f/web-kboss/src/assets/css/iconfont/iconfont.woff differ
diff --git a/f/web-kboss/src/assets/css/iconfont/iconfont.woff2 b/f/web-kboss/src/assets/css/iconfont/iconfont.woff2
index 7d6499d..b0a7d17 100644
Binary files a/f/web-kboss/src/assets/css/iconfont/iconfont.woff2 and b/f/web-kboss/src/assets/css/iconfont/iconfont.woff2 differ
diff --git a/f/web-kboss/src/components/FloatingBox/FloatingBox.vue b/f/web-kboss/src/components/FloatingBox/FloatingBox.vue
index 048e66d..c656f2f 100644
--- a/f/web-kboss/src/components/FloatingBox/FloatingBox.vue
+++ b/f/web-kboss/src/components/FloatingBox/FloatingBox.vue
@@ -6,153 +6,16 @@
 
         <transition name="slide">
           <div v-show="windowsHidden" style="font-size: 14px">
-            <div class="new-floating" style="z-index: 99;">
-              <img src="./img/head.png" alt="">
-              <div class="cloud-contact-us " @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave">
-                <!--                <span class="cloud-contact-us-i"></span>-->
-                <span> 售</span>
-                <span> 前</span>
-                <span> 咨</span>
-                <span> 询</span>
-              </div>
-              <!--              <div class="cart-entry-wrapper" @click="tryUse">-->
-              <!--                <el-tooltip class="item" effect="light" content="申请试用" placement="left">-->
-              <!--                  <div class="cart-entry">-->
-              <!--                    <span class="cart-icon"></span>-->
-              <!--                  </div>-->
-              <!--                </el-tooltip>-->
-
-              <!--              </div>-->
-              <div @click="open2"
-
-                   style="position:absolute;bottom:-40px;display: flex;justify-content: center;align-items: center;cursor: pointer">
-                   <!-- 摄像头 -->
-                <!-- <el-tooltip     v-if="getHomePath()!=='/ncmatchHome/index'" class="item" effect="light" content="联系销售" placement="left">
-                                             <span class="el-icon-video-camera"
-                                                   style="font-weight: 550;font-size: 22px;"></span>
-                </el-tooltip> -->
-
-                <!--              </div>-->
-                <!--              <div class="cart-entry-wrapper" style="visibility: visible;">-->
-                <!--                <div class="cart-entry" data-track-category="购物车浮层" data-track-name="入口点击"-->
-                <!--                     data-track-action="click"><span class="cart-icon"></span></div>-->
-                <!--                <span class="cart-icon"></span>-->
-              </div>
-
-            </div>
-
-            <!--            <div class="floating-box" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave"-->
-            <!--                 style="cursor: default;">-->
-            <!--              <span>联系我们</span>-->
-            <!--            </div>-->
-            <!--            <div class="floating-box1" @click="tryUse">-->
-
-            <!--              <span>申请试用</span>-->
-            <!--            </div>-->
-          </div>
-        </transition>
-
-
-        <!--        <transition name="slide">-->
-        <!--          <div v-show="windowsHidden">-->
-        <!--            <div class="floating-box" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave"-->
-        <!--                 style="cursor: default;">-->
-        <!--              <i class="el-icon-s-comment"></i>-->
-        <!--              <span>联系我们</span>-->
-        <!--            </div>-->
-        <!--            <div class="floating-box1" @click="tryUse">-->
-        <!--              <i class="el-icon-s-order"></i>-->
-        <!--              <span>申请试用</span>-->
-        <!--            </div>-->
-        <!--          </div>-->
-        <!--        </transition>-->
-
-        <div v-if="false" @click="windowsHidden=!windowsHidden" class="floating-box1 hiddenBtn"
-             style="width: 50px;height: 50px;border-radius:50%;bottom: 30px;background-color: #f1e9e9;color: blue">
-          <i class="el-icon-arrow-right" style="color: blue" v-show="windowsHidden"></i>
-          <i class="el-icon-arrow-left" style="color: blue" v-show="!windowsHidden"></i>
-        </div>
-
-
-        <transition name="el-zoom-in-top">
-          <!--isShow&&windowsHidden -->
-          <div v-show="isShow&&windowsHidden" class="cloud-contact-us-spread-container" style="z-index: 9">
-            <ul class="cloud-contact-us-spread" style="padding-left: 15px;">
-              <li class="cloud-contact-us-tel" style="height: 90px;">
-                <div style="display: flex;justify-content: center;align-items: center;padding-top: 15px">
-                  <div data-track-action="click" data-track-category="右侧公共悬浮区" data-track-name="售前咨询"
-                       data-agl-cvt="5"
-                       style="height: 100%;display: flex;justify-content: center;align-items: center;flex-direction: column;">
-                    <div
-                      style="margin-left: -50px;width: 100px;height: 30px;display: flex;justify-content: center;align-items: center">
-                      <span style="margin-right: 5px;margin-top: 17px;height: 35px;"
-                            class="cloud-contact-us-icon"></span>
-                      <p class="cloud-contact-us-tit" style="font-size: 14px;">售前咨询</p>
-                    </div>
-                    <div style="display: flex;justify-content: center;align-items: center;"
-                    >
-                      <div v-if="!phone"
-                           style="width: 80px;height: 25px;display: flex!important;justify-content: center;align-items: center">
-                        <el-skeleton
-                          style="width: 100%;padding: 0;margin: 0;height: 100%;margin-top: -25px"
-                          :rows="1"
-                          animated/>
-                      </div>
-                      <p v-else class="cloud-contact-us-con" style="font-size: 12px;height: 20px;margin-top: 5px">
-                        {{ phone }}</p></div>
-                  </div>
-                  <div v-if="false" style="width: 90px;height: 90px;">
-                    <div class="img"
-                         style="width: 90px;height: 90px; display: flex;justify-content: center;align-items: center"
-                    >
-                      <el-skeleton style="width: 80px;height: 80px;" :loading="loading" animated
-                                   v-if="isShowPicLoading">
-                        <template slot="template">
-                          <el-skeleton-item
-                            variant="image"
-                            style="width: 80px; height:80px ;"
-                          />
-                        </template>
-                      </el-skeleton>
-                      <img style="width: 80px;height: 80px;" v-else @load="onImageLoad" :src="src" alt="">
-                    </div>
-                  </div>
+            <div class="floating-consult">
+              <a href="#" class="floating-consult-btn primary" @click.prevent="openAiConsult">
+                <div class="floating-consult-icon">
+                  <img src="./img/ocai.jpg" alt="在线咨询">
+                  <span class="consult-badge"></span>
                 </div>
-              </li>
-
-            </ul>
+                <span class="floating-consult-text">在线咨询</span>
+              </a>
+            </div>
           </div>
-
-
-          <!--          <div class="dialog" v-if="false"-->
-          <!--               style="display: flex;justify-content: space-around;">-->
-          <!--            <div class="phone">-->
-          <!--              <span class="sonOne">业务咨询</span>-->
-          <!--              <span class="sonTwo">生态合作总监</span>-->
-          <!--              <span class="sonThree" style="display: flex;">-->
-          <!--                          电话:-->
-          <!--                     <el-skeleton style="width: 120px" animated v-if="isShowPicLoading">-->
-          <!--              <template slot="template">-->
-          <!--                <el-skeleton-item variant="image" style="width: 70px; height: 20px;"/>-->
-          <!--              </template>-->
-          <!--            </el-skeleton>-->
-          <!--                                          <span v-else>{{ phone }}</span>-->
-
-          <!--                        </span>-->
-          <!--            </div>-->
-          <!--            <div class="img" style="display: flex;justify-content: center;align-items: center"-->
-          <!--            >-->
-          <!--              <el-skeleton style="width: 100%" :loading="loading" animated v-if="isShowPicLoading">-->
-          <!--                <template slot="template">-->
-          <!--                  <el-skeleton-item-->
-          <!--                    variant="image"-->
-          <!--                    style="width: 100px; height:100px ;"-->
-          <!--                  />-->
-          <!--                </template>-->
-          <!--              </el-skeleton>-->
-          <!--              <img v-else @load="onImageLoad" :src="src" alt="">-->
-          <!--            </div>-->
-          <!--          </div>-->
         </transition>
 
 
@@ -381,6 +244,9 @@ export default {
     open2() {
       this.isShowChangeChat = true
     },
+    openAiConsult() {
+      window.dispatchEvent(new CustomEvent('kboss-open-ai-chat'))
+    },
     //关闭弹窗
     closeWindow() {
       this.isShowChangeChat = false
@@ -967,10 +833,6 @@ export default {
   margin-top: 2px;
   width: 20px;
   background-position: -100px 0;
-
-  &:hover {
-
-  }
 }
 
 .el-icon-video-camera {
@@ -1014,6 +876,67 @@ export default {
   opacity: 0;
 }
 
+.floating-consult {
+  position: fixed;
+  right: 18px;
+  bottom: 128px;
+  z-index: 100;
+}
+
+.floating-consult-btn {
+  display: inline-flex;
+  align-items: center;
+  flex-direction: column;
+  text-decoration: none;
+  background: #ffffff;
+  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14);
+  transition: all 0.25s ease;
+}
+
+.floating-consult-btn:hover {
+  transform: translateY(-3px);
+  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
+}
+
+.floating-consult-btn.primary {
+  width: 56px;
+  padding: 12px 8px;
+  border-radius: 28px;
+  gap: 8px;
+}
+
+.floating-consult-icon {
+  position: relative;
+  width: 36px;
+  height: 36px;
+}
+
+.floating-consult-icon img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  border-radius: 50%;
+}
+
+.consult-badge {
+  position: absolute;
+  top: -2px;
+  right: -2px;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  border: 2px solid #fff;
+  background: #ef4444;
+}
+
+.floating-consult-text {
+  writing-mode: vertical-rl;
+  text-orientation: mixed;
+  font-size: 12px;
+  color: #1f2937;
+  letter-spacing: 2px;
+}
+
 
 </style>
 <style>
diff --git a/f/web-kboss/src/components/FloatingBox/img/ocai.jpg b/f/web-kboss/src/components/FloatingBox/img/ocai.jpg
new file mode 100644
index 0000000..89fd9af
Binary files /dev/null and b/f/web-kboss/src/components/FloatingBox/img/ocai.jpg differ
diff --git a/f/web-kboss/src/components/MessageCenter/MessageCenter.vue b/f/web-kboss/src/components/MessageCenter/MessageCenter.vue
index 939b31d..b465570 100644
--- a/f/web-kboss/src/components/MessageCenter/MessageCenter.vue
+++ b/f/web-kboss/src/components/MessageCenter/MessageCenter.vue
@@ -790,4 +790,228 @@ export default {
 ::v-deep .el-drawer__body {
   overflow: auto;
 }
+
+/* 新版站内信视觉优化 */
+.drawer,
+.drawerMobile {
+  ::v-deep .el-drawer {
+    background: #f5f8ff;
+    box-shadow: -18px 0 48px rgba(15, 23, 42, 0.16);
+  }
+}
+
+.drawer {
+  ::v-deep .el-drawer {
+    width: 64% !important;
+    min-width: 860px;
+    border-radius: 24px 0 0 24px;
+    overflow: hidden;
+  }
+}
+
+.drawerMobile {
+  ::v-deep .el-drawer {
+    border-radius: 18px 0 0 18px;
+    overflow: hidden;
+  }
+}
+
+.drawer ::v-deep .el-container,
+.drawerMobile ::v-deep .el-container {
+  background: transparent;
+}
+
+.aside {
+  background: linear-gradient(180deg, #eef5ff 0%, #f8fbff 100%) !important;
+  border-right: 1px solid #e4ecf7;
+
+  .header {
+    height: 78px !important;
+    padding-left: 26px !important;
+    display: flex;
+    align-items: center;
+    background: transparent !important;
+    border-bottom: 0 !important;
+    color: #111827;
+    font-size: 20px !important;
+    line-height: 1.3 !important;
+    font-weight: 800 !important;
+  }
+
+  .title {
+    padding: 8px 14px;
+
+    div {
+      height: 44px !important;
+      margin-bottom: 8px;
+      padding-left: 16px !important;
+      display: flex;
+      align-items: center;
+      border-radius: 12px;
+      color: #5f6b7a;
+      font-size: 15px !important;
+      line-height: 44px !important;
+      font-weight: 600;
+      transition: all 0.2s ease;
+
+      &:hover {
+        background: rgba(30, 111, 255, 0.08) !important;
+        color: #1e6fff;
+      }
+
+      &.active {
+        background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%) !important;
+        color: #fff !important;
+        box-shadow: 0 10px 24px rgba(39, 90, 255, 0.2);
+      }
+    }
+  }
+}
+
+.content_box {
+  padding: 22px 26px !important;
+  background: #f8fbff !important;
+
+  .header {
+    height: auto !important;
+    padding: 0 0 18px !important;
+    border-bottom: 0 !important;
+    color: #111827 !important;
+    font-size: 24px !important;
+    line-height: 1.35 !important;
+    font-weight: 800 !important;
+  }
+
+  .content {
+    padding: 0 !important;
+  }
+
+  .button {
+    margin-bottom: 16px !important;
+    padding: 14px 16px !important;
+    display: flex !important;
+    gap: 10px;
+    align-items: center;
+    border: 1px solid #edf1f7 !important;
+    border-radius: 16px;
+    background: #fff;
+    box-shadow: 0 10px 28px rgba(31, 45, 61, 0.05);
+  }
+
+  .msgtext {
+    margin: 4px 12px 12px;
+    padding: 16px 18px !important;
+    border: 1px solid #e8eef7;
+    border-radius: 14px !important;
+    background: #f7faff !important;
+    color: #4b5563 !important;
+    font-size: 14px;
+    line-height: 1.8 !important;
+  }
+}
+
+::v-deep .el-button {
+  border-radius: 999px;
+  font-weight: 600;
+}
+
+::v-deep .el-button--primary {
+  border-color: transparent;
+  background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+}
+
+::v-deep .el-button--danger {
+  border-color: #fee2e2;
+  background: #fff5f5;
+  color: #ef4444;
+
+  &:hover,
+  &:focus {
+    border-color: #fecaca;
+    background: #fee2e2;
+    color: #dc2626;
+  }
+}
+
+::v-deep .el-table {
+  border-radius: 18px;
+  overflow: hidden;
+  background: #fff;
+  box-shadow: 0 12px 32px rgba(31, 45, 61, 0.06);
+
+  &::before {
+    display: none;
+  }
+
+  th {
+    background: #f4f8ff !important;
+    color: #4b5563;
+    font-size: 14px;
+    font-weight: 700;
+  }
+
+  td {
+    border-bottom: 1px solid #edf1f7;
+    color: #344054;
+    font-size: 14px;
+  }
+
+  .el-table__row {
+    transition: background 0.2s ease;
+
+    &:hover > td {
+      background: #f7faff !important;
+    }
+  }
+
+  .el-table__expanded-cell {
+    background: #fff !important;
+  }
+}
+
+::v-deep .unReadColor td {
+  background: #eef5ff !important;
+  color: #111827;
+  font-weight: 600;
+
+  &:first-child {
+    position: relative;
+
+    &::before {
+      content: '';
+      position: absolute;
+      left: 0;
+      top: 50%;
+      width: 4px;
+      height: 28px;
+      border-radius: 0 999px 999px 0;
+      background: #1e6fff;
+      transform: translateY(-50%);
+    }
+  }
+}
+
+@media (max-width: 768px) {
+  .content_box {
+    padding: 16px !important;
+  }
+
+  .aside {
+    .header {
+      height: 64px !important;
+      padding-left: 14px !important;
+      font-size: 16px !important;
+    }
+
+    .title {
+      padding: 6px 8px;
+
+      div {
+        height: 40px !important;
+        padding-left: 10px !important;
+        font-size: 13px !important;
+      }
+    }
+  }
+}
 </style>
diff --git a/f/web-kboss/src/main.js b/f/web-kboss/src/main.js
index 9bfcc9e..1053179 100644
--- a/f/web-kboss/src/main.js
+++ b/f/web-kboss/src/main.js
@@ -3,7 +3,7 @@ import Vue from 'vue'
 import Cookies from 'js-cookie'
 import 'normalize.css/normalize.css' // a modern alternative to CSS resets
 
-import './assets/css/iconfont/iconfont.css'
+import '@/assets/css/iconfont/iconfont.css'
 
 import Element from 'element-ui'
 import './styles/element-variables.scss'
diff --git a/f/web-kboss/src/router/index.js b/f/web-kboss/src/router/index.js
index ce271dc..8be1313 100644
--- a/f/web-kboss/src/router/index.js
+++ b/f/web-kboss/src/router/index.js
@@ -65,7 +65,13 @@ export const constantRoutes = [
   {
     path: "/tokenMarket",
     name: "PublicTokenMarket",
-    component: () => import('@/views/product/allProduct/index.vue'),
+    redirect: to => ({
+      path: "/homePage/tokenMarket",
+      query: {
+        category: to.query.category || "TOKEN市集",
+        single: to.query.single || "1",
+      }
+    }),
     hidden: true,
     meta: {
       title: "TOKEN市集",
@@ -337,6 +343,12 @@ export const constantRoutes = [
       name: "homePageIndex",
       hidden: true,
       meta: { title: "首页", onCache: true },
+    }, {
+      path: "opc",
+      component: () => import("@/views/homePage/mainPage/OPC/index.vue"),
+      name: "homePageOPC",
+      hidden: true,
+      meta: { title: "OPC公共服务平台", onCache: true },
     }, {
       path: "computeMarket",
       component: () => import("@/views/homePage/computeMarket/index.vue"),
@@ -355,6 +367,12 @@ export const constantRoutes = [
       name: "trainPlatform",
       hidden: true,
       meta: { title: "训推平台", onCache: true },
+    }, {
+      path: "tokenMarket",
+      component: () => import("@/views/product/allProduct/index.vue"),
+      name: "homePageTokenMarket",
+      hidden: true,
+      meta: { title: "TOKEN市集", onCache: true },
     }, {
       path: "agentStore",
       component: () => import("@/views/homePage/agentStore"),
@@ -775,6 +793,13 @@ export const asyncRoutes = [
         hidden: true,
         meta: { title: "首页", fullPath: "/homePage/index" },
       },
+      {
+        path: "opc",
+        component: () => import("@/views/homePage/mainPage/OPC/index.vue"),
+        name: "homePageOPC",
+        hidden: true,
+        meta: { title: "OPC公共服务平台", fullPath: "/homePage/opc" },
+      },
       {
         path: "detail",
         component: () => import("@/views/homePage/detail/index.vue"),
diff --git a/f/web-kboss/src/views/homePage/about/index.vue b/f/web-kboss/src/views/homePage/about/index.vue
index 1a67109..6dcea01 100644
--- a/f/web-kboss/src/views/homePage/about/index.vue
+++ b/f/web-kboss/src/views/homePage/about/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div style="width: 100%;">
+  <div class="about-page" style="width: 100%;">
     <!-- Banner部分 -->
     <div class="banner">
       <div v-if="JSON.stringify(logoInfoNew) !== '{}'" style="font-size: 38px;">
diff --git a/f/web-kboss/src/views/homePage/agentStore/index.vue b/f/web-kboss/src/views/homePage/agentStore/index.vue
index bab4862..f55f144 100644
--- a/f/web-kboss/src/views/homePage/agentStore/index.vue
+++ b/f/web-kboss/src/views/homePage/agentStore/index.vue
@@ -168,5 +168,9 @@ export default {
 </script>
 
 <style scoped>
+.agent-store-page {
+  padding-top: 82px;
+}
+
 @import './agent.css';
 </style>
diff --git a/f/web-kboss/src/views/homePage/components/topBox/index.vue b/f/web-kboss/src/views/homePage/components/topBox/index.vue
index d39a91a..360eef8 100644
--- a/f/web-kboss/src/views/homePage/components/topBox/index.vue
+++ b/f/web-kboss/src/views/homePage/components/topBox/index.vue
@@ -1,95 +1,70 @@
 <template>
-  <div class="top-nav">
-    <!-- 顶部容器 -->
-    <div id="topContainer" class="container">
-      <!-- 统一显示logo和导航 -->
-      <div class="logo">
-        <!-- Logo图片，点击跳转首页 - 使用与goHome相同的逻辑 -->
-        <img v-if="JSON.stringify(logoInfoNew) !== '{}'" @click="goHome" style="cursor:pointer;"
-
-          class="logoImg" :src="(logoInfoNew.home && logoInfoNew.home.logoImg) || ''" alt="">
-
-
-        <!-- 主导航菜单 -->
-        <nav class="main-nav">
-          <div class="nav-list">
-            <!-- 首页 -->
-            <p :class="{ active: isActiveHome }">
-              <!-- 动态判断域名跳转首页 -->
-              <a @click="goHome">首页</a>
-            </p>
-            <!-- 产品与服务：鼠标移入显示子菜单 -->
-            <!-- <p @mouseleave="sildeOut" @mouseenter="sildeIn(product_service)">
-              <a>算力云</a>
-            </p> -->
-            <!-- 算力市场 -->
-            <p class="nav-hover" :class="{ active: $route.path.includes('/computeMarket') }" @click="$router.push('/homePage/computeMarket')">算力市场</p>
-            <p class="nav-hover" :class="{ active: isActiveTokenMarket }" @click="handleModelSquareClick">token市集</p>
-            <!-- 训推平台 -->
-            <p class="nav-hover" :class="{ active: $route.path.includes('/trainPlatform') }" @click="goTrainPlatform">训推平台</p>
-            <!-- 智能体商店 -->
-            <p class="nav-hover" :class="{ active: $route.path.includes('/agentStore') }" @click="goAgentStore">智能体商店</p>
-            <p class="nav-hover" @click="goYuanjing">元境</p>
-            <!-- 供需广场 -->
-            <p :class="{ active: $route.path.includes('/supply') }">
-              <a @click="$router.push('/ncmatchHome/supplyAndDemandSquare')">供需广场</a>
-            </p>
-            <!-- 关于我们 -->
-            <p :class="{ active: $route.path.includes('/about') }" @mouseleave="sildeOut"
-              @click="$router.push('/homePage/about')">
-              <a>关于我们</a>
-            </p>
-          </div>
-        </nav>
+  <div class="top-nav" @mouseleave="sildeOut">
+    <div class="top-nav-placeholder"></div>
+    <div id="topContainer" class="nav-container">
+      <div class="brand" @click="goHome">
+        <img
+          v-if="JSON.stringify(logoInfoNew) !== '{}'"
+          class="brand-logo"
+          :src="(logoInfoNew.home && logoInfoNew.home.logoImg) || ''"
+          alt=""
+        >
       </div>
 
-      <!-- 用户区域：登录/注册按钮和用户下拉菜单 -->
-      <div class="user-area">
-        <!-- AI -->
-        <i class="iconfont icon-AIzhushou functions" @click="handleAIClick"></i>
-        <!-- 客服 -->
-        <i class="iconfont icon-kefu functions" @click="handleServiceClick"></i>
-        <!-- 控制台按钮（已登录） -->
-        <a @click="goB" v-if="loginState" class="login-btn">控制台</a>
-        <!-- 消息 -->
-        <i class="iconfont icon-xiaoxi functions" @click="handleMessageClick"></i>
-        <!-- 登录按钮（未登录） -->
-        <a @click="$router.push({
-          path: '/login',
-          query: {
-            fromPath: 'homePage'
-          }
-        })" v-if="!loginState" class="login-btn">登录</a>
-        <!-- 注册按钮（未登录） -->
-        <a @click="$router.push('/registrationPage')" v-if="!loginState" class="register-btn">立即注册</a>
+      <nav class="site-nav">
+        <button type="button" class="nav-item" :class="{ active: isActiveHome }" @click.stop="goHome">首页</button>
+        <button
+          type="button"
+          class="nav-item nav-item--product"
+          :class="{ active: isShowPanel }"
+          @mouseenter="sildeIn(product_service)"
+          @click.stop="sildeIn(product_service)"
+        >
+          产品
+          <i class="iconfont" :class="isShowPanel ? 'icon-shang' : 'icon-xia'"></i>
+        </button>
+        <button type="button" class="nav-item" >案例</button>
+        <button type="button" class="nav-item">动态</button>
+      </nav>
 
-        <!-- 用户下拉菜单（已登录） -->
-        <el-dropdown v-if="loginState" @visible-change="handleShow"
-          class="avatar-container right-menu-item hover-effect nick-name-style" style="margin-right: 0" trigger="click">
-          <!-- 头像区域：仅作为下拉菜单触发器 -->
-          <div class="avatar-wrapper">
-            <i
-              style="font-size: 18px; color: #262626;font-weight: 400;cursor: pointer;display: flex;justify-content: flex-end;align-items: center">
-              <div class="imgUser"><img src="../../../../assets/image/user.png" alt=""></div>
-              {{ nick_name }}
-              <i id="resverIcon" class="el-icon-arrow-up el-icon--right resverIcon"></i>
-            </i>
-          </div>
-          <!-- 用户信息下拉菜单内容 -->
+      <div class="user-actions">
+        <i v-if="loginState" class="iconfont icon-xiaoxi functions" @click="handleMessageClick"></i>
+        <button v-if="loginState" type="button" class="console-link" @click="goB">控制台</button>
+
+        <button
+          v-if="!loginState"
+          type="button"
+          class="login-btn"
+          @click="$router.push({ path: '/login', query: { fromPath: 'homePage' } })"
+        >
+          登录
+        </button>
+        <button
+          v-if="!loginState"
+          type="button"
+          class="register-btn"
+          @click="$router.push('/registrationPage')"
+        >
+          立即注册
+        </button>
+
+        <el-dropdown
+          v-if="loginState"
+          @visible-change="handleShow"
+          class="avatar-container right-menu-item hover-effect nick-name-style"
+          trigger="click"
+        >
+          <button type="button" class="login-pill login-pill--user">
+            {{ nick_name || '控制台' }}
+            <i id="resverIcon" class="el-icon-arrow-up el-icon--right resverIcon"></i>
+          </button>
           <el-dropdown-menu slot="dropdown" style="width: 230px;font-size: 16px;" divided>
             <div style="display: flex;flex-direction: column;padding:15px 15px;background-color: #f0f2f5">
               <span style="font-weight: bold;font-size: 20px;margin-bottom: 5px;color: #333333">{{ nick_name }}</span>
               <span style="font-size: 12px;color:#666;display: flex;justify-content:flex-start;align-items: center"> ID:
-                <span ref="contentToCopy">
-                  {{
-                    userId
-                  }}
-                </span>
-                <svg @click="copyBtn" class="copy-btn" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"
-                  width="12" height="12" style="fill: #1019ab;">
-                  <path
-                    d="M394.666667 106.666667h448a74.666667 74.666667 0 0 1 74.666666 74.666666v448a74.666667 74.666667 0 0 1-74.666666 74.666667H394.666667a74.666667 74.666667 0 0 1-74.666667-74.666667V181.333333a74.666667 74.666667 0 0 1 74.666667-74.666666z m0 64a10.666667 10.666667 0 0 0-10.666667 10.666666v448a10.666667 10.666667 0 0 0 10.666667 10.666667h448a10.666667 10.666667 0 0 0 10.666666-10.666667V181.333333a10.666667 10.666667 0 0 0-10.666666-10.666666H394.666667z m245.333333 597.333333a32 32 0 0 1 64 0v74.666667a74.666667 74.666667 0 0 1-74.666667 74.666666H181.333333a74.666667 74.666667 0 0 1-74.666666-74.666666V394.666667a74.666667 74.666667 0 0 1 74.666666-74.666667h74.666667a32 32 0 0 1 0 64h-74.666667a10.666667 10.666667 0 0 0-10.666666 10.666667v448a10.666667 10.666667 0 0 0 10.666666 10.666666h448a10.666667 10.666667 0 0 0 10.666667-10.666666v-74.666667z"
-                    p-id="1521"></path>
+                <span ref="contentToCopy">{{ userId }}</span>
+                <svg @click="copyBtn" class="copy-btn" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="12" height="12" style="fill: #1019ab;">
+                  <path d="M394.666667 106.666667h448a74.666667 74.666667 0 0 1 74.666666 74.666666v448a74.666667 74.666667 0 0 1-74.666666 74.666667H394.666667a74.666667 74.666667 0 0 1-74.666667-74.666667V181.333333a74.666667 74.666667 0 0 1 74.666667-74.666666z m0 64a10.666667 10.666666 0 0 0-10.666667 10.666666v448a10.666667 10.666667 0 0 0 10.666667 10.666667h448a10.666667 10.666667 0 0 0 10.666666-10.666667V181.333333a10.666667 10.666667 0 0 0-10.666666-10.666666H394.666667z m245.333333 597.333333a32 32 0 0 1 64 0v74.666667a74.666667 74.666667 0 0 1-74.666667 74.666666H181.333333a74.666667 74.666667 0 0 1-74.666666-74.666666V394.666667a74.666667 74.666667 0 0 1 74.666666-74.666667h74.666667a32 32 0 0 1 0 64h-74.666667a10.666667 10.666667 0 0 0-10.666666 10.666667v448a10.666667 10.666667 0 0 0 10.666666 10.666666h448a10.666667 10.666667 0 0 0 10.666667-10.666666v-74.666667z"></path>
                 </svg>
               </span>
             </div>
@@ -116,57 +91,77 @@
       </div>
     </div>
 
-    <!-- 悬浮面板 -->
-    <div @mouseleave="sildeOut" @mouseenter="keepPanel" v-show="isShowPanel" class="panel">
-      <div class="inPanel">
-        <div class="panelLeft">
-          <ul class="outUl">
-            <li style="cursor: default" class="outLi" v-for="item in showPanelData" :key="item.firTitle">
-              <span
-                :style="{ cursor: isPanelFirClickable(item) ? 'pointer' : 'default' }"
-                :class="['tilte', 'activeFir']"
-                @click="handlePanelFirClick(item)"
-              >
-                {{
-                  item.firTitle
-                }}
+    <div v-show="isShowPanel" class="product-panel" @mouseenter="keepPanel" @mouseleave="sildeOut">
+      <aside class="product-panel__side">
+        <button type="button" class="product-side-item active">精选产品</button>
+        <button type="button" class="product-side-item" @click="navigateTo('/homePage/opc')">OPC</button>
+        <button type="button" class="product-side-item" @click="goComputeMarket">算力市场</button>
+        <button type="button" class="product-side-item" @click="handleModelSquareClick">Token市集</button>
+        <button type="button" class="product-side-item" @click="goTrainPlatform">训推平台</button>
+        <button type="button" class="product-side-item" @click="goAgentStore">智能体商店</button>
+        <button type="button" class="product-side-item" @click="goSupplySquare">供需广场</button>
+      </aside>
+      <div class="product-panel__content">
+        <div class="product-panel__head">
+          <div>
+            <h3 class="product-panel__title">精选产品</h3>
+            <p>覆盖模型服务、算力资源、智能体应用与供需协同</p>
+          </div>
+          <button type="button" class="product-panel__more" @click="navigateTo('/homePage/opc')">查看 OPC</button>
+        </div>
+        <div class="product-group">
+          <h4>核心服务</h4>
+          <div class="product-grid">
+            <button type="button" class="product-card product-card--blue" @click="handleModelSquareClick">
+              <span class="product-card__icon">T</span>
+              <span class="product-card__text">
+                <strong>Token市集</strong>
+                <em>一站式 AI 模型交易与服务平台</em>
               </span>
-              <ul class="inUl">
-                <li class="inLi" v-for="i in item.secMenu" :key="i.id">
-                  <span style="position: relative" @mouseenter="sildeSecMenu(i)"
-                    :class="['twoMenuStyle', secId === i.id ? 'activeSec' : '']">{{ i.secTitle }}</span>
-                </li>
-              </ul>
-            </li>
-          </ul>
+            </button>
+            <button type="button" class="product-card product-card--purple" @click="goYuanjing">
+              <span class="product-card__icon">AI</span>
+              <span class="product-card__text">
+                <strong>创镱工坊</strong>
+                <em>AI 驱动的创意影像创作平台</em>
+              </span>
+            </button>
+            <button type="button" class="product-card product-card--green" @click="navigateTo('/homePage/opc')">
+              <span class="product-card__icon">OPC</span>
+              <span class="product-card__text">
+                <strong>云枢基座</strong>
+                <em>企业级 AI 基础设施与算力底座</em>
+              </span>
+            </button>
+          </div>
         </div>
-        <span class="ge"></span>
-        <div
-          v-if="secMenuData.length > 0 && secMenuData[0].thrMenu && secMenuData[0].thrMenu.length > 0 && secMenuData[0].thrMenu[0].thrTitle != null && secMenuData[0].secTitle !== secMenuData[0].thrMenu[0].thrTitle"
-          class="panelLeft">
-          <ul>
-            <li style="font-size: 14px!important;" @mouseenter="sildeThrMenu(thr)" v-for="(thr, index) in threeData"
-              :key="index">
-              {{ thr.thrTitle }}
-            </li>
-          </ul>
-        </div>
-        <span
-          v-if="secMenuData.length > 0 && secMenuData[0].thrMenu && secMenuData[0].thrMenu.length > 0 && secMenuData[0].thrMenu[0].thrTitle != null && secMenuData[0].secTitle !== secMenuData[0].thrMenu[0].thrTitle"
-          class="ge"></span>
-        <div class="panelRight"
-          v-if="showPanelRightData.length > 0 && showPanelRightData[0] && showPanelRightData[0].value">
-          <ul class="leastMenu inBox">
-            <li class="clickItem" style="font-size: 14px!important;margin: 8px 0;cursor: pointer"
-              v-for="itemR in showPanelRightData[0].value" :key="itemR.id" @click="clickGo(itemR)">
-              {{ itemR.name }} <span v-if="itemR.discount" class="zhe">{{
-                itemR.discount }}折</span>
-            </li>
-          </ul>
-        </div>
-        <div class="panelRight" v-else>
-          <div style="text-align: center; color: #999; padding: 20px;">
-            暂无数据
+        <div class="product-group product-group--compact">
+          <h4>应用入口</h4>
+          <div class="product-grid product-grid--compact">
+            <button type="button" class="product-card product-card--plain" @click="goComputeMarket">
+              <span class="product-card__text">
+                <strong>算力市场</strong>
+                <em>高性能算力资源灵活选购</em>
+              </span>
+            </button>
+            <button type="button" class="product-card product-card--plain" @click="goTrainPlatform">
+              <span class="product-card__text">
+                <strong>训推平台</strong>
+                <em>AI 模型全流程开发体验</em>
+              </span>
+            </button>
+            <button type="button" class="product-card product-card--plain" @click="goAgentStore">
+              <span class="product-card__text">
+                <strong>智能体商店</strong>
+                <em>即开即用的智能体服务</em>
+              </span>
+            </button>
+            <button type="button" class="product-card product-card--plain" @click="goSupplySquare">
+              <span class="product-card__text">
+                <strong>供需广场</strong>
+                <em>资源、算力、服务供需匹配</em>
+              </span>
+            </button>
           </div>
         </div>
       </div>
@@ -296,7 +291,7 @@ export default Vue.extend({
       messageCenterVisible: false,
       homePath: getHomePath(),
       isShowKbossCharge: false,
-      role: sessionStorage.getItem("jueseNew") == "admin" ? [] : sessionStorage.getItem("jueseNew"),
+      role: sessionStorage.getItem("jueseNew") == "admin" ? "" : (sessionStorage.getItem("jueseNew") || ""),
       userId: sessionStorage.getItem("userId"),
       firId: "",
       secId: "",
@@ -325,17 +320,44 @@ export default Vue.extend({
     if (sessionStorage.getItem("username")) {
       this.nick_name = sessionStorage.getItem("username");
     }
+
+    // ===== 强制透明背景（导航栏 + 页面根元素） =====
     this.$nextTick(() => {
+      // 1. 导航栏强制透明
       const topContainer = document.getElementById('topContainer');
       if (topContainer) {
+        topContainer.style.background = 'transparent';
+        topContainer.style.backgroundColor = 'transparent';
+        topContainer.style.backgroundImage = 'none';
         topContainer.scrollIntoView({
           behavior: 'smooth',
           block: 'start'
         });
       }
+      // 父容器和占位符
+      const nav = document.querySelector('.top-nav');
+      if (nav) {
+        nav.style.background = 'transparent';
+        nav.style.backgroundColor = 'transparent';
+        nav.style.backgroundImage = 'none';
+      }
+      const placeholder = document.querySelector('.top-nav-placeholder');
+      if (placeholder) {
+        placeholder.style.background = 'transparent';
+        placeholder.style.backgroundColor = 'transparent';
+        placeholder.style.backgroundImage = 'none';
+      }
+
+      // 2. 页面背景强制透明（关键！解决根本问题）
+      document.body.style.background = 'transparent';
+      document.body.style.backgroundColor = 'transparent';
+      document.documentElement.style.background = 'transparent';
+      document.documentElement.style.backgroundColor = 'transparent';
     });
+    window.addEventListener('kboss-open-ai-chat', this.handleExternalAIOpen);
   },
   beforeDestroy() {
+    window.removeEventListener('kboss-open-ai-chat', this.handleExternalAIOpen);
     this.stopAIPanelDrag()
   },
   computed: {
@@ -361,11 +383,9 @@ export default Vue.extend({
     username() {
       return sessionStorage.getItem('username') || '';
     },
-    // 判断当前是否为ncmatch.cn域名
     isNcmatchDomain() {
       return window.location.hostname.includes('ncmatch.cn');
     },
-    // 首页激活状态计算
     isActiveHome() {
       if (this.isNcmatchDomain) {
         return this.$route.path.includes('/ncmatchHome/index');
@@ -382,7 +402,6 @@ export default Vue.extend({
       if (this.aiPanelPosition.left === null || this.aiPanelPosition.top === null) {
         return {}
       }
-
       return {
         left: `${this.aiPanelPosition.left}px`,
         top: `${this.aiPanelPosition.top}px`,
@@ -392,43 +411,38 @@ export default Vue.extend({
     }
   },
   methods: {
-    // 点击 TOKEN 市集：未登录也允许进入，但按单页面模式展示。
+    navigateTo(path) {
+      this.$store.commit('setShowHomeNav', false)
+      if (this.$route.path === path) return
+      this.$router.push(path)
+    },
     handleModelSquareClick() {
-      if (!this.loginState) {
-        this.$router.push({
-          path: '/tokenMarket',
-          query: {
-            category: 'TOKEN市集',
-            single: '1'
-          }
-        })
-        return
-      }
+      this.$store.commit('setShowHomeNav', false)
       this.$router.push({
-        path: '/product',
+        path: '/homePage/tokenMarket',
         query: {
-          category: 'TOKEN市集'
+          category: 'TOKEN市集',
+          single: '1'
         }
       })
     },
-
-    // 跳转算力市场
     goComputeMarket() {
-      this.$router.push('/homePage/computeMarket')
+      this.navigateTo('/homePage/computeMarket')
     },
-
-    // 跳转训推平台
     goTrainPlatform() {
-      this.$router.push('/homePage/trainPlatform')
+      this.navigateTo('/homePage/trainPlatform')
     },
-
-    // 跳转智能体商店
     goAgentStore() {
-      this.$router.push('/homePage/agentStore')
+      this.navigateTo('/homePage/agentStore')
+    },
+    goSupplySquare() {
+      this.navigateTo('/ncmatchHome/supplyAndDemandSquare')
+    },
+    goAbout() {
+      this.navigateTo('/homePage/about')
     },
-
-    // 跳转元境
     async goYuanjing() {
+      this.$store.commit('setShowHomeNav', false)
       const yuanJingBaseUrl = window.location.origin === 'https://dev.opencomputing.cn'
         ? 'https://aidev.opencomputing.cn'
         : 'https://ai.opencomputing.cn'
@@ -436,52 +450,33 @@ export default Vue.extend({
         window.open(`${yuanJingBaseUrl}/`, '_blank')
         return
       }
-
       const yuanJingWindow = window.open('', '_blank')
-
       try {
         const res = await gotoYuanJingAPI({
           user_id: sessionStorage.getItem('userId')
         })  
-
         const deerer = this.getYuanJingAuthorization(res)
-
         if (!deerer) {
-          if (yuanJingWindow) {
-            yuanJingWindow.close()
-          }
+          if (yuanJingWindow) yuanJingWindow.close()
           this.$message.error((res && res.msg) || '获取元境授权参数失败')
           return
         }
-
         const loginUrl = `${yuanJingBaseUrl}/#/getCookie?deerer=${encodeURIComponent(deerer)}`
-
         if (yuanJingWindow) {
           yuanJingWindow.location.href = loginUrl
         } else {
           window.location.href = loginUrl
         }
       } catch (error) {
-        if (yuanJingWindow) {
-          yuanJingWindow.close()
-        }
+        if (yuanJingWindow) yuanJingWindow.close()
         this.$message.error('跳转元境失败，请稍后重试')
       }
     },
     getYuanJingAuthorization(res) {
-      if (!res) {
-        return '' 
-      }
-
-      if (typeof res === 'string') {
-        return res
-      }
-
+      if (!res) return '' 
+      if (typeof res === 'string') return res
       const data = res.data || res
-      if (typeof data === 'string') {
-        return data
-      }
-
+      if (typeof data === 'string') return data
       return data.Authorization || data.authorization || data.token || data.header || data.value || ''
     },
     isPanelFirClickable(item) {
@@ -495,13 +490,11 @@ export default Vue.extend({
         this.goYuanjing()
         return
       }
-
       if (title === 'TOKEN市集' || title === 'token市集') {
         this.$store.commit('setShowHomeNav', false)
         this.handleModelSquareClick()
       }
     },
-    // 处理AI助手点击
     handleAIClick() {
       this.aiDialogVisible = true
       this.$nextTick(() => {
@@ -509,226 +502,146 @@ export default Vue.extend({
         this.scrollAIChatToBottom()
       })
     },
-
+    handleExternalAIOpen() {
+      this.handleAIClick()
+    },
     closeAIPanel() {
       this.aiDialogVisible = false
       this.stopAIPanelDrag()
     },
-
     resetAIChat() {
       this.aiMessages = []
       this.aiInput = ''
     },
-
     useAISuggestion(question) {
       this.sendAIMessage(question)
     },
-
     initAIPanelPosition() {
-      if (this.aiPanelPosition.left !== null && this.aiPanelPosition.top !== null) {
-        return
-      }
-
+      if (this.aiPanelPosition.left !== null && this.aiPanelPosition.top !== null) return
       const panel = this.$refs.aiChatPanel
       if (!panel) return
-
       const panelWidth = panel.offsetWidth || 380
       const panelHeight = panel.offsetHeight || 620
-
       this.aiPanelPosition = {
         left: Math.max(window.innerWidth - panelWidth - 24, 16),
         top: Math.max(window.innerHeight - panelHeight - 24, 16)
       }
     },
-
     startAIPanelDrag(event) {
       if (event.button !== 0) return
-      if (event.target && event.target.closest('.ai-chat-panel__close')) {
-        return
-      }
-
+      if (event.target && event.target.closest('.ai-chat-panel__close')) return
       const panel = this.$refs.aiChatPanel
       if (!panel) return
-
       const rect = panel.getBoundingClientRect()
       this.aiPanelDragging = true
       this.aiPanelDragOffset = {
         x: event.clientX - rect.left,
         y: event.clientY - rect.top
       }
-
       window.addEventListener('mousemove', this.handleAIPanelDrag)
       window.addEventListener('mouseup', this.stopAIPanelDrag)
       document.body.style.userSelect = 'none'
     },
-
     handleAIPanelDrag(event) {
       if (!this.aiPanelDragging) return
-
       const panel = this.$refs.aiChatPanel
       if (!panel) return
-
       const panelWidth = panel.offsetWidth || 380
       const panelHeight = panel.offsetHeight || 620
-      const minLeft = 0
-      const minTop = 0
+      const minLeft = 0, minTop = 0
       const maxLeft = Math.max(window.innerWidth - panelWidth, 0)
       const maxTop = Math.max(window.innerHeight - panelHeight, 0)
-
       const nextLeft = event.clientX - this.aiPanelDragOffset.x
       const nextTop = event.clientY - this.aiPanelDragOffset.y
-
       this.aiPanelPosition = {
         left: Math.min(Math.max(nextLeft, minLeft), maxLeft),
         top: Math.min(Math.max(nextTop, minTop), maxTop)
       }
     },
-
     stopAIPanelDrag() {
       this.aiPanelDragging = false
       window.removeEventListener('mousemove', this.handleAIPanelDrag)
       window.removeEventListener('mouseup', this.stopAIPanelDrag)
       document.body.style.userSelect = ''
     },
-
     handleAIKeydown(event) {
       if (event.key === 'Enter' && !event.shiftKey) {
         event.preventDefault()
         this.sendAIMessage()
       }
     },
-
     async sendAIMessage(quickQuestion) {
       const message = (quickQuestion || this.aiInput).trim()
       if (!message || this.aiLoading) return
-
-      this.aiMessages.push({
-        role: 'user',
-        content: message
-      })
+      this.aiMessages.push({ role: 'user', content: message })
       this.aiInput = ''
-
       const loadingMessageIndex = this.aiMessages.push({
         role: 'assistant',
         content: '[正在检索并生成回答...]'
       }) - 1
-
       this.aiLoading = true
-      this.$nextTick(() => {
-        this.scrollAIChatToBottom()
-      })
-
+      this.$nextTick(() => this.scrollAIChatToBottom())
       try {
         const response = await reqAIChat({ message }, (content) => {
           if (!content) return
-
-          this.$set(this.aiMessages, loadingMessageIndex, {
-            role: 'assistant',
-            content
-          })
-          this.$nextTick(() => {
-            this.scrollAIChatToBottom()
-          })
+          this.$set(this.aiMessages, loadingMessageIndex, { role: 'assistant', content })
+          this.$nextTick(() => this.scrollAIChatToBottom())
         })
-
         if (response && response.content) {
-          this.$set(this.aiMessages, loadingMessageIndex, {
-            role: 'assistant',
-            content: response.content
-          })
+          this.$set(this.aiMessages, loadingMessageIndex, { role: 'assistant', content: response.content })
         } else {
-          this.$set(this.aiMessages, loadingMessageIndex, {
-            role: 'assistant',
-            content: '暂时没有获取到回复，请稍后再试。'
-          })
+          this.$set(this.aiMessages, loadingMessageIndex, { role: 'assistant', content: '暂时没有获取到回复，请稍后再试。' })
         }
       } catch (error) {
-        this.$set(this.aiMessages, loadingMessageIndex, {
-          role: 'assistant',
-          content: '抱歉，当前服务繁忙，请稍后再试。'
-        })
+        this.$set(this.aiMessages, loadingMessageIndex, { role: 'assistant', content: '抱歉，当前服务繁忙，请稍后再试。' })
       } finally {
         this.aiLoading = false
-        this.$nextTick(() => {
-          this.scrollAIChatToBottom()
-        })
+        this.$nextTick(() => this.scrollAIChatToBottom())
       }
     },
-
     escapeAIHtml(content) {
       return String(content || '')
         .replace(/&/g, '&amp;')
         .replace(/</g, '&lt;')
         .replace(/>/g, '&gt;')
     },
-
     formatAIInline(content) {
       return this.escapeAIHtml(content).replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>')
     },
-
     formatAIContent(content) {
       if (!content) return ''
-
       const normalizedContent = String(content)
         .replace(/\r\n/g, '\n')
         .replace(/ {2,}/g, '\n')
         .replace(/\n{3,}/g, '\n\n')
-
       const lines = normalizedContent.split('\n')
-
       return lines.map((line) => {
         const trimmed = line.trim()
-
-        if (!trimmed) {
-          return '<div class="ai-chat__paragraph ai-chat__paragraph--space"></div>'
-        }
-
+        if (!trimmed) return '<div class="ai-chat__paragraph ai-chat__paragraph--space"></div>'
         if (/^-\s+/.test(trimmed)) {
           return `<div class="ai-chat__item"><span class="ai-chat__item-dot"></span><span>${this.formatAIInline(trimmed.replace(/^-\s+/, ''))}</span></div>`
         }
-
         if (/^\*\*(.+?)\*\*$/.test(trimmed)) {
           return `<div class="ai-chat__section-title">${this.formatAIInline(trimmed)}</div>`
         }
-
         return `<div class="ai-chat__paragraph">${this.formatAIInline(trimmed)}</div>`
       }).join('')
     },
-
     scrollAIChatToBottom() {
       const messageBox = this.$refs.aiChatMessages
-      if (messageBox) {
-        messageBox.scrollTop = messageBox.scrollHeight
-      }
+      if (messageBox) messageBox.scrollTop = messageBox.scrollHeight
     },
-
-    // 处理客服点击
-    handleServiceClick() {
-      this.$message.info({
-        message: '功能即将上线，敬请期待！',
-        duration: 3000,
-        showClose: true
-      });
-    },
-
-    // 处理消息图标点击
     handleMessageClick() {
       if (this.loginState) {
         this.messageCenterVisible = true;
-        if (this.$refs.messageCenter) {
-          this.$refs.messageCenter.open();
-        }
+        if (this.$refs.messageCenter) this.$refs.messageCenter.open();
       } else {
         this.handleGoLogin()
       }
     },
-
-    // 处理未读消息数量更新
     handleUnreadCountUpdate(count) {
       this.messageCount = count;
     },
-
-    // 控制台按钮点击事件
     goB() {
       if (sessionStorage.getItem('jueseNew').includes('客户')) {
         this.$router.push('/product/productHome')
@@ -744,8 +657,6 @@ export default Vue.extend({
         this.$router.push('/superAdministrator/addAdmin')
       }
     },
-
-    // 初始化Logo信息
     init() {
       let remoteUrl = ''
       if (window.location.href.includes("dev")) {
@@ -755,10 +666,7 @@ export default Vue.extend({
       } else {
         remoteUrl = 'https://www.kaiyuancloud.cn/reseller/get_ipc_logo.dspy'
       }
-
-      let params = {
-        url_link: window.location.href.split("#")[0]
-      }
+      let params = { url_link: window.location.href.split("#")[0] }
       getLogoAPI(params).then((res) => {
         if (res.status == true && res.data && res.data.length) {
           this.$store.commit('setLogoInfoNew', res.data[0].additional_msg);
@@ -766,7 +674,6 @@ export default Vue.extend({
           if (res.data[0].orgname == '中关村数智人工智能产业联盟') {
             this.logoUrlOut = 'https://www.ncmatch.cn'
           }
-
           this.photosUrl = res.data[0];
           if (this.photosUrl.orgname != '业主机构') {
             this.isLogo = true
@@ -777,15 +684,10 @@ export default Vue.extend({
             this.$store.commit('setLogo', "")
           }
         } else {
-          this.$message({
-            message: "获取ipc失败~",
-            type: "error",
-          });
+          this.$message({ message: "获取ipc失败~", type: "error" });
         }
       });
     },
-
-    // 退出登录
     async logout() {
       let redirectPath = ''
       if (this.$route && this.$route.fullPath && !this.$route.fullPath.includes('/login')) {
@@ -816,13 +718,9 @@ export default Vue.extend({
         query: redirectPath ? { redirect: redirectPath } : {}
       });
     },
-
-    // 修改密码
     edituserPassword() {
       this.passwordDialog = true;
     },
-
-    // 申请渠道管理
     channelFirstBtn() {
       reqApplyChannel({ user_id: this.userId }).then(res => {
         if (res.code == "100" || res.code == "210") {
@@ -834,13 +732,9 @@ export default Vue.extend({
         }
       })
     },
-
-    // 初始化余额
     initMybalance() {
       return sessionStorage.getItem('mybalance')
     },
-
-    // 复制用户ID
     copyBtn() {
       const textToCopy = this.$refs.contentToCopy.innerText;
       navigator.clipboard.writeText(textToCopy).then(() => {
@@ -849,8 +743,6 @@ export default Vue.extend({
         console.error('复制失败', error);
       });
     },
-
-    // 获取用户信息
     async getUserInfo() {
       if (!this.userId) return;
       getUserInfoAPI({ id: this.userId }).then((res) => {
@@ -858,15 +750,10 @@ export default Vue.extend({
           this.userInfoList = res.data;
           sessionStorage.setItem("orgid", res.data[0].orgid);
         } else {
-          this.$message({
-            message: res.msg,
-            type: "error",
-          });
+          this.$message({ message: res.msg, type: "error" });
         }
       });
     },
-
-    // 处理下拉菜单显示/隐藏时的图标旋转
     handleShow(isShow) {
       let resverNode = document.getElementById('resverIcon')
       if (isShow) {
@@ -878,15 +765,11 @@ export default Vue.extend({
         resverNode.style.transform = 'rotate(0)'
       }
     },
-
-    // 鼠标进入三级菜单项
     sildeThrMenu(item) {
       let res = []
       res.push(item)
       this.showPanelRightData = res
     },
-
-    // 点击菜单项进行跳转或打开新窗口
     clickGo(item) {
       this.$store.commit('setShowHomeNav', false)
       let userId = sessionStorage.getItem('userId')
@@ -899,66 +782,35 @@ export default Vue.extend({
           localStorage.setItem('userRescourseUrl', item.listUrl)
           this.$router.push({
             name: 'baiduProductShow',
-            params: {
-              listUrl: item.listUrl,
-              url: item.url
-            }
+            params: { listUrl: item.listUrl, url: item.url }
           })
         } else {
-          this.$router.push({
-            path: "/login",
-            query: {
-              fromPath: 'homePage',
-              type: 'bd',
-              listUrl: item.listUrl,
-              url: item.url
-            }
-          })
+          this.$router.push({ path: "/login", query: { fromPath: 'homePage', type: 'bd', listUrl: item.listUrl, url: item.url } })
         }
       } else if (item.type === '阿里云') {
         if (this.loginState) {
           reqNewHomeSync().then(response => {
             if (response.status) {
               reqNewHomeFestival().then(res => {
-                if (res.status) {
-                  window.open(res.data)
-                } else {
-                  this.$message.warning(res.msg)
-                }
+                if (res.status) window.open(res.data)
+                else this.$message.warning(res.msg)
               })
             } else {
               this.$message.warning(response.msg)
             }
           })
         } else {
-          this.$router.push({
-            path: "/login",
-            query: {
-              fromPath: 'homePage',
-              type: 'ali',
-            }
-          })
+          this.$router.push({ path: "/login", query: { fromPath: 'homePage', type: 'ali' } })
         }
       } else if (item.type === '智算' || item.type === '算力网络') {
         if (item.name === '容器云') {
           if (this.loginState) {
             this.$router.push('/product/productHome/k8s/createK8s')
           } else {
-            this.$router.push({
-              path: "/login",
-              query: {
-                fromPath: 'homePage',
-                type: 'rqy',
-              }
-            })
+            this.$router.push({ path: "/login", query: { fromPath: 'homePage', type: 'rqy' } })
           }
         } else {
-          this.$router.push({
-            path: '/homePage/detail',
-            query: {
-              id: item.id,
-            }
-          })
+          this.$router.push({ path: '/homePage/detail', query: { id: item.id } })
         }
       } else if (item.name === '灵医智能体') {
         this.$router.push('/homePage/hospital')
@@ -966,8 +818,6 @@ export default Vue.extend({
         this.$router.push('/homePage/customerService')
       }
     },
-
-    // 改变面板数据
     changeData(data) {
       this.showPanelData = data || []
       this.secMenuData = data?.[0]?.secMenu || []
@@ -980,18 +830,13 @@ export default Vue.extend({
             thrTitle: item.thrTitle || firstSecMenu.secTitle
           }))
         } else {
-          this.showPanelRightData = [{
-            thrTitle: firstSecMenu.secTitle,
-            value: []
-          }]
+          this.showPanelRightData = [{ thrTitle: firstSecMenu.secTitle, value: [] }]
         }
       } else {
         this.threeData = []
         this.showPanelRightData = []
       }
     },
-
-    // 初始化导航数据
     initData() {
       reqNavList({ url_link: window.location.href }).then(res => {
         if (res.status) {
@@ -1004,8 +849,6 @@ export default Vue.extend({
         this.changeData([])
       })
     },
-
-    // 构建导航数据结构
     buildData(data) {
       let res = [];
       data.forEach(item => {
@@ -1025,16 +868,11 @@ export default Vue.extend({
       });
       return data;
     },
-
-    // 鼠标进入二级菜单项
     sildeSecMenu(item) {
       this.secId = item.id
       if (!item.thrMenu || item.thrMenu.length === 0) {
         this.threeData = []
-        this.showPanelRightData = [{
-          thrTitle: item.secTitle,
-          value: []
-        }]
+        this.showPanelRightData = [{ thrTitle: item.secTitle, value: [] }]
         return
       }
       this.threeData = item.thrMenu.map(menu => ({
@@ -1043,76 +881,41 @@ export default Vue.extend({
       }))
       this.showPanelRightData = this.threeData
     },
-
-    // 返回测试数据
-    networkData() {
-      return networkData
-    },
-    storageData() {
-      return storageData
-    },
-    testData() {
-      return testData
-    },
-
-    // 鼠标进入一级菜单项
+    networkData() { return networkData },
+    storageData() { return storageData },
+    testData() { return testData },
     sildeItemIn(item) {
       this.firId = item.id
       this.secId = item.secMenu[0].id
       this.secMenuData = item.secMenu || []
       this.showPanelRightData = this.secMenuData[0].thrMenu || []
     },
-    computingData() {
-      return computingData
-    },
-
-    // 鼠标进入生态与合作菜单
+    computingData() { return computingData },
     sildeIn(item) {
       this.changeData(item)
-      if (this.hideTimer) {
-        clearTimeout(this.hideTimer)
-      }
+      if (this.hideTimer) clearTimeout(this.hideTimer)
       this.showTimer = setTimeout(() => {
         this.$store.commit('setShowHomeNav', true)
       }, 100)
     },
-
-    // 鼠标离开导航区域
     sildeOut() {
-      if (this.showTimer) {
-        clearTimeout(this.showTimer)
-      }
+      if (this.showTimer) clearTimeout(this.showTimer)
       this.hideTimer = setTimeout(() => {
         this.$store.commit('setShowHomeNav', false)
       }, 200)
     },
-
-    // 鼠标进入面板区域，取消隐藏
     keepPanel() {
-      if (this.hideTimer) {
-        clearTimeout(this.hideTimer)
-      }
+      if (this.hideTimer) clearTimeout(this.hideTimer)
     },
-
-    // 处理登录跳转逻辑
     handleGoLogin() {
       let token = this.$store.getters.token;
       if (!token) {
         this.$message.warning('请先登录哦~');
-        this.$router.push({
-          path: '/login'
-        });
+        this.$router.push({ path: '/login' });
       }
     },
-
-    // 首页跳转方法 - 根据域名判断跳转到不同的首页
     goHome() {
-      console.log('=== goHome 方法开始 ===');
-      console.log('当前完整URL:', window.location.href);
-      console.log('当前hostname:', window.location.hostname);
-      console.log('isNcmatchDomain判断结果:', this.isNcmatchDomain);
-      console.log('准备跳转的路径:', this.isNcmatchDomain ? '/ncmatchHome/index' : '/homePage/index');
-
+      this.$store.commit('setShowHomeNav', false)
       if (this.isNcmatchDomain) {
         this.$router.push('/ncmatchHome/index');
       } else {
@@ -1124,218 +927,392 @@ export default Vue.extend({
 </script>
 
 <style scoped lang="less">
+/* ===== 强制透明重置（最高优先级） ===== */
+.top-nav,
+.top-nav-placeholder,
+.nav-container {
+  background: transparent !important;
+  background-color: transparent !important;
+  background-image: none !important;
+  backdrop-filter: none !important;
+  -webkit-backdrop-filter: none !important;
+  box-shadow: none !important;
+}
+
 .top-nav {
-  font-size: 18px !important;
-
-  * {
-    font-size: 18px !important;
-  }
-
-  font-weight: 500;
-  color: #222F60 !important;
   position: relative;
-  background-color: #fff;
-  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08);
+  height: 0;
   width: 100%;
-  z-index: 1000;
+  min-width: 1200px;
+  color: #111827;
+  font-family: PingFang SC, Microsoft YaHei, Arial, sans-serif;
+  box-sizing: border-box;
+  
+}
 
-  .container {
-    font-size: 18px;
-    width: 100%;
-    height: 100%;
-    margin: 0 auto;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 14px 20px;
-  }
+.top-nav-placeholder {
+  display: block;
+  height: 0;
+  width: 100%;
+  flex-shrink: 0;
+  
+}
 
-  .logo {
-    display: flex;
-    align-items: center;
+.nav-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 3000;
+  width: 100%;
+  height: 82px;
+  padding: 0 42px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+}
 
-    .logoImg {
-      width: 148px;
-      cursor: pointer;
-      transition: opacity 0.3s ease;
+.brand {
+  display: inline-flex;
+  align-items: center;
+  min-width: 220px;
+  cursor: pointer;
+}
 
-      &:hover {
-        opacity: 0.8;
-      }
-    }
-  }
+.brand-logo {
+  width: 184px;
+  max-height: 52px;
+  object-fit: contain;
+  object-position: left center;
+  display: block;
+}
 
-  .main-nav {
-    margin-left: 44px;
-    z-index: 10000;
+.site-nav {
+  display: flex;
+  align-items: center;
+  gap: 38px;
+  margin-left: auto;
+  margin-right: 32px;
+}
 
-    .nav-list {
-      display: flex;
-      list-style: none;
-      margin: 0;
-      padding: 0;
-
-      p {
-        height: 100%;
-        padding-right: 40px;
-        position: relative;
-
-        &.nav-hover {
-          cursor: pointer;
-          transition: all 0.3s;
-
-          &:hover {
-            color: #1E6FFF;
-          }
-        }
-
-        &.nav-hover.active {
-          color: #1E6FFF;
-          font-weight: bold;
-        }
-
-        a {
-          text-decoration: none;
-          font-size: 18px !important;
-          padding: 5px 0;
-          transition: all 0.3s;
-          cursor: pointer;
-
-          &:hover {
-            color: #1E6FFF;
-          }
-        }
-
-        &.active a {
-          color: #1E6FFF;
-          font-weight: bold;
-        }
-      }
-    }
-  }
-
-  .user-area {
-    display: flex;
-    align-items: center;
-
-    .search-box {
-      display: flex;
-      align-items: center;
-      border: 2px solid #d2d7e6;
-      border-radius: 8px;
-      padding: 8px;
-
-      input {
-        margin-left: 10px;
-        border: 0;
-        outline: none;
-      }
-    }
-
-    a {
-      border-radius: 4px;
-      font-size: 14px;
-      text-decoration: none;
-      transition: all 0.3s;
-      cursor: pointer;
-    }
-
-    .login-btn {
-      margin-right: 20px;
-      color: #333;
-
-      &:hover {
-        color: #1E6FFF;
-      }
-    }
-
-    .register-btn {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
-      border-radius: 10px;
-      padding: 6px 10px;
-      color: white;
-
-      &:hover {
-        opacity: 0.9;
-      }
-    }
-
-    .icon-xiaoxi {
-      font-size: 24px !important;
-    }
-
-    .functions {
-      padding-right: 20px;
-      font-size: 20px;
-      color: #000;
-      cursor: pointer;
-
-      &:hover {
-        color: #1E6FFF;
-      }
-    }
+.nav-item {
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: #111827;
+  cursor: pointer;
+  font-size: 17px !important;
+  line-height: 82px;
+  font-weight: 600;
+  white-space: nowrap;
+  transition: color 0.2s ease;
 
+  &:hover,
+  &.active {
+    color: #1e6fff;
   }
 }
 
-.panel {
-  .inPanel {
-    padding: 20px;
-    border-radius: 8px;
-
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
-    height: calc(100vh - 100px);
-    background: #fff;
-    margin: 10px 20px 20px;
-    margin-left: 0;
-    margin-right: 0;
-    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
-    transition: opacity 0.3s ease;
-  }
-
-  display: flex;
-  flex-direction: column;
-
-  justify-content: flex-start;
+.nav-item--product {
+  display: inline-flex;
   align-items: center;
-  color: #091221;
-  position: absolute;
-  top: 84px;
+  gap: 6px;
+
+  .iconfont {
+    font-size: 13px !important;
+    line-height: 1;
+  }
+}
+
+.nav-lang {
+  color: #374151;
+  font-size: 15px !important;
+}
+
+.user-actions {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.functions {
+  color: #000;
+  cursor: pointer;
+  font-size: 20px !important;
+  line-height: 1;
+  transition: color 0.2s ease;
+
+  &:hover {
+    color: #1E6FFF;
+  }
+}
+
+.console-link {
+  height: 36px;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: #333;
+  cursor: pointer;
+  font-size: 15px !important;
+  font-weight: 600;
+  line-height: 36px;
+  transition: color 0.2s ease;
+
+  &:hover {
+    color: #1E6FFF;
+  }
+}
+
+.login-btn {
+  height: 36px;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: #333;
+  cursor: pointer;
+  font-size: 15px !important;
+  font-weight: 500;
+  line-height: 36px;
+  transition: color 0.2s ease;
+
+  &:hover {
+    color: #1E6FFF;
+  }
+}
+
+.register-btn {
+  height: 36px;
+  padding: 0 16px;
+  border: 0;
+  border-radius: 10px;
+  background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+  color: #fff;
+  cursor: pointer;
+  font-size: 15px !important;
+  font-weight: 600;
+  line-height: 36px;
+  transition: opacity 0.2s ease;
+
+  &:hover {
+    opacity: 0.9;
+  }
+}
+
+.login-pill {
+  min-width: 58px;
+  height: 36px;
+  padding: 0 20px;
+  border: 0;
+  border-radius: 999px;
+  background: #050505;
+  color: #fff;
+  cursor: pointer;
+  font-size: 15px !important;
+  font-weight: 600;
+  line-height: 36px;
+  transition: opacity 0.2s ease;
+
+  &:hover {
+    opacity: 0.84;
+  }
+}
+
+.login-pill--user {
+  max-width: 150px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.product-panel {
+  position: fixed;
+  top: 82px;
   left: 0;
-  width: calc(100% - 450px);
-  margin-left: 250px;
-  z-index: 999;
-  overflow-y: auto;
+  right: 0;
+  z-index: 2999;
+  min-height: 340px;
+  display: flex;
+  background: rgba(255, 255, 255, 0.98);
+  backdrop-filter: blur(14px);
+  box-shadow: 0 20px 46px rgba(15, 23, 42, 0.1);
+  border-top: 1px solid rgba(15, 23, 42, 0.04);
+}
 
-  .panelLeft {
-    height: 100% !important;
-    justify-content: stretch;
-    font-size: 14px !important;
-    width: 200px;
-    overflow-y: auto;
+.product-panel__side {
+  width: 210px;
+  padding: 20px 16px;
+  background: linear-gradient(180deg, #f4f8ff 0%, #f8fafc 100%);
+  box-sizing: border-box;
+}
 
-    li {
-      padding: 10px;
-      transition: background-color 0.3s;
+.product-side-item {
+  width: 100%;
+  height: 42px;
+  padding: 0 16px;
+  display: flex;
+  align-items: center;
+  border: 0;
+  border-radius: 12px;
+  background: transparent;
+  color: #374151;
+  cursor: pointer;
+  font-size: 14px !important;
+  text-align: left;
+  transition: all 0.2s ease;
 
-      &:hover {
-        cursor: pointer;
-        color: #1E6FFF;
-      }
-    }
+  &:hover,
+  &.active {
+    background: #e8f1ff;
+    color: #1e6fff;
+    font-weight: 600;
+  }
+}
+
+.product-panel__content {
+  flex: 1;
+  padding: 26px 46px 32px;
+  box-sizing: border-box;
+}
+
+.product-panel__head {
+  margin-bottom: 24px;
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+
+  p {
+    margin: 6px 0 0;
+    color: #667085;
+    font-size: 14px;
+    line-height: 1.6;
+  }
+}
+
+.product-panel__title {
+  margin: 0;
+  color: #111827;
+  font-size: 22px !important;
+  font-weight: 700;
+}
+
+.product-panel__more {
+  height: 34px;
+  padding: 0 16px;
+  border: 1px solid #dbeafe;
+  border-radius: 999px;
+  background: #f4f8ff;
+  color: #1e6fff;
+  cursor: pointer;
+  font-size: 14px !important;
+  font-weight: 600;
+}
+
+.product-group {
+  margin-bottom: 24px;
+
+  h4 {
+    margin: 0 0 14px;
+    color: #111827;
+    font-size: 16px !important;
+    font-weight: 700;
+  }
+}
+
+.product-group--compact {
+  margin-bottom: 0;
+}
+
+.product-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(180px, 1fr));
+  gap: 16px;
+}
+
+.product-grid--compact {
+  grid-template-columns: repeat(4, minmax(150px, 1fr));
+}
+
+.product-card {
+  min-height: 86px;
+  padding: 16px;
+  border: 1px solid #edf1f7;
+  border-radius: 16px;
+  background: #fff;
+  color: #111827;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  text-align: left;
+  font-size: 15px !important;
+  font-weight: 600;
+  line-height: 1.5;
+  box-shadow: 0 8px 22px rgba(31, 45, 61, 0.04);
+  transition: all 0.2s ease;
+
+  &:hover {
+    transform: translateY(-2px);
+    border-color: #cfe0ff;
+    box-shadow: 0 14px 28px rgba(30, 111, 255, 0.1);
   }
 
-  .panelRight {
-    flex: 1;
-    padding-left: 20px;
-    overflow-y: auto;
+  strong {
+    display: block;
+    margin-bottom: 6px;
+    color: #111827;
+    font-size: 16px !important;
+    font-weight: 700;
   }
+
+  em {
+    display: block;
+    color: #6b7280;
+    font-size: 13px !important;
+    font-weight: 400;
+    font-style: normal;
+  }
+
+  &:hover,
+  &:hover strong {
+    color: #1e6fff;
+  }
+}
+
+.product-card__icon {
+  width: 42px;
+  height: 42px;
+  border-radius: 12px;
+  display: inline-flex !important;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: #fff !important;
+  font-size: 13px !important;
+  font-weight: 800 !important;
+}
+
+.product-card__text {
+  min-width: 0;
+}
+
+.product-card--blue .product-card__icon {
+  background: linear-gradient(135deg, #2563eb, #38bdf8);
+}
+
+.product-card--purple .product-card__icon {
+  background: linear-gradient(135deg, #7c3aed, #d946ef);
+}
+
+.product-card--green .product-card__icon {
+  background: linear-gradient(135deg, #059669, #22c55e);
+}
+
+.product-card--plain {
+  min-height: 74px;
+  padding: 14px 16px;
+  box-shadow: none;
 }
 
 .activeFir {
@@ -1723,4 +1700,4 @@ export default Vue.extend({
   font-weight: 700;
   color: #222F60;
 }
-</style>
+</style>
\ No newline at end of file
diff --git a/f/web-kboss/src/views/homePage/components/topBox/new/index.vue b/f/web-kboss/src/views/homePage/components/topBox/new/index.vue
index 9ccd53a..0a21c7c 100644
--- a/f/web-kboss/src/views/homePage/components/topBox/new/index.vue
+++ b/f/web-kboss/src/views/homePage/components/topBox/new/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="news-page">
 
     new
   </div>
diff --git a/f/web-kboss/src/views/homePage/components/topBox/sale/index.vue b/f/web-kboss/src/views/homePage/components/topBox/sale/index.vue
index 4fa88f8..6d63bf8 100644
--- a/f/web-kboss/src/views/homePage/components/topBox/sale/index.vue
+++ b/f/web-kboss/src/views/homePage/components/topBox/sale/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>sale</div>
+  <div class="sale-page">sale</div>
 </template>
 <script lang="ts">
 import Vue from 'vue'
diff --git a/f/web-kboss/src/views/homePage/computeMarket/index.vue b/f/web-kboss/src/views/homePage/computeMarket/index.vue
index c20a48c..bbe819b 100644
--- a/f/web-kboss/src/views/homePage/computeMarket/index.vue
+++ b/f/web-kboss/src/views/homePage/computeMarket/index.vue
@@ -424,7 +424,7 @@ export default {
 <style scoped lang="scss">
 .compute-market-page {
   min-height: 100vh;
-  padding: 28px 0 8px;
+  padding: 82px 0 8px;
   background:
     radial-gradient(circle at top left, rgba(64, 158, 255, 0.18), transparent 34%),
     radial-gradient(circle at top right, rgba(14, 165, 233, 0.12), transparent 28%),
diff --git a/f/web-kboss/src/views/homePage/detail/index.vue b/f/web-kboss/src/views/homePage/detail/index.vue
index 13a2cf5..dae7184 100644
--- a/f/web-kboss/src/views/homePage/detail/index.vue
+++ b/f/web-kboss/src/views/homePage/detail/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div style="width: 100%;">
+  <div class="detail-page" style="width: 100%;">
     <!-- 顶部容器，设置最小宽度和flex布局 -->
     <div id="topContainer"
       style="min-width: 1400px; width: 100%;display: flex;flex-direction: column;justify-content: flex-start;align-items: center">
diff --git a/f/web-kboss/src/views/homePage/dialog/talk/index.vue b/f/web-kboss/src/views/homePage/dialog/talk/index.vue
index 3d41373..ee55c02 100644
--- a/f/web-kboss/src/views/homePage/dialog/talk/index.vue
+++ b/f/web-kboss/src/views/homePage/dialog/talk/index.vue
@@ -1,48 +1,55 @@
 <template>
   <div>
     <el-dialog
-      title="产品咨询"
-      :visible.sync="showTalk"
-      width="1000px"
+      title="联系销售"
+      :visible="dialogVisible"
+      width="620px"
       center
+      append-to-body
+      :close-on-click-modal="false"
       @close="cancelBtn"
-      top="15px"
+      @update:visible="handleDialogVisibleUpdate"
+      top="8vh"
+      custom-class="talk-dialog"
     >
-      <el-form ref="ruleForm" :rules="rules" label-position="top" label-width="80px" :model="addData">
-        <el-form-item label="需求描述">
-          <el-input :autosize="{ minRows: 3, maxRows: 3}" type="textarea" size="mini"
-                    v-model="addData.content"></el-input>
-        </el-form-item>
-        <el-form-item label="客户类型">
-          <el-radio v-model="addData.custom_type" label="1">企业</el-radio>
-          <el-radio v-model="addData.custom_type" label="0">个人</el-radio>
-        </el-form-item>
-        <el-form-item style="margin-bottom: 10px" label="联系人姓名" prop="name">
-          <el-input style="width: 350px;" size="mini" v-model="addData.name"></el-input>
-        </el-form-item>
-        <el-form-item style="margin-bottom: 10px" prop="phone" label="联系人手机">
-          <el-input style="width: 350px;" size="mini" v-model="addData.phone"></el-input>
-        </el-form-item>
-        <el-form-item v-show="addData.custom_type==='1'" style="margin-bottom: 10px" label="公司名称">
-          <el-input style="width: 350px;" size="mini" v-model="addData.company"></el-input>
-        </el-form-item>
-        <el-form-item style="margin-bottom: 10px" label="联系人邮箱">
-          <el-input style="width: 350px;" size="mini" v-model="addData.email"></el-input>
-        </el-form-item>
-      </el-form>
-      <el-checkbox style="margin-top: 25px" v-model="checked">
-        勾选表示：您同意<span v-if="JSON.stringify(logoInfoNew)!=='{}'">{{ logoInfoNew.home.bannerTitle }}</span>及其授权的合作伙伴通过您填写的联系方式联系您，且数据仅用于与您沟通。当您注销平台账号后，您的数据会被销毁。
-      </el-checkbox>
-      <div class="qcode">
-
-        <img v-if="JSON.stringify(logoInfoNew)!=='{}'" :src="logoInfoNew.home.qrCode" alt="">
-        <span style="margin-top: 10px;display: inline-block">扫码添加官方客服</span>
+      <div class="talk-body">
+        <div class="talk-form">
+          <el-form ref="ruleForm" :rules="rules" label-position="top" label-width="80px" :model="addData">
+            <el-form-item label="需求描述">
+              <el-input :autosize="{ minRows: 4, maxRows: 4 }" type="textarea" v-model="addData.content" placeholder="请输入您的具体需求"></el-input>
+            </el-form-item>
+            <el-form-item label="客户类型">
+              <el-radio v-model="addData.custom_type" label="1">企业</el-radio>
+              <el-radio v-model="addData.custom_type" label="0">个人</el-radio>
+            </el-form-item>
+            <div class="form-grid">
+              <el-form-item label="联系人姓名" prop="name">
+                <el-input v-model="addData.name" placeholder="请输入联系人姓名"></el-input>
+              </el-form-item>
+              <el-form-item prop="phone" label="联系人手机">
+                <el-input v-model="addData.phone" placeholder="请输入联系人手机"></el-input>
+              </el-form-item>
+              <el-form-item v-show="addData.custom_type==='1'" label="公司名称">
+                <el-input v-model="addData.company" placeholder="请输入公司名称"></el-input>
+              </el-form-item>
+              <el-form-item label="联系人邮箱">
+                <el-input v-model="addData.email" placeholder="请输入联系人邮箱"></el-input>
+              </el-form-item>
+            </div>
+          </el-form>
+          <el-checkbox class="agreement-checkbox" v-model="checked">
+            勾选表示：您同意<span v-if="JSON.stringify(logoInfoNew)!=='{}'">{{ logoInfoNew.home.bannerTitle }}</span>及其授权的合作伙伴通过您填写的联系方式联系您，且数据仅用于与您沟通。当您注销平台账号后，您的数据会被销毁。
+          </el-checkbox>
+        </div>
+        <div class="qcode">
+          <img v-if="JSON.stringify(logoInfoNew)!=='{}'" :src="logoInfoNew.home.qrCode" alt="">
+          <span>扫码添加官方客服</span>
+        </div>
       </div>
       <span slot="footer" class="dialog-footer">
-
-<!--    <el-button size="mini" @click="cancelBtn">取 消</el-button>-->
-    <el-button size="mini" type="primary" @click="confirmBtn">提 交</el-button>
-  </span>
+        <el-button class="cancel-btn" @click="cancelBtn">取消</el-button>
+        <el-button class="submit-btn" type="primary" :loading="addBtnLoading" @click="confirmBtn">提交咨询</el-button>
+      </span>
     </el-dialog>
   </div>
 </template>
@@ -71,6 +78,7 @@ export default Vue.extend({
       },
       addBtnLoading: false,
       checked: false,
+      dialogVisible: false,
       addData: {
         content: '',//需求内容
         custom_type: "1",//客户类型 0-个人 1-企业
@@ -87,8 +95,23 @@ export default Vue.extend({
       }
     }
   },
+  watch: {
+    showTalk: {
+      immediate: true,
+      handler(value) {
+        this.dialogVisible = value
+      }
+    }
+  },
   methods: {
+    handleDialogVisibleUpdate(value) {
+      this.dialogVisible = value;
+      if (!value) {
+        this.$store.commit('setShowTalk', false);
+      }
+    },
     cancelBtn() {
+      this.dialogVisible = false;
       this.$store.commit('setShowTalk', false);
       console.log("取消按钮被点击了");
     },
@@ -144,41 +167,176 @@ export default Vue.extend({
 
 
 <style scoped lang="scss">
+::v-deep .talk-dialog {
+  border-radius: 22px;
+  overflow: hidden;
+  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.18);
+  z-index: 99999999999999999!important;
+
+}
+
 ::v-deep .el-dialog__header {
+  display: flex;
   justify-content: center;
+  align-items: center;
+  padding: 22px 28px 8px;
   border: none;
 }
 
+::v-deep .el-dialog__title {
+  color: #111827;
+  font-size: 22px;
+  line-height: 1.4;
+  font-weight: 700;
+}
+
+::v-deep .el-dialog__headerbtn {
+  top: 26px;
+  right: 28px;
+  font-size: 20px;
+}
+
+::v-deep .el-dialog__body {
+  padding: 8px 28px 6px;
+}
+
 ::v-deep .el-form-item__label {
-  padding-bottom: 0;
+  padding-bottom: 8px;
+  color: #374151;
+  font-size: 15px;
+  line-height: 1.4;
+  font-weight: 600;
 }
 
 ::v-deep .el-form-item {
-  margin-bottom: 0;
+  margin-bottom: 14px;
+}
+
+::v-deep .el-input__inner,
+::v-deep .el-textarea__inner {
+  border-radius: 12px;
+  border-color: #e5eaf3;
+  color: #111827;
+  font-size: 15px;
+  pointer-events: auto;
+  user-select: text;
+}
+
+::v-deep .el-input__inner {
+  height: 42px;
+  line-height: 42px;
+}
+
+::v-deep .el-textarea__inner {
+  padding: 12px 14px;
+  line-height: 1.7;
+}
+
+::v-deep .el-radio__label {
+  color: #374151;
+  font-size: 15px;
+}
+
+.talk-body {
+  position: relative;
+  min-height: 470px;
+}
+
+.talk-form {
+  min-width: 0;
+  padding-right: 178px;
+}
+
+.form-grid {
+  display: block;
+}
+
+.agreement-checkbox {
+  margin-top: 4px;
+
+  ::v-deep .el-checkbox__label {
+    color: #6b7280;
+    font-size: 13px;
+    line-height: 1.7;
+    white-space: normal;
+  }
 }
 
 .qcode {
   width: 150px;
-  height: 150px;
+  min-height: 174px;
+  padding: 14px 12px;
   position: absolute;
-  right: 150px;
-  bottom: 150px;
+  right: 0;
+  bottom: 0;
+  border-radius: 18px;
+  background: linear-gradient(180deg, #f4f8ff 0%, #ffffff 100%);
+  border: 1px solid #edf1f7;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
+  box-sizing: border-box;
 
   img {
-    width: 100%;
-    height: 100%;
+    width: 112px;
+    height: 112px;
+    object-fit: cover;
+    border-radius: 12px;
+  }
+
+  span {
+    margin-top: 12px;
+    color: #4b5563;
+    font-size: 14px;
+    font-weight: 600;
   }
 }
 
 ::v-deep .el-dialog__footer {
   display: flex;
-  justify-content: flex-start;
+  justify-content: center;
   align-items: center;
-  padding-top: 0;
-  padding-bottom: 35px;
+  gap: 14px;
+  padding: 8px 28px 26px;
+}
+
+.cancel-btn,
+.submit-btn {
+  min-width: 160px;
+  height: 44px;
+  padding: 0 32px;
+  border-radius: 999px;
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.cancel-btn {
+  border: 1px solid #d8e0ef;
+  color: #4b5563;
+  background: #fff;
+}
+
+.submit-btn {
+  border: 0;
+  background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+  box-shadow: 0 12px 28px rgba(39, 90, 255, 0.22);
+}
+
+@media (max-width: 900px) {
+  .talk-body {
+    min-height: auto;
+  }
+
+  .talk-form {
+    padding-right: 0;
+  }
+
+  .qcode {
+    position: static;
+    width: 100%;
+    min-height: auto;
+    margin-top: 20px;
+  }
 }
 </style>
diff --git a/f/web-kboss/src/views/homePage/indexLast.vue b/f/web-kboss/src/views/homePage/indexLast.vue
index facb57e..8fc85da 100644
--- a/f/web-kboss/src/views/homePage/indexLast.vue
+++ b/f/web-kboss/src/views/homePage/indexLast.vue
@@ -2,13 +2,15 @@
   <div id="homeOut" class="homeOut">
     <TopBox id="topBox"></TopBox>
 
-    <router-view></router-view>
+    <div class="home-router-view">
+      <router-view></router-view>
+    </div>
     <!--    footer-->
     <div class="footer">
-      <div class="left-box" style="border-bottom: 1px solid  #7A82A0">
+      <div class="left-box">
 
-        <div style="display: flex;flex-direction: column">
-          <img v-if="JSON.stringify(logoInfoNew)!=='{}'" style="width: 148px;height: 48px;"
+        <div class="footer-brand">
+          <img v-if="JSON.stringify(logoInfoNew)!=='{}'"
                :src="logoInfoNew.home.logoImg" alt=""
                class="img">
           <div class="content-main">
@@ -27,40 +29,19 @@
           </div>
         </div>
         <ul class="bigUl">
-
-          <!--          <li class="bigLi">-->
-          <!--            <span class="title">关于我们</span>-->
-          <!--            <ul class="smallUl">-->
-          <!--              <li class="smallLi" @click="$router.push('/homePage/about')">公司介绍</li>-->
-          <!--            </ul>-->
-          <!--            <span class="title"> </span>-->
-          <!--          </li>-->
-          <!--          <li class="bigLi">-->
-          <!--            <span class="title">产品</span>-->
-          <!--            <ul class="smallUl">-->
-          <!--              <li @click="goBaidu" class="smallLi">百度云</li>-->
-          <!--              <li @click="goAliyun" class="smallLi">阿里云</li>-->
-          <!--              &lt;!&ndash;              <li class="smallLi">开元云</li>&ndash;&gt;-->
-          <!--            </ul>-->
-          <!--            <span class="title"> </span>-->
-          <!--          </li>-->
-          <!--          <li class="bigLi">-->
-          <!--            <span class="title">解决方案</span>-->
-          <!--            <ul class="smallUl">-->
-          <!--              <li class="smallLi">生物医药</li>-->
-          <!--            </ul>-->
-          <!--            <span class="title"> </span>-->
-          <!--          </li>-->
-          <!--          <li class="bigLi">-->
-          <!--            <span class="title">服务与支持</span>-->
-          <!--            <ul class="smallUl">-->
-          <!--              <li class="smallLi">模型微调</li>-->
-          <!--              <li class="smallLi">模型应用</li>-->
-          <!--              <li class="smallLi">业务咨询</li>-->
-          <!--              <li class="smallLi">加入开元</li>-->
-          <!--            </ul>-->
-          <!--            <span class="title"> </span>-->
-          <!--          </li>-->
+          <li class="bigLi footer-service">
+            <span class="title">产品服务</span>
+            <ul class="smallUl footer-service-list">
+              <li
+                v-for="item in footerProductServices"
+                :key="item.label"
+                class="smallLi"
+                @click="goFooterService(item.path)"
+              >
+                {{ item.label }}
+              </li>
+            </ul>
+          </li>
         </ul>
         <div v-if="JSON.stringify(logoInfoNew)!=='{}'&&logoInfoNew.home.bannerTitle!=='开元数智'" class="right-box">
           <div class="qr-box">
@@ -70,7 +51,7 @@
             </div>
             <span class="qr-content">微信客服</span>
           </div>
-          <div class="qr-box" style="margin-left: 0.667rem">
+          <div class="qr-box">
             <div class="qr-code">
               <img src="./img/kefu.jpg" style="padding: 0.08rem" alt="">
 
@@ -79,9 +60,9 @@
           </div>
         </div>
       </div>
-      <div style="display: flex;justify-content: center;align-items: center;width: 100%; ">
+      <div class="footer-record">
         <span v-if="JSON.stringify(logoInfoNew)!=='{}'"
-              style="margin:15px 0 ;width: 1400px;display:flex;justify-content:center;align-items:center;color: #7A82A0;"><span
+              class="footer-record__text"><span
           class="goStyle"
         @click="goOut('https://beian.miit.gov.cn/#/Integrated/index')">
            京ICP备{{
@@ -150,6 +131,15 @@ export default Vue.extend({
           icon: require("./newImg/container.png"),
           activeIcon: require("./newImg/containerActive.png")
         }
+      ],
+      footerProductServices: [
+        { label: 'Token市集', path: '/homePage/tokenMarket' },
+        { label: '算力市场', path: '/homePage/computeMarket' },
+        { label: 'OPC公共服务平台', path: '/homePage/opc' },
+        { label: '训推平台', path: '/homePage/trainPlatform' },
+        { label: '智能体商店', path: '/homePage/agentStore' },
+        { label: '供需广场', path: '/ncmatchHome/supplyAndDemandSquare' },
+        { label: '文档中心', path: '/homePage/new' },
       ]
     }
   },
@@ -179,6 +169,10 @@ export default Vue.extend({
     goOut(url){
       window.open(url)
     },
+    goFooterService(path) {
+      if (!path || this.$route.path === path) return
+      this.$router.push(path)
+    },
     scrollToElement(id) {
       const element = document.getElementById(id);
       if (element) {
@@ -247,54 +241,94 @@ export default Vue.extend({
   height: 100%;
   overflow: auto !important;
   min-width: 1500px;
+  // background: linear-gradient(180deg, #f0f7ff 0%, #ffffff 60%, #f5f8ff 100%);
+}
+#topBox{
+  // height: 82px;  
+  background: transparent!important;
+  background-color: transparent!important;
+  box-shadow: none!important;
+  border: 0!important;
+}
+
+.home-router-view {
+  width: 100%;
+  padding-top: 0;
+  box-sizing: border-box;
 }
 
 .footer {
-  padding: 35px 0;
+  padding: 42px 0 22px;
   width: 100%;
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
+  background-color: #fff;
 }
 
 .left-box {
   width: 1400px;
-  height: 100%;
+  min-height: 180px;
   display: flex;
   justify-content: space-between;
-  align-items: center;
-  padding-bottom: 15px;
+  align-items: flex-start;
+  padding: 0 0 30px;
+  border-bottom: 1px solid rgba(122, 130, 160, 0.28);
+  box-sizing: border-box;
+}
+
+.footer-brand {
+  width: 420px;
+  display: flex;
+  flex-direction: column;
+
+  .img {
+    width: 168px;
+    height: 54px;
+    object-fit: contain;
+    object-position: left center;
+    margin-bottom: 14px;
+  }
 }
 
 .right-box {
-  height: 100%;
+  min-width: 260px;
   display: flex;
   justify-content: center;
-  align-items: center;
+  align-items: flex-start;
+  gap: 34px;
 }
 
 .content-main {
   mix-blend-mode: normal;
-  color: rgba(0, 0, 0, 1);
-  font-size: 0.187rem;
+  color: #7A82A0;
+  font-size: 14px;
+  line-height: 1.8;
 }
 
 .qr-code {
+  width: 112px;
+  height: 112px;
+  padding: 6px;
+  border: 1px solid #edf1f7;
+  border-radius: 12px;
+  box-sizing: border-box;
+  background: #fff;
+
   img {
     width: 100%;
     height: 100%;
+    object-fit: cover;
   }
-
-  width: 1.853rem;
-  height: 1.853rem;
 }
 
 .qr-content {
   mix-blend-mode: normal;
-  color: rgba(24, 24, 24, 1);
+  color: #4b5563;
   font-family: PingFang SC, serif;
   font-weight: 600;
-  font-size: 0.187rem;
+  font-size: 14px;
+  margin-top: 10px;
 }
 
 .qr-box {
@@ -314,27 +348,30 @@ export default Vue.extend({
 }
 
 .bigUl {
-  margin: 0 15px;
-  margin-left: -250px;
-  //padding-top: 15px;
-  width: fit-content;
+  margin: 0 80px 0 40px;
+  width: 260px;
   display: flex;
   justify-content: flex-start;
+  padding: 0;
+  list-style: none;
 
   .bigLi {
-    margin: 0 25px;
+    margin: 0;
   }
 
   height: 100%;
 
   .title {
-    color: #222F60;
+    color: #111827;
     font-size: 18px;
-    font-weight: bold;
+    line-height: 1.4;
+    font-weight: 700;
   }
 
   .smallUl {
-    font-size: 16px;
+    padding: 0;
+    list-style: none;
+    font-size: 15px;
     color: #7A82A0;
 
     li {
@@ -343,12 +380,29 @@ export default Vue.extend({
   }
 }
 
+.footer-service {
+  display: flex;
+  flex-direction: column;
+}
+
+.footer-service-list {
+  margin-top: 16px;
+
+  .smallLi {
+    line-height: 1.5;
+    white-space: nowrap;
+  }
+}
+
 .info {
   font-size: 14px;
   color: #7A82A0;
+  padding: 0;
+  margin: 0;
+  list-style: none;
 
   li {
-    margin: 10px 0;
+    margin: 6px 0;
   }
 }
 
@@ -358,12 +412,32 @@ export default Vue.extend({
 }
 
 .smallLi {
+  transition: color .2s ease, transform .2s ease;
+
   &:hover {
     color: #1b5bff;
     cursor: pointer;
+    transform: translateX(4px);
   }
 }
 
+.footer-record {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.footer-record__text {
+  width: 1400px;
+  margin: 18px 0 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #7A82A0;
+  font-size: 14px;
+}
+
 .goStyle {
   cursor: pointer;
   transition: all .3s ease-in-out;
diff --git a/f/web-kboss/src/views/homePage/mainPage/OPC/index.vue b/f/web-kboss/src/views/homePage/mainPage/OPC/index.vue
new file mode 100644
index 0000000..2a12619
--- /dev/null
+++ b/f/web-kboss/src/views/homePage/mainPage/OPC/index.vue
@@ -0,0 +1,1122 @@
+<template>
+  <div class="jd-homepage">
+    <!-- 搜索区域 -->
+    <!-- <div class="search-box">
+      <search></search>
+    </div> -->
+
+    <!-- 主内容区域 -->
+    <main class="main-content">
+      <section id="banner" class="public-hero">
+        <div class="floating-orb orb-1"></div>
+        <div class="floating-orb orb-2"></div>
+        <div class="floating-orb orb-3"></div>
+        <div class="floating-orb orb-4"></div>
+
+        <div class="hero-glow glow-blue"></div>
+        <div class="hero-glow glow-purple"></div>
+        <div class="hero-glow glow-warm"></div>
+
+        <div class="hero-particles">
+          <span v-for="item in 30" :key="item"></span>
+        </div>
+
+        <div class="hero-inner">
+          <p class="hero-slogan">好用还省钱，Token 就上开元云</p>
+          <h1><span>OPC</span>公共服务平台</h1>
+          <p class="hero-subtitle">
+            为 <strong>OPC</strong> 而生，极致性价比一站式模型平台
+          </p>
+
+          <div class="hero-service-list">
+            <div class="circle-item token" @click="goTokenMarket">
+              <div class="circle-ring">
+                <div class="circle-core">
+                  <svg viewBox="0 0 80 80" aria-hidden="true">
+                    <defs>
+                      <linearGradient id="tokenGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+                        <stop offset="0%" stop-color="#93c5fd" />
+                        <stop offset="50%" stop-color="#3b82f6" />
+                        <stop offset="100%" stop-color="#1d4ed8" />
+                      </linearGradient>
+                    </defs>
+                    <polygon points="40,8 68,24 68,56 40,72 12,56 12,24" fill="rgba(59,130,246,0.18)" stroke="url(#tokenGradient)" stroke-width="2" />
+                    <polygon points="40,18 56,28 56,48 40,58 24,48 24,28" fill="url(#tokenGradient)" opacity="0.75" />
+                    <text x="40" y="45" text-anchor="middle" fill="#fff" font-size="20" font-weight="700">T</text>
+                    <line x1="40" y1="8" x2="40" y2="2" stroke="#60a5fa" stroke-width="1.5" />
+                    <line x1="68" y1="24" x2="74" y2="20" stroke="#60a5fa" stroke-width="1.5" />
+                    <line x1="12" y1="24" x2="6" y2="20" stroke="#60a5fa" stroke-width="1.5" />
+                  </svg>
+                </div>
+              </div>
+              <h3>Token市集</h3>
+              <p>汇聚海量精品模型，以更低成本畅享极致 AI 体验</p>
+              <button type="button" @click.stop="goTokenMarket">立即体验</button>
+            </div>
+
+            <div class="circle-item workshop" @click="goCreativeWorkshop">
+              <div class="circle-ring">
+                <div class="circle-core">
+                  <svg viewBox="0 0 80 80" aria-hidden="true">
+                    <defs>
+                      <linearGradient id="lensGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+                        <stop offset="0%" stop-color="#e9d5ff" />
+                        <stop offset="50%" stop-color="#a855f7" />
+                        <stop offset="100%" stop-color="#7c3aed" />
+                      </linearGradient>
+                    </defs>
+                    <circle cx="40" cy="40" r="32" fill="rgba(139,92,246,0.15)" stroke="url(#lensGradient)" stroke-width="2" />
+                    <circle cx="40" cy="40" r="22" fill="rgba(168,85,247,0.32)" stroke="#c084fc" stroke-width="1.5" />
+                    <circle cx="40" cy="40" r="12" fill="url(#lensGradient)" opacity="0.85" />
+                    <ellipse cx="35" cy="35" rx="6" ry="3" fill="#fff" opacity="0.45" transform="rotate(-30 35 35)" />
+                    <line x1="40" y1="18" x2="40" y2="8" stroke="#c084fc" stroke-width="1.5" />
+                    <line x1="40" y1="62" x2="40" y2="72" stroke="#c084fc" stroke-width="1.5" />
+                    <line x1="18" y1="40" x2="8" y2="40" stroke="#c084fc" stroke-width="1.5" />
+                    <line x1="62" y1="40" x2="72" y2="40" stroke="#c084fc" stroke-width="1.5" />
+                  </svg>
+                </div>
+              </div>
+              <h3>创镜工坊</h3>
+              <p>以文筑境，以镜生画，全场景 AI 影像创作</p>
+              <button type="button" @click.stop="goCreativeWorkshop">了解更多</button>
+            </div>
+
+            <div class="circle-item base" @click="goCloudBase">
+              <div class="circle-ring">
+                <div class="circle-core">
+                  <svg viewBox="0 0 80 80" aria-hidden="true">
+                    <defs>
+                      <linearGradient id="cloudGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+                        <stop offset="0%" stop-color="#a7f3d0" />
+                        <stop offset="50%" stop-color="#10b981" />
+                        <stop offset="100%" stop-color="#059669" />
+                      </linearGradient>
+                    </defs>
+                    <rect x="14" y="48" width="52" height="14" rx="4" fill="rgba(16,185,129,0.25)" stroke="#34d399" />
+                    <rect x="14" y="32" width="52" height="14" rx="4" fill="rgba(16,185,129,0.38)" stroke="#34d399" />
+                    <rect x="14" y="16" width="52" height="14" rx="4" fill="url(#cloudGradient)" opacity="0.78" stroke="#a7f3d0" />
+                    <circle cx="22" cy="23" r="2" fill="#a7f3d0" />
+                    <circle cx="22" cy="39" r="2" fill="#34d399" />
+                    <circle cx="22" cy="55" r="2" fill="#34d399" />
+                    <line x1="40" y1="30" x2="40" y2="32" stroke="#34d399" stroke-width="1.5" />
+                    <line x1="40" y1="46" x2="40" y2="48" stroke="#34d399" stroke-width="1.5" />
+                    <path d="M56 20 Q60 16 64 20" stroke="#a7f3d0" stroke-width="1.5" fill="none" />
+                    <path d="M54 17 Q60 10 66 17" stroke="#a7f3d0" stroke-width="1.2" fill="none" opacity="0.55" />
+                  </svg>
+                </div>
+              </div>
+              <h3>云枢基座</h3>
+              <p>深耕基础云服务，筑牢 AI 平台数字根基</p>
+              <button type="button" @click.stop="goCloudBase">了解更多</button>
+            </div>
+          </div>
+
+          <div class="hero-stat-list">
+            <div class="hero-stat-item">
+              <strong>50+</strong>
+              <span>精品模型</span>
+            </div>
+            <div class="hero-stat-item">
+              <strong>99.9%</strong>
+              <span>服务可用性</span>
+            </div>
+            <div class="hero-stat-item">
+              <strong>4800+</strong>
+              <span>企业用户</span>
+            </div>
+            <div class="hero-stat-item highlight">
+              <strong>低至0.001</strong>
+              <span>每千Token起步价</span>
+            </div>
+          </div>
+        </div>
+      </section>
+    </main>
+
+    <!-- 产品列表区域 -->
+    <!-- <div class="productList">
+      <ul class="myTab">
+        <li v-for="menu in product" :class="currentHotMenu === menu.id ? 'activeMenu' : ''" @click="clickNetMenu(menu)"
+          :key="menu.name">
+          <span class="tab-text">{{ menu.product_category }}</span>
+        </li>
+      </ul>
+
+      <productCard v-loading="boxLoading" :productList="hotProductList"></productCard>
+
+      <el-pagination @current-change="handleCurrentChange" :page-size="page_size" layout="total, prev, pager, next"
+        :total="total">
+      </el-pagination>
+    </div> -->
+
+    <!-- 发布商品/需求对话框 -->
+    <!-- <el-dialog :title="publish_type === '2' ? '发布需求' : '发布商品'" width="60vw" top="5vh"
+      :visible.sync="sendProductVisible">
+      <sendProduct :isEdit="false" v-if="publish_type" @success="sendProductSuccess" :publish_type="publish_type">
+      </sendProduct>
+    </el-dialog> -->
+
+    <!-- 提示对话框 -->
+    <el-dialog title="温馨提示" :visible.sync="showTip" width="30%">
+      <span>您还没有完善企业信息，完善企业信息审核通过后您可以发布需求与商品。</span>
+      <span slot="footer" class="dialog-footer">
+        <span>
+          <span style="margin-right: 10px;">跳转到</span>
+          <el-button size="small" type="primary" @click="goInfo">信息完善</el-button>
+        </span>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Vue from 'vue'
+import { reqPublishProductSearchFirstPage, reqEnterpriseAuditInfoSearch, reqHomepageProductCategory, reqGetSupplyAndDemandSquareList } from '@/api/ncmatch'
+import { mapGetters, mapState } from "vuex";
+import { gotoYuanJingAPI } from '@/api/gotoYuanJing'
+
+export default Vue.extend({
+  name: "mainPage",
+  components: {
+    // sendProduct: () => import('../ncmatch/sendProduct/index.vue'),
+    // productCard: () => import('./productCard/index.vue'),
+    // search: () => import('../search/index.vue'),
+    // menuAside: () => import('./menuAside/index.vue')
+  },
+  created() {
+    this.getHomepageProductCategory()
+  },
+  data() {
+    return {
+      boxLoading: false,
+      selectedCategory: "",
+      showTip: false,
+      total: 0,
+      publish_type: null,
+      sendProductVisible: false,
+      currentHotMenu: "",
+      product: [],
+      hotProductList: [],
+      current_page: 1,
+      page_size: 8,
+    }
+  },
+  computed: {
+    ...mapGetters(["sidebar", "avatar", "device"]),
+    ...mapState({
+      isShowPanel: (state) => state.product.showHomeNav,
+      navIndex: (state) => state.product.navIndex,
+      gridObj: state => state.operationAnalysis.gridObj,
+      mybalance: state => state.user.mybalance,
+      logoutUrl: state => state.login.logoutUrl,
+      loginStateVuex: state => state.login.loginState,
+      logoInfoNew: state => state.product.logoInfoNew,
+    }),
+    loginState() {
+      const userId = sessionStorage.getItem('userId');
+      return this.loginStateVuex || (userId !== null && userId !== 'null' && userId !== '');
+    },
+  },
+  methods: {
+    goTokenMarket() {
+      if (!this.loginState) {
+        this.$router.push({
+          path: '/tokenMarket',
+          query: {
+            category: 'TOKEN市集',
+            from: 'home',
+            single: '1'
+          }
+        })
+        return
+      }
+      this.$router.push({
+        path: '/product',
+        query: {
+          category: 'TOKEN市集',
+          from: 'home'
+        }
+      })
+    },
+    goCloudBase() {
+      if (!this.loginState) {
+        this.$message.warning('请先登录哦~')
+        return
+      }
+      this.$router.push({
+        path: '/product',
+        query: {
+          category: '基础云',
+          from: 'home'
+        }
+      })
+    },
+    getHomepageProductCategory() {
+      reqHomepageProductCategory({
+        url_link: window.location.href,
+        publish_type: "1"
+      }).then(res => {
+        if (res.status) {
+          this.categories = res.data
+          this.product = res.data
+          this.currentHotMenu = res.data[0].id
+          this.selectedCategory = res.data[0].id
+          this.initData()
+        }
+      })
+    },
+    goInfo() {
+      this.showTip = false
+      this.$router.push('/customer/approve')
+    },
+    async goCreativeWorkshop() {
+      if (!this.loginState) {
+        window.open('https://ai.opencomputing.cn/', '_blank')
+        return
+      }
+
+      const yuanJingWindow = window.open('', '_blank')
+
+      try {
+        const res = await gotoYuanJingAPI({
+          user_id: sessionStorage.getItem('userId')
+        })
+
+        const deerer = this.getYuanJingAuthorization(res)
+
+        if (!deerer) {
+          if (yuanJingWindow) {
+            yuanJingWindow.close()
+          }
+          this.$message.error((res && res.msg) || '获取元境授权参数失败')
+          return
+        }
+
+        const loginUrl = `https://ai.opencomputing.cn/#/getCookie?deerer=${encodeURIComponent(deerer)}`
+
+        if (yuanJingWindow) {
+          yuanJingWindow.location.href = loginUrl
+        } else {
+          window.location.href = loginUrl
+        }
+      } catch (error) {
+        if (yuanJingWindow) {
+          yuanJingWindow.close()
+        }
+        this.$message.error('跳转元境失败，请稍后重试')
+      }
+    },
+    getYuanJingAuthorization(res) {
+      if (!res) {
+        return ''
+      }
+
+      if (typeof res === 'string') {
+        return res
+      }
+
+      const data = res.data || res
+      if (typeof data === 'string') {
+        return data
+      }
+
+      return data.Authorization || data.authorization || data.token || data.header || data.value || ''
+    },
+    handleCurrentChange(val) {
+      this.current_page = val
+      this.initData()
+    },
+    sendInfo(type) {
+      if (this.loginState) {
+        reqEnterpriseAuditInfoSearch({
+          url_link: window.location.href,
+        }).then(res => {
+          const dataList = res && res.data && res.data.data
+          const hasAuditInfo = Array.isArray(dataList) && dataList.length !== 0
+          const roles = sessionStorage.getItem('jueseNew')
+          const isCustomer = roles ? roles.includes('客户') : true
+
+          // 安全检查：确保 data[0] 存在
+          if (hasAuditInfo && dataList[0]) {
+            const auditStatus = dataList[0].audit_status
+
+            if (auditStatus === 'pending') {
+              this.$message.warning('您的审核状态为待审核，请等待审核通过后发布~')
+            } else if (auditStatus === 'rejected') {
+              this.$message.warning('您的审核状态为驳回，请重新提交~')
+            } else {
+              // 审核通过或其他状态，允许发布
+              this.publish_type = type
+              this.sendProductVisible = true
+            }
+          } else if (!isCustomer) {
+            // 非客户角色，允许发布
+            this.publish_type = type
+            this.sendProductVisible = true
+          } else {
+            // 没有审核信息且是客户角色，显示提示
+            this.showTip = true
+          }
+        })
+      } else {
+        this.$router.push('/login')
+      }
+    },
+    initData() {
+      this.boxLoading = true
+      let ploay = {
+        product_category: this.selectedCategory,
+        to_page: "first_page",
+        url_link: window.location.href,
+        page_size: this.page_size,
+        current_page: this.current_page,
+        publish_type: "1"
+      }
+      reqGetSupplyAndDemandSquareList(ploay).then(res => {
+        this.boxLoading = false
+        if (res.status) {
+          if (res.data.length === 0) {
+            this.hotProductList = []
+            this.total = 0
+          } else {
+            this.hotProductList = res.data[0].product_list
+            this.total = res.data[0].total_count
+          }
+        }
+      })
+    },
+    init_product_list() {
+      reqPublishProductSearchFirstPage({
+        publish_type: "1",
+        url_link: window.location.href,
+        to_page: 'first_page',
+        page_size: this.page_size,
+        current_page: this.current_page,
+        product_type: this.currentHotMenu
+      }).then(res => {
+        if (res.status) {
+          if (res.data.length > 0) {
+            this.currentHotMenu = res.data[0].id
+            this.hotProductList = res.data[0].product_list
+            this.product = res.data
+            this.total = res.data[0].total_count
+          }
+        }
+      })
+    },
+    sendProductSuccess() {
+      this.sendProductVisible = false; // 关闭弹窗
+      this.init_product_list()
+    },
+    clickNetMenu(menu) {
+      this.current_page = 1
+      this.currentHotMenu = menu.id;
+      this.selectedCategory = menu.id
+      this.initData()
+    },
+    goFavorite() {
+      if (this.loginState) {
+        this.$router.push('/ncmatchHome/favoriteBox')
+      } else {
+        this.$router.push('/login')
+      }
+    },
+    goHistory() {
+      if (this.loginState) {
+        this.$router.push('/ncmatchHome/historyBox')
+      } else {
+        this.$router.push('/login')
+      }
+    }
+  }
+})
+</script>
+
+<style scoped lang="scss">
+.jd-homepage {
+  margin: 0;
+  padding-top: 82px;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  background: linear-gradient(180deg, #f0f7ff 0%, #ffffff 46%, #f7faff 74%, #f8fafc 100%);
+  overflow-x: hidden;
+}
+
+.search-box {
+  max-width: 1280px;
+  margin: 0 auto 18px;
+  padding: 0 24px;
+}
+
+/* 主内容区域 */
+.main-content {
+  width: 100%;
+  padding: 0;
+}
+
+/* 横幅样式 */
+.public-hero {
+  width: 100%;
+  min-height: 760px;
+  margin: 0 auto;
+  overflow: hidden;
+  position: relative;
+  color: #111827;
+  background:
+    radial-gradient(circle at 16% 18%, rgba(45, 91, 255, 0.12), transparent 28%),
+    radial-gradient(circle at 82% 28%, rgba(124, 58, 237, 0.1), transparent 30%),
+    radial-gradient(circle at 50% 52%, rgba(245, 158, 11, 0.08), transparent 36%),
+    linear-gradient(180deg, #f0f7ff 0%, #ffffff 66%, #f7faff 88%, #f8fafc 100%);
+}
+
+.hero-inner {
+  position: relative;
+  z-index: 3;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 76px 48px 64px;
+  text-align: center;
+}
+
+.hero-slogan {
+  margin: 0 0 28px;
+  font-size: 18px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  background: linear-gradient(90deg, #f59e0b 0%, #ef4444 25%, #f59e0b 50%, #2d5bff 75%, #f59e0b 100%);
+  background-size: 200% auto;
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+  animation: sloganShine 4s linear infinite;
+}
+
+.public-hero h1 {
+  margin: 0;
+  color: #111827;
+  font-size: 64px;
+  line-height: 1.1;
+  font-weight: 800;
+  letter-spacing: 0.02em;
+
+  span {
+    margin: 0 4px;
+    background: linear-gradient(135deg, #2d5bff 0%, #7c3aed 100%);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+  }
+}
+
+.hero-subtitle {
+  max-width: 760px;
+  margin: 22px auto 70px;
+  color: #666666;
+  font-size: 22px;
+  line-height: 1.7;
+
+  strong {
+    color: #2d5bff;
+    font-weight: 700;
+  }
+}
+
+.floating-orb {
+  position: absolute;
+  border-radius: 50%;
+  filter: blur(80px);
+  opacity: 0.08;
+  pointer-events: none;
+  z-index: 0;
+
+  &.orb-1 {
+    top: -110px;
+    left: -100px;
+    width: 400px;
+    height: 400px;
+    background: #3b82f6;
+    animation: float1 20s ease-in-out infinite;
+  }
+
+  &.orb-2 {
+    right: -150px;
+    bottom: -160px;
+    width: 500px;
+    height: 500px;
+    background: #8b5cf6;
+    animation: float2 25s ease-in-out infinite;
+  }
+
+  &.orb-3 {
+    left: 50%;
+    top: 50%;
+    width: 300px;
+    height: 300px;
+    background: #ec4899;
+    animation: float3 18s ease-in-out infinite;
+  }
+
+  &.orb-4 {
+    right: 20%;
+    bottom: 30%;
+    width: 350px;
+    height: 350px;
+    background: #f59e0b;
+    animation: float1 22s ease-in-out infinite reverse;
+  }
+}
+
+.hero-glow {
+  position: absolute;
+  border-radius: 50%;
+  pointer-events: none;
+  z-index: 1;
+
+  &.glow-blue {
+    top: 90px;
+    left: 9%;
+    width: 360px;
+    height: 360px;
+    background: rgba(59, 130, 246, 0.18);
+    filter: blur(120px);
+  }
+
+  &.glow-purple {
+    right: 8%;
+    bottom: 120px;
+    width: 480px;
+    height: 480px;
+    background: rgba(168, 85, 247, 0.16);
+    filter: blur(150px);
+  }
+
+  &.glow-warm {
+    left: 50%;
+    top: 43%;
+    width: 560px;
+    height: 560px;
+    background: rgba(245, 158, 11, 0.08);
+    filter: blur(180px);
+    transform: translate(-50%, -50%);
+  }
+}
+
+.hero-particles {
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  overflow: hidden;
+  pointer-events: none;
+
+  span {
+    position: absolute;
+    width: 4px;
+    height: 4px;
+    background: rgba(45, 91, 255, 0.12);
+    border-radius: 50%;
+    animation: particleFloat 8s linear infinite;
+
+    @for $i from 1 through 30 {
+      &:nth-child(#{$i}) {
+        left: #{($i * 17) % 100}#{'%'};
+        top: #{($i * 29) % 100}#{'%'};
+        width: #{2 + ($i % 4)}px;
+        height: #{2 + ($i % 4)}px;
+        animation-delay: #{($i % 8) * 0.45}s;
+        animation-duration: #{6 + ($i % 6)}s;
+      }
+    }
+
+    &:nth-child(4n) {
+      background: rgba(16, 185, 129, 0.16);
+    }
+
+    &:nth-child(4n + 1) {
+      background: rgba(59, 130, 246, 0.16);
+    }
+
+    &:nth-child(4n + 2) {
+      background: rgba(139, 92, 246, 0.16);
+    }
+
+    &:nth-child(4n + 3) {
+      background: rgba(236, 72, 153, 0.14);
+    }
+  }
+}
+
+@keyframes particleFloat {
+  0% {
+    transform: translateY(0) scale(0);
+    opacity: 0;
+  }
+
+  10% {
+    transform: translateY(-20px) scale(1);
+    opacity: 1;
+  }
+
+  90% {
+    transform: translateY(-200px) scale(1);
+    opacity: 1;
+  }
+
+  100% {
+    transform: translateY(-240px) scale(0.5);
+    opacity: 0;
+  }
+}
+
+.hero-service-list {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 72px;
+  width: 100%;
+  max-width: 900px;
+}
+
+.circle-item {
+  cursor: pointer;
+  color: #111827;
+  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+
+  &:hover {
+    transform: scale(1.08) translateY(-10px);
+  }
+
+  h3 {
+    margin: 24px 0 12px;
+    color: #1a1a1a;
+    font-size: 24px;
+    font-weight: 700;
+  }
+
+  p {
+    min-height: 52px;
+    max-width: 210px;
+    margin: 0 auto 18px;
+    color: #666666;
+    font-size: 15px;
+    line-height: 1.7;
+  }
+
+  button {
+    height: 36px;
+    padding: 0 24px;
+    cursor: pointer;
+    background: rgba(255, 255, 255, 0.76);
+    border: 1px solid rgba(45, 91, 255, 0.12);
+    border-radius: 999px;
+    transition: all 0.25s ease;
+  }
+}
+
+.circle-ring {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 192px;
+  height: 192px;
+  margin: 0 auto;
+  border: 2px solid rgba(45, 91, 255, 0.15);
+  border-radius: 50%;
+  background: linear-gradient(135deg, rgba(45, 91, 255, 0.06), rgba(45, 91, 255, 0.02));
+  box-shadow: 0 4px 12px rgba(45, 91, 255, 0.06), 0 0 20px rgba(45, 91, 255, 0.12);
+  animation: rhythmPulse 2.5s ease-in-out infinite;
+}
+
+.circle-core {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 156px;
+  height: 156px;
+  background: rgba(255, 255, 255, 0.9);
+  border-radius: 50%;
+  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
+
+  svg {
+    width: 86px;
+    height: 86px;
+  }
+}
+
+.circle-item.token button {
+  color: #2d5bff;
+  border-color: rgba(45, 91, 255, 0.16);
+
+  &:hover {
+    background: rgba(45, 91, 255, 0.06);
+  }
+}
+
+.circle-item.workshop {
+  .circle-ring {
+    border-color: rgba(124, 58, 237, 0.15);
+    background: linear-gradient(135deg, rgba(124, 58, 237, 0.06), rgba(236, 72, 153, 0.02));
+    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.06), 0 0 20px rgba(139, 92, 246, 0.12);
+    animation-name: rhythmPulse2;
+    animation-duration: 2.8s;
+  }
+
+  button {
+    color: #7c3aed;
+    border-color: rgba(124, 58, 237, 0.16);
+
+    &:hover {
+      background: rgba(124, 58, 237, 0.06);
+    }
+  }
+}
+
+.circle-item.base {
+  .circle-ring {
+    border-color: rgba(5, 150, 105, 0.15);
+    background: linear-gradient(135deg, rgba(5, 150, 105, 0.06), rgba(45, 91, 255, 0.02));
+    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.06), 0 0 20px rgba(16, 185, 129, 0.12);
+    animation-name: rhythmPulse3;
+    animation-duration: 3s;
+  }
+
+  button {
+    color: #059669;
+    border-color: rgba(5, 150, 105, 0.16);
+
+    &:hover {
+      background: rgba(5, 150, 105, 0.06);
+    }
+  }
+}
+
+.hero-stat-list {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 24px;
+  width: 100%;
+  max-width: 1180px;
+  margin-top: 72px;
+}
+
+.hero-stat-item {
+  position: relative;
+  min-height: 118px;
+  padding: 20px 18px;
+  overflow: hidden;
+  background: rgba(255, 255, 255, 0.86);
+  border: 1px solid rgba(0, 0, 0, 0.06);
+  border-radius: 18px;
+  box-shadow: 0 8px 24px rgba(45, 91, 255, 0.08);
+  backdrop-filter: blur(20px);
+
+  &::before,
+  &::after {
+    content: "";
+    position: absolute;
+    width: 100%;
+    height: 2px;
+    pointer-events: none;
+  }
+
+  &::before {
+    top: 0;
+    left: -100%;
+    background: linear-gradient(90deg, transparent, #2d5bff, transparent);
+    animation: borderMove 3s linear infinite;
+  }
+
+  &::after {
+    right: -100%;
+    bottom: 0;
+    background: linear-gradient(90deg, transparent, #7c3aed, transparent);
+    animation: borderMoveReverse 3s linear infinite;
+  }
+
+  strong {
+    display: block;
+    margin: 8px 0 10px;
+    background: linear-gradient(135deg, #2d5bff 0%, #7c3aed 100%);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    font-size: 36px;
+    line-height: 1;
+  }
+
+  span {
+    color: #666666;
+    font-size: 13px;
+  }
+
+  &.highlight strong {
+    background: linear-gradient(135deg, #f59e0b 0%, #ef4444 100%);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+  }
+}
+
+@keyframes float1 {
+  0%,
+  100% {
+    transform: translate(0, 0);
+  }
+
+  33% {
+    transform: translate(50px, -50px);
+  }
+
+  66% {
+    transform: translate(-30px, 30px);
+  }
+}
+
+@keyframes float2 {
+  0%,
+  100% {
+    transform: translate(0, 0);
+  }
+
+  33% {
+    transform: translate(-40px, 40px);
+  }
+
+  66% {
+    transform: translate(60px, -30px);
+  }
+}
+
+@keyframes float3 {
+  0%,
+  100% {
+    transform: translate(-50%, -50%);
+  }
+
+  33% {
+    transform: translate(calc(-50% + 40px), calc(-50% - 40px));
+  }
+
+  66% {
+    transform: translate(calc(-50% - 30px), calc(-50% + 30px));
+  }
+}
+
+@keyframes sloganShine {
+  0% {
+    background-position: -200% center;
+  }
+
+  100% {
+    background-position: 200% center;
+  }
+}
+
+@keyframes rhythmPulse {
+  0%,
+  100% {
+    box-shadow: 0 4px 12px rgba(45, 91, 255, 0.06), 0 0 20px rgba(59, 130, 246, 0.18);
+  }
+
+  50% {
+    box-shadow: 0 8px 20px rgba(45, 91, 255, 0.1), 0 0 38px rgba(59, 130, 246, 0.25);
+  }
+}
+
+@keyframes rhythmPulse2 {
+  0%,
+  100% {
+    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.06), 0 0 20px rgba(139, 92, 246, 0.18);
+  }
+
+  50% {
+    box-shadow: 0 8px 20px rgba(124, 58, 237, 0.1), 0 0 38px rgba(139, 92, 246, 0.25);
+  }
+}
+
+@keyframes rhythmPulse3 {
+  0%,
+  100% {
+    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.06), 0 0 20px rgba(16, 185, 129, 0.18);
+  }
+
+  50% {
+    box-shadow: 0 8px 20px rgba(5, 150, 105, 0.1), 0 0 38px rgba(16, 185, 129, 0.25);
+  }
+}
+
+@keyframes borderMove {
+  0% {
+    left: -100%;
+  }
+
+  100% {
+    left: 100%;
+  }
+}
+
+@keyframes borderMoveReverse {
+  0% {
+    right: -100%;
+  }
+
+  100% {
+    right: 100%;
+  }
+}
+
+@media (max-width: 1100px) {
+  .public-hero h1 {
+    font-size: 48px;
+  }
+
+  .hero-service-list {
+    gap: 34px;
+  }
+
+  .hero-stat-list {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 768px) {
+  .main-content {
+    padding: 0;
+  }
+
+  .hero-inner {
+    padding: 56px 24px;
+  }
+
+  .hero-service-list {
+    grid-template-columns: 1fr;
+    gap: 48px;
+    max-width: 420px;
+  }
+}
+
+/* 产品列表区域 */
+.productList {
+  position: relative;
+  width: 100%;
+  max-width: 1600px;
+  margin: -8px auto 0;
+  padding: 44px 20px 40px;
+  background: linear-gradient(180deg, rgba(247, 250, 255, 0.92) 0%, rgba(255, 255, 255, 0.98) 42%, rgba(248, 250, 252, 0.96) 100%);
+  border-radius: 28px 28px 0 0;
+
+  @media (max-width: 768px) {
+    padding: 32px 10px 30px;
+  }
+}
+
+.myTab {
+  width: 100%;
+  font-size: 18px;
+  border-radius: 16px;
+  background: #f7f8fc;
+  padding: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 0;
+  flex-wrap: wrap;
+  box-shadow: 0 10px 30px rgba(45, 91, 255, 0.06);
+
+  @media (max-width: 768px) {
+    margin-top: 30px;
+    font-size: 16px;
+  }
+
+  .activeMenu {
+    background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+    color: white;
+  }
+
+  li {
+    transition: all .2s ease-in-out;
+    z-index: 2;
+    padding: 10px 100px;
+    margin: 5px;
+    border-radius: 8px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    cursor: pointer;
+
+    @media (max-width: 768px) {
+      padding: 8px 15px;
+      margin: 3px;
+    }
+  }
+}
+
+/* 分页样式 */
+.el-pagination {
+  padding: 20px 0;
+  display: flex;
+  justify-content: center;
+
+  @media (max-width: 768px) {
+
+    ::v-deep .el-pagination__total,
+    ::v-deep .el-pagination__jump {
+      display: none;
+    }
+  }
+}
+
+/* 响应式设计 */
+@media (max-width: 576px) {
+  .jd-homepage {
+    padding-top: 80px;
+  }
+
+  .main-content {
+    padding: 0;
+  }
+
+  .hero-inner {
+    padding: 42px 18px;
+  }
+
+  .public-hero {
+    min-height: auto;
+  }
+
+  .public-hero h1 {
+    font-size: 34px;
+  }
+
+  .hero-subtitle {
+    margin-bottom: 32px;
+    font-size: 16px;
+  }
+
+  .hero-service-list,
+  .hero-stat-list {
+    grid-template-columns: 1fr;
+    gap: 18px;
+  }
+
+  .circle-ring {
+    width: 156px;
+    height: 156px;
+  }
+
+  .circle-core {
+    width: 126px;
+    height: 126px;
+
+    svg {
+      width: 72px;
+      height: 72px;
+    }
+  }
+
+  .myTab {
+    font-size: 14px;
+    margin-top: 20px;
+  }
+}
+</style>
diff --git a/f/web-kboss/src/views/homePage/mainPage/img/case/beigang-big-data-case.jpg b/f/web-kboss/src/views/homePage/mainPage/img/case/beigang-big-data-case.jpg
new file mode 100644
index 0000000..79c4b04
Binary files /dev/null and b/f/web-kboss/src/views/homePage/mainPage/img/case/beigang-big-data-case.jpg differ
diff --git a/f/web-kboss/src/views/homePage/mainPage/img/case/case-hero-bg.jpg b/f/web-kboss/src/views/homePage/mainPage/img/case/case-hero-bg.jpg
new file mode 100644
index 0000000..e217f76
Binary files /dev/null and b/f/web-kboss/src/views/homePage/mainPage/img/case/case-hero-bg.jpg differ
diff --git a/f/web-kboss/src/views/homePage/mainPage/img/case/china-railway-bidding-case.jpg b/f/web-kboss/src/views/homePage/mainPage/img/case/china-railway-bidding-case.jpg
new file mode 100644
index 0000000..f783796
Binary files /dev/null and b/f/web-kboss/src/views/homePage/mainPage/img/case/china-railway-bidding-case.jpg differ
diff --git a/f/web-kboss/src/views/homePage/mainPage/img/case/nanning-forestry-case.jpg b/f/web-kboss/src/views/homePage/mainPage/img/case/nanning-forestry-case.jpg
new file mode 100644
index 0000000..b8e0f02
Binary files /dev/null and b/f/web-kboss/src/views/homePage/mainPage/img/case/nanning-forestry-case.jpg differ
diff --git a/f/web-kboss/src/views/homePage/mainPage/img/case/ocai-mascot.jpg b/f/web-kboss/src/views/homePage/mainPage/img/case/ocai-mascot.jpg
new file mode 100644
index 0000000..8559ff9
Binary files /dev/null and b/f/web-kboss/src/views/homePage/mainPage/img/case/ocai-mascot.jpg differ
diff --git a/f/web-kboss/src/views/homePage/mainPage/index.vue b/f/web-kboss/src/views/homePage/mainPage/index.vue
index 2fc29f3..72de20c 100644
--- a/f/web-kboss/src/views/homePage/mainPage/index.vue
+++ b/f/web-kboss/src/views/homePage/mainPage/index.vue
@@ -1,1122 +1,1444 @@
 <template>
-  <div class="jd-homepage">
-    <!-- 搜索区域 -->
-    <!-- <div class="search-box">
-      <search></search>
-    </div> -->
-
-    <!-- 主内容区域 -->
-    <main class="main-content">
-      <section id="banner" class="public-hero">
-        <div class="floating-orb orb-1"></div>
-        <div class="floating-orb orb-2"></div>
-        <div class="floating-orb orb-3"></div>
-        <div class="floating-orb orb-4"></div>
-
-        <div class="hero-glow glow-blue"></div>
-        <div class="hero-glow glow-purple"></div>
-        <div class="hero-glow glow-warm"></div>
-
-        <div class="hero-particles">
-          <span v-for="item in 30" :key="item"></span>
+  <div class="home-main-page">
+    <div class="bg-orb bg-orb--1"></div>
+    <div class="bg-orb bg-orb--2"></div>
+    <div class="bg-orb bg-orb--3"></div>
+    <div class="bg-orb bg-orb--4"></div>
+    <!-- 首页头部 -->
+    <section class="home-hero">
+      <div class="home-hero__inner animate-in">
+        <div class="hero-title-row">
+          <h1>一个平台，千行百业</h1>
         </div>
-
-        <div class="hero-inner">
-          <p class="hero-slogan">好用还省钱，Token 就上开元云</p>
-          <h1><span>OPC</span>公共服务平台</h1>
-          <p class="hero-subtitle">
-            为 <strong>OPC</strong> 而生，极致性价比一站式模型平台
-          </p>
-
-          <div class="hero-service-list">
-            <div class="circle-item token" @click="goTokenMarket">
-              <div class="circle-ring">
-                <div class="circle-core">
-                  <svg viewBox="0 0 80 80" aria-hidden="true">
-                    <defs>
-                      <linearGradient id="tokenGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-                        <stop offset="0%" stop-color="#93c5fd" />
-                        <stop offset="50%" stop-color="#3b82f6" />
-                        <stop offset="100%" stop-color="#1d4ed8" />
-                      </linearGradient>
-                    </defs>
-                    <polygon points="40,8 68,24 68,56 40,72 12,56 12,24" fill="rgba(59,130,246,0.18)" stroke="url(#tokenGradient)" stroke-width="2" />
-                    <polygon points="40,18 56,28 56,48 40,58 24,48 24,28" fill="url(#tokenGradient)" opacity="0.75" />
-                    <text x="40" y="45" text-anchor="middle" fill="#fff" font-size="20" font-weight="700">T</text>
-                    <line x1="40" y1="8" x2="40" y2="2" stroke="#60a5fa" stroke-width="1.5" />
-                    <line x1="68" y1="24" x2="74" y2="20" stroke="#60a5fa" stroke-width="1.5" />
-                    <line x1="12" y1="24" x2="6" y2="20" stroke="#60a5fa" stroke-width="1.5" />
-                  </svg>
-                </div>
+        <h2>智能跃迁</h2>
+        <p>让AI无处不在，让智能如此简单</p>
+        <div class="hero-actions">
+          <button type="button" class="use-btn">解决方案</button>
+          <div class="outline-btn" @click="contactSales">联系销售</div>
+        </div>
+      </div>
+    </section>
+    <!-- AI+解决方案 -->
+    <section class="ai-solution-section" @mouseenter="stopSolutionCarousel" @mouseleave="startSolutionCarousel">
+      <div class="ai-solution-inner">
+        <h2 class="section-title">AI+解决方案</h2>
+        <div class="solution-carousel" :class="{ 'is-rotating': isSolutionRotating }">
+          <button type="button" class="carousel-arrow carousel-arrow--prev" @click="prevSolution">
+            <i class="el-icon-arrow-left"></i>
+          </button>
+          <div class="carousel-stage">
+            <div
+              v-for="item in visibleSolutionCards"
+              :key="item.card.title"
+              class="solution-card"
+              :class="`solution-card--slot-${item.slot}`"
+              :style="{ background: item.card.bg, boxShadow: item.card.shadow }"
+              @click="setSolutionIndex(item.index)"
+            >
+              <div class="solution-card__front">
+                <div class="solution-card__icon" v-html="item.card.icon"></div>
+                <h3>{{ item.card.title }}</h3>
+                <span></span>
+                <p>{{ item.card.subtitle }}</p>
               </div>
-              <h3>Token市集</h3>
-              <p>汇聚海量精品模型，以更低成本畅享极致 AI 体验</p>
-              <button type="button" @click.stop="goTokenMarket">立即体验</button>
-            </div>
-
-            <div class="circle-item workshop" @click="goCreativeWorkshop">
-              <div class="circle-ring">
-                <div class="circle-core">
-                  <svg viewBox="0 0 80 80" aria-hidden="true">
-                    <defs>
-                      <linearGradient id="lensGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-                        <stop offset="0%" stop-color="#e9d5ff" />
-                        <stop offset="50%" stop-color="#a855f7" />
-                        <stop offset="100%" stop-color="#7c3aed" />
-                      </linearGradient>
-                    </defs>
-                    <circle cx="40" cy="40" r="32" fill="rgba(139,92,246,0.15)" stroke="url(#lensGradient)" stroke-width="2" />
-                    <circle cx="40" cy="40" r="22" fill="rgba(168,85,247,0.32)" stroke="#c084fc" stroke-width="1.5" />
-                    <circle cx="40" cy="40" r="12" fill="url(#lensGradient)" opacity="0.85" />
-                    <ellipse cx="35" cy="35" rx="6" ry="3" fill="#fff" opacity="0.45" transform="rotate(-30 35 35)" />
-                    <line x1="40" y1="18" x2="40" y2="8" stroke="#c084fc" stroke-width="1.5" />
-                    <line x1="40" y1="62" x2="40" y2="72" stroke="#c084fc" stroke-width="1.5" />
-                    <line x1="18" y1="40" x2="8" y2="40" stroke="#c084fc" stroke-width="1.5" />
-                    <line x1="62" y1="40" x2="72" y2="40" stroke="#c084fc" stroke-width="1.5" />
-                  </svg>
-                </div>
+              <div class="solution-card__detail">
+                <strong>{{ item.card.detailTitle }}</strong>
+                <em>{{ item.card.detailSubTitle }}</em>
+                <p>{{ item.card.detailDesc }}</p>
+                <ul>
+                  <li v-for="metric in item.card.metrics" :key="metric.label">
+                    <b>{{ metric.value }}</b>
+                    <small>{{ metric.label }}</small>
+                  </li>
+                </ul>
               </div>
-              <h3>创镜工坊</h3>
-              <p>以文筑境，以镜生画，全场景 AI 影像创作</p>
-              <button type="button" @click.stop="goCreativeWorkshop">了解更多</button>
-            </div>
-
-            <div class="circle-item base" @click="goCloudBase">
-              <div class="circle-ring">
-                <div class="circle-core">
-                  <svg viewBox="0 0 80 80" aria-hidden="true">
-                    <defs>
-                      <linearGradient id="cloudGradient" x1="0%" y1="0%" x2="100%" y2="100%">
-                        <stop offset="0%" stop-color="#a7f3d0" />
-                        <stop offset="50%" stop-color="#10b981" />
-                        <stop offset="100%" stop-color="#059669" />
-                      </linearGradient>
-                    </defs>
-                    <rect x="14" y="48" width="52" height="14" rx="4" fill="rgba(16,185,129,0.25)" stroke="#34d399" />
-                    <rect x="14" y="32" width="52" height="14" rx="4" fill="rgba(16,185,129,0.38)" stroke="#34d399" />
-                    <rect x="14" y="16" width="52" height="14" rx="4" fill="url(#cloudGradient)" opacity="0.78" stroke="#a7f3d0" />
-                    <circle cx="22" cy="23" r="2" fill="#a7f3d0" />
-                    <circle cx="22" cy="39" r="2" fill="#34d399" />
-                    <circle cx="22" cy="55" r="2" fill="#34d399" />
-                    <line x1="40" y1="30" x2="40" y2="32" stroke="#34d399" stroke-width="1.5" />
-                    <line x1="40" y1="46" x2="40" y2="48" stroke="#34d399" stroke-width="1.5" />
-                    <path d="M56 20 Q60 16 64 20" stroke="#a7f3d0" stroke-width="1.5" fill="none" />
-                    <path d="M54 17 Q60 10 66 17" stroke="#a7f3d0" stroke-width="1.2" fill="none" opacity="0.55" />
-                  </svg>
-                </div>
-              </div>
-              <h3>云枢基座</h3>
-              <p>深耕基础云服务，筑牢 AI 平台数字根基</p>
-              <button type="button" @click.stop="goCloudBase">了解更多</button>
-            </div>
-          </div>
-
-          <div class="hero-stat-list">
-            <div class="hero-stat-item">
-              <strong>50+</strong>
-              <span>精品模型</span>
-            </div>
-            <div class="hero-stat-item">
-              <strong>99.9%</strong>
-              <span>服务可用性</span>
-            </div>
-            <div class="hero-stat-item">
-              <strong>4800+</strong>
-              <span>企业用户</span>
-            </div>
-            <div class="hero-stat-item highlight">
-              <strong>低至0.001</strong>
-              <span>每千Token起步价</span>
             </div>
           </div>
+          <button type="button" class="carousel-arrow carousel-arrow--next" @click="nextSolution">
+            <i class="el-icon-arrow-right"></i>
+          </button>
+        </div>
+        <div class="carousel-dots">
+          <button
+            v-for="(item, index) in solutionCards"
+            :key="item.title"
+            type="button"
+            :class="{ active: index === currentSolutionIndex }"
+            @click="setSolutionIndex(index)"
+          ></button>
+        </div>
+      </div>
+    </section>
+    <!-- 成功案例 -->
+    <section id="cases-section" class="case-section">
+      <div class="case-inner">
+        <div class="case-head">
+          <h2 class="section-title">成功案例</h2>
+          <button type="button" class="case-more" @click="goCases">
+            更多案例
+            <i class="el-icon-right"></i>
+          </button>
         </div>
-      </section>
-    </main>
 
-    <!-- 产品列表区域 -->
-    <!-- <div class="productList">
-      <ul class="myTab">
-        <li v-for="menu in product" :class="currentHotMenu === menu.id ? 'activeMenu' : ''" @click="clickNetMenu(menu)"
-          :key="menu.name">
-          <span class="tab-text">{{ menu.product_category }}</span>
-        </li>
-      </ul>
+        <div class="case-grid">
+          <article
+            v-for="item in caseCards"
+            :key="item.title"
+            class="case-card"
+          >
+            <div class="case-card__inner">
+              <div class="case-card__face case-card__front">
+                <img :src="item.image" :alt="item.title">
+              </div>
+              <div class="case-card__face case-card__back">
+                <div class="case-card__content">
+                  <h3>{{ item.title }}</h3>
+                  <h4>{{ item.name }}</h4>
+                  <p>{{ item.desc }}</p>
+                  <p class="case-card__summary">{{ item.summary }}</p>
+                </div>
+              </div>
+            </div>
+          </article>
+        </div>
 
-      <productCard v-loading="boxLoading" :productList="hotProductList"></productCard>
+        <div class="case-cta" :style="{ backgroundImage: `url(${caseCtaBg})` }">
+          <div>
+            <h2>想了解这些方案如何落地</h2>
+            <p>获取行业专属 AI 解决方案</p>
+          </div>
+          <button type="button" @click="contactSales">联系我们 →</button>
+        </div>
+      </div>
+    </section>
+    <!-- 企业动态 -->
+    <section id="news" class="news-section">
+      <div class="news-glow news-glow--left"></div>
+      <div class="news-glow news-glow--right"></div>
+      <div class="news-glow news-glow--center"></div>
 
-      <el-pagination @current-change="handleCurrentChange" :page-size="page_size" layout="total, prev, pager, next"
-        :total="total">
-      </el-pagination>
-    </div> -->
+      <div class="news-inner">
+        <div class="news-head">
+          <h2 class="section-title">企业动态</h2>
+          <button type="button" class="case-more" @click="goNews">查看更多 →</button>
+        </div>
 
-    <!-- 发布商品/需求对话框 -->
-    <!-- <el-dialog :title="publish_type === '2' ? '发布需求' : '发布商品'" width="60vw" top="5vh"
-      :visible.sync="sendProductVisible">
-      <sendProduct :isEdit="false" v-if="publish_type" @success="sendProductSuccess" :publish_type="publish_type">
-      </sendProduct>
-    </el-dialog> -->
+        <div class="news-list">
+          <article
+            v-for="(item, index) in newsList"
+            :key="item.title"
+            class="news-card"
+            :class="{ 'news-card-active': index === activeNewsIndex }"
+            @mouseenter="activeNewsIndex = index"
+            @mouseleave="activeNewsIndex = 0"
+            @click="goNews"
+          >
+            <div class="news-card-glow"></div>
+            <div class="news-card-border"></div>
+            <div class="news-card__content">
+              <div class="news-card__meta">
+                <span :class="item.tagClass">{{ item.tag }}</span>
+                <time>{{ item.date }}</time>
+              </div>
+              <h2>{{ item.title }}</h2>
+              <p>{{ item.desc }}</p>
+            </div>
+          </article>
+        </div>
+      </div>
+    </section>
 
-    <!-- 提示对话框 -->
-    <el-dialog title="温馨提示" :visible.sync="showTip" width="30%">
-      <span>您还没有完善企业信息，完善企业信息审核通过后您可以发布需求与商品。</span>
-      <span slot="footer" class="dialog-footer">
-        <span>
-          <span style="margin-right: 10px;">跳转到</span>
-          <el-button size="small" type="primary" @click="goInfo">信息完善</el-button>
-        </span>
-      </span>
-    </el-dialog>
+    <Talk></Talk>
   </div>
 </template>
 
 <script>
-import Vue from 'vue'
-import { reqPublishProductSearchFirstPage, reqEnterpriseAuditInfoSearch, reqHomepageProductCategory, reqGetSupplyAndDemandSquareList } from '@/api/ncmatch'
-import { mapGetters, mapState } from "vuex";
-import { gotoYuanJingAPI } from '@/api/gotoYuanJing'
+import Talk from '@/views/homePage/dialog/talk/index.vue'
 
-export default Vue.extend({
-  name: "mainPage",
+export default {
+  name: 'HomeMainPage',
   components: {
-    // sendProduct: () => import('../ncmatch/sendProduct/index.vue'),
-    // productCard: () => import('./productCard/index.vue'),
-    // search: () => import('../search/index.vue'),
-    // menuAside: () => import('./menuAside/index.vue')
-  },
-  created() {
-    this.getHomepageProductCategory()
+    Talk
   },
   data() {
     return {
-      boxLoading: false,
-      selectedCategory: "",
-      showTip: false,
-      total: 0,
-      publish_type: null,
-      sendProductVisible: false,
-      currentHotMenu: "",
-      product: [],
-      hotProductList: [],
-      current_page: 1,
-      page_size: 8,
+      solutionTimer: null,
+      solutionAnimationTimer: null,
+      isSolutionRotating: false,
+      currentSolutionIndex: 0,
+      activeNewsIndex: 0,
+      caseCtaBg: require('./img/case/case-hero-bg.jpg'),
+      caseCards: [
+        {
+          name: '中国中铁 · 慧投标智能体',
+          title: '智慧工程',
+          desc: 'AI驱动投标全流程，从标书解读到报价编制，中标率提升显著',
+          summary: '项目概况:为中国中铁打造慧投标智能体+慧途大模型，建立联合创新中心与AI应用创新平台。覆盖投标全流程——标书智能解读、资审自动匹配、报价辅助决策、标书智能编制，实现投标工作从人海战术到AI赋能的跨越式升级。',
+          image: require('./img/case/china-railway-bidding-case.jpg')
+        },
+        {
+          name: '南宁林业局',
+          title: '智慧采伐',
+          desc: '从采伐审批到科学监管——空间智能融合，让数据真正服务林区治理。',
+          summary: '项目概况:为南宁林业局打造林业空间采伐智审系统，融合GIS空间分析、卫星遥感、无人机与传感器多源数据，实现空间与属性数据的一体化智能审核。采伐范围自动核验合规性，审查报告一键生成，审批周期从数天压缩至分钟级，人机协同让每一步决策都有据可依。',
+          image: require('./img/case/nanning-forestry-case.jpg')
+        },
+        {
+          name: '北港大数据',
+          title: 'AI赋能，数智升级',
+          desc: '从投标到决策，从合同到管理——全链路AI智能体，让业务快人一步',
+          summary: '项目概况:为北港大数据打造覆盖招投标、投研分析、合同审查的全链路AI智能体解决方案。以投标智能体引擎实现标书秒级生成、中标率显著提升；以投策智能体引擎将数周研报压缩至分钟级，支撑精准投资决策；以合同智能审查将审查效率提升60%以上，风险漏检率降至3%以下。三款产品无缝衔接，真正打通企业从业务承接到风险管控的数字化闭环',
+          image: require('./img/case/beigang-big-data-case.jpg')
+        }
+      ],
+      newsList: [
+        {
+          tag: '企业动态',
+          tagClass: 'news-tag--blue',
+          date: '2026.6.15',
+          title: '开元云随贸促会走访东盟',
+          desc: '开元云科技随贸促会广西分会经贸代表团密集出访越南、老挝，深度参与区域 AI 产业合作与数字经济交流。'
+        },
+        {
+          tag: '企业动态',
+          tagClass: 'news-tag--green',
+          date: '2026.05.17',
+          title: '开元云荣登福布斯中国人工智能商业落地示范企业',
+          desc: '凭借 AI 智能体工厂的工业级交付能力与央国企标杆案例，开元云入选福布斯中国人工智能商业落地示范企业。'
+        }
+      ],
+      solutionCards: [
+        {
+          title: '群智协作',
+          subtitle: '多智能体协同',
+          detailTitle: '慧投标智能体',
+          detailSubTitle: '基于 Agent+RAG+LangGraph 多节点编排，实现招投标全流程 AI 化',
+          detailDesc: '从标书解读、资质匹配到内容生成，多智能体协同提升投标作业效率。',
+          metrics: [
+            { value: '10倍+', label: '效率提升' },
+            { value: '80%', label: '废标率降低' },
+            { value: '35%', label: '中标率提升' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(208, 236, 249, 0.72) 0%, rgba(168, 216, 244, 0.64) 44%, rgba(124, 196, 238, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(80, 150, 220, 0.2), 0 4px 16px rgba(80, 150, 220, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="24" cy="18" r="6"/><circle cx="10" cy="34" r="5"/><circle cx="38" cy="34" r="5"/><line x1="20" y1="23" x2="13" y2="30"/><line x1="28" y1="23" x2="35" y2="30"/><circle cx="36" cy="14" r="3.5"/><circle cx="12" cy="14" r="3.5"/></svg>'
+        },
+        {
+          title: '一问即达',
+          subtitle: '智能问答知识库',
+          detailTitle: '智能知识问答',
+          detailSubTitle: '燃机 AI 诊断助手',
+          detailDesc: '融合专家知识库，支持中英文自然语言多轮对话，自动生成诊断建议。',
+          metrics: [
+            { value: '<3s', label: '诊断响应' },
+            { value: '90%', label: '知识覆盖' },
+            { value: '5倍', label: '决策效率提升' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(224, 208, 242, 0.72) 0%, rgba(200, 176, 230, 0.64) 44%, rgba(170, 142, 216, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(130, 80, 180, 0.18), 0 4px 16px rgba(130, 80, 180, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="6" y="8" width="36" height="28" rx="4"/><path d="M6 16h36"/><circle cx="24" cy="28" r="3"/><path d="M18 28h1"/><path d="M29 28h1"/><path d="M18 42h12"/></svg>'
+        },
+        {
+          title: '空间觉醒',
+          subtitle: 'GIS智能分析',
+          detailTitle: '林业采伐空间智审',
+          detailSubTitle: 'AI+GIS 深度融合，智能识别禁伐区、历史采伐点',
+          detailDesc: '输出合规性报告，辅助采伐审批与空间治理。',
+          metrics: [
+            { value: '分钟级', label: '审批周期' },
+            { value: '90%', label: '违规识别提升' },
+            { value: '70%', label: '节省人力' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(200, 238, 218, 0.72) 0%, rgba(152, 216, 184, 0.64) 44%, rgba(104, 194, 150, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(60, 150, 100, 0.18), 0 4px 16px rgba(60, 150, 100, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="24" cy="24" r="18"/><ellipse cx="24" cy="24" rx="10" ry="18"/><line x1="6" y1="24" x2="42" y2="24"/><path d="M8 16h32"/><path d="M8 32h32"/><path d="M24 6v36"/></svg>'
+        },
+        {
+          title: '全程守护',
+          subtitle: '设备智能监控',
+          detailTitle: '三维可视化监盘系统',
+          detailSubTitle: '自动告警高亮定位，降低运维人员技能门槛',
+          detailDesc: '一机一策三维可视化，实时监控设备关键点位。',
+          metrics: [
+            { value: '1000+', label: '监控点位' },
+            { value: '<1s', label: '告警响应' },
+            { value: '40%', label: '成本降低' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(251, 230, 200, 0.72) 0%, rgba(245, 205, 160, 0.64) 44%, rgba(238, 180, 120, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(190, 130, 50, 0.18), 0 4px 16px rgba(190, 130, 50, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="8" y="10" width="32" height="22" rx="3"/><path d="M18 36h12"/><line x1="24" y1="32" x2="24" y2="36"/><path d="M16 20l4 4 6-8"/><circle cx="38" cy="12" r="4"/></svg>'
+        },
+        {
+          title: '先见一步',
+          subtitle: '智能预测引擎',
+          detailTitle: '燃机智慧监盘',
+          detailSubTitle: 'AI 预测引擎+TDengine 时序数据库',
+          detailDesc: '从被动响应到主动预警，保障设备稳定运行。',
+          metrics: [
+            { value: '95%+', label: '预警准确率' },
+            { value: '60%', label: '停机时间减少' },
+            { value: '72h', label: '提前预警' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(214, 240, 224, 0.72) 0%, rgba(168, 222, 190, 0.64) 44%, rgba(122, 204, 158, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(60, 150, 100, 0.18), 0 4px 16px rgba(60, 150, 100, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M6 38l10-12 8 6 10-16 8 10"/><polyline points="36,22 42,26 38,32"/><line x1="6" y1="40" x2="42" y2="40"/><path d="M6 8v32"/></svg>'
+        },
+        {
+          title: '触文即懂',
+          subtitle: '智能文档解析',
+          detailTitle: '招标文件智能解析',
+          detailSubTitle: 'AI 自动读取招标文件，结构化提取关键信息',
+          detailDesc: '精准识别资质要求、评分标准和关键条款，辅助人工快速审查。',
+          metrics: [
+            { value: '98%+', label: '解析准确率' },
+            { value: '85%', label: '核查时间减少' },
+            { value: '0漏', label: '关键信息' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(200, 214, 242, 0.72) 0%, rgba(158, 180, 230, 0.64) 44%, rgba(116, 146, 216, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(60, 80, 160, 0.18), 0 4px 16px rgba(60, 80, 160, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 6h16l10 10v26a4 4 0 0 1-4 4H12a4 4 0 0 1-4-4V10a4 4 0 0 1 4-4z"/><polyline points="28,6 28,16 38,16"/><line x1="14" y1="24" x2="34" y2="24"/><line x1="14" y1="31" x2="30" y2="31"/></svg>'
+        },
+        {
+          title: '洞察入微',
+          subtitle: '机器视觉检测',
+          detailTitle: '零碳铝板缺陷检测',
+          detailSubTitle: 'YOLO 目标检测+TensorRT 边缘推理',
+          detailDesc: '毫秒级实时质检，替代人工目检，提升产线检测稳定性。',
+          metrics: [
+            { value: 'ms级', label: '检测速度' },
+            { value: '95%+', label: '漏检率降低' },
+            { value: '25%', label: '产能提升' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(192, 222, 239, 0.72) 0%, rgba(136, 194, 224, 0.64) 44%, rgba(80, 166, 208, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(40, 110, 170, 0.18), 0 4px 16px rgba(40, 110, 170, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 24s8-14 20-14 20 14 20 14-8 14-20 14S4 24 4 24z"/><circle cx="24" cy="24" r="7"/><circle cx="24" cy="24" r="3"/><line x1="24" y1="6" x2="24" y2="10"/><line x1="24" y1="38" x2="24" y2="42"/></svg>'
+        },
+        {
+          title: '端侧即算',
+          subtitle: '边缘AI推理',
+          detailTitle: '边缘实时质检',
+          detailSubTitle: 'TensorRT 优化模型，边缘端毫秒级推理',
+          detailDesc: '无需上传云端，保障数据安全并适配 7x24 小时连续运行。',
+          metrics: [
+            { value: '<50ms', label: '推理延迟' },
+            { value: '本地', label: '数据不出厂' },
+            { value: '7x24', label: '持续运行' }
+          ],
+          bg: 'linear-gradient(145deg, rgba(216, 204, 240, 0.72) 0%, rgba(184, 164, 226, 0.64) 44%, rgba(150, 124, 212, 0.58) 100%)',
+          shadow: '0 18px 54px rgba(90, 60, 160, 0.18), 0 4px 16px rgba(90, 60, 160, 0.08)',
+          icon: '<svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="10" y="10" width="28" height="28" rx="4"/><rect x="16" y="16" width="16" height="16" rx="2"/><line x1="18" y1="6" x2="18" y2="10"/><line x1="24" y1="6" x2="24" y2="10"/><line x1="30" y1="6" x2="30" y2="10"/><line x1="18" y1="38" x2="18" y2="42"/><line x1="24" y1="38" x2="24" y2="42"/><line x1="30" y1="38" x2="30" y2="42"/></svg>'
+        }
+      ]
     }
   },
   computed: {
-    ...mapGetters(["sidebar", "avatar", "device"]),
-    ...mapState({
-      isShowPanel: (state) => state.product.showHomeNav,
-      navIndex: (state) => state.product.navIndex,
-      gridObj: state => state.operationAnalysis.gridObj,
-      mybalance: state => state.user.mybalance,
-      logoutUrl: state => state.login.logoutUrl,
-      loginStateVuex: state => state.login.loginState,
-      logoInfoNew: state => state.product.logoInfoNew,
-    }),
-    loginState() {
-      const userId = sessionStorage.getItem('userId');
-      return this.loginStateVuex || (userId !== null && userId !== 'null' && userId !== '');
+    showTalkVisible() {
+      return this.$store.state.product.showTalk
     },
+    visibleSolutionCards() {
+      const slots = [-3, -2, -1, 0, 1, 2, 3]
+      const len = this.solutionCards.length
+      return slots.map((slot) => {
+        const index = (this.currentSolutionIndex + slot + len) % len
+        return {
+          slot,
+          index,
+          card: this.solutionCards[index]
+        }
+      })
+    }
   },
-  methods: {
-    goTokenMarket() {
-      if (!this.loginState) {
-        this.$router.push({
-          path: '/tokenMarket',
-          query: {
-            category: 'TOKEN市集',
-            from: 'home',
-            single: '1'
-          }
-        })
-        return
-      }
-      this.$router.push({
-        path: '/product',
-        query: {
-          category: 'TOKEN市集',
-          from: 'home'
-        }
-      })
-    },
-    goCloudBase() {
-      if (!this.loginState) {
-        this.$message.warning('请先登录哦~')
-        return
-      }
-      this.$router.push({
-        path: '/product',
-        query: {
-          category: '基础云',
-          from: 'home'
-        }
-      })
-    },
-    getHomepageProductCategory() {
-      reqHomepageProductCategory({
-        url_link: window.location.href,
-        publish_type: "1"
-      }).then(res => {
-        if (res.status) {
-          this.categories = res.data
-          this.product = res.data
-          this.currentHotMenu = res.data[0].id
-          this.selectedCategory = res.data[0].id
-          this.initData()
-        }
-      })
-    },
-    goInfo() {
-      this.showTip = false
-      this.$router.push('/customer/approve')
-    },
-    async goCreativeWorkshop() {
-      if (!this.loginState) {
-        window.open('https://ai.opencomputing.cn/', '_blank')
-        return
-      }
-
-      const yuanJingWindow = window.open('', '_blank')
-
-      try {
-        const res = await gotoYuanJingAPI({
-          user_id: sessionStorage.getItem('userId')
-        })
-
-        const deerer = this.getYuanJingAuthorization(res)
-
-        if (!deerer) {
-          if (yuanJingWindow) {
-            yuanJingWindow.close()
-          }
-          this.$message.error((res && res.msg) || '获取元境授权参数失败')
-          return
-        }
-
-        const loginUrl = `https://ai.opencomputing.cn/#/getCookie?deerer=${encodeURIComponent(deerer)}`
-
-        if (yuanJingWindow) {
-          yuanJingWindow.location.href = loginUrl
-        } else {
-          window.location.href = loginUrl
-        }
-      } catch (error) {
-        if (yuanJingWindow) {
-          yuanJingWindow.close()
-        }
-        this.$message.error('跳转元境失败，请稍后重试')
-      }
-    },
-    getYuanJingAuthorization(res) {
-      if (!res) {
-        return ''
-      }
-
-      if (typeof res === 'string') {
-        return res
-      }
-
-      const data = res.data || res
-      if (typeof data === 'string') {
-        return data
-      }
-
-      return data.Authorization || data.authorization || data.token || data.header || data.value || ''
-    },
-    handleCurrentChange(val) {
-      this.current_page = val
-      this.initData()
-    },
-    sendInfo(type) {
-      if (this.loginState) {
-        reqEnterpriseAuditInfoSearch({
-          url_link: window.location.href,
-        }).then(res => {
-          const dataList = res && res.data && res.data.data
-          const hasAuditInfo = Array.isArray(dataList) && dataList.length !== 0
-          const roles = sessionStorage.getItem('jueseNew')
-          const isCustomer = roles ? roles.includes('客户') : true
-
-          // 安全检查：确保 data[0] 存在
-          if (hasAuditInfo && dataList[0]) {
-            const auditStatus = dataList[0].audit_status
-
-            if (auditStatus === 'pending') {
-              this.$message.warning('您的审核状态为待审核，请等待审核通过后发布~')
-            } else if (auditStatus === 'rejected') {
-              this.$message.warning('您的审核状态为驳回，请重新提交~')
-            } else {
-              // 审核通过或其他状态，允许发布
-              this.publish_type = type
-              this.sendProductVisible = true
-            }
-          } else if (!isCustomer) {
-            // 非客户角色，允许发布
-            this.publish_type = type
-            this.sendProductVisible = true
-          } else {
-            // 没有审核信息且是客户角色，显示提示
-            this.showTip = true
-          }
-        })
+  watch: {
+    showTalkVisible(value) {
+      if (value) {
+        this.stopSolutionCarousel()
       } else {
-        this.$router.push('/login')
-      }
-    },
-    initData() {
-      this.boxLoading = true
-      let ploay = {
-        product_category: this.selectedCategory,
-        to_page: "first_page",
-        url_link: window.location.href,
-        page_size: this.page_size,
-        current_page: this.current_page,
-        publish_type: "1"
-      }
-      reqGetSupplyAndDemandSquareList(ploay).then(res => {
-        this.boxLoading = false
-        if (res.status) {
-          if (res.data.length === 0) {
-            this.hotProductList = []
-            this.total = 0
-          } else {
-            this.hotProductList = res.data[0].product_list
-            this.total = res.data[0].total_count
-          }
-        }
-      })
-    },
-    init_product_list() {
-      reqPublishProductSearchFirstPage({
-        publish_type: "1",
-        url_link: window.location.href,
-        to_page: 'first_page',
-        page_size: this.page_size,
-        current_page: this.current_page,
-        product_type: this.currentHotMenu
-      }).then(res => {
-        if (res.status) {
-          if (res.data.length > 0) {
-            this.currentHotMenu = res.data[0].id
-            this.hotProductList = res.data[0].product_list
-            this.product = res.data
-            this.total = res.data[0].total_count
-          }
-        }
-      })
-    },
-    sendProductSuccess() {
-      this.sendProductVisible = false; // 关闭弹窗
-      this.init_product_list()
-    },
-    clickNetMenu(menu) {
-      this.current_page = 1
-      this.currentHotMenu = menu.id;
-      this.selectedCategory = menu.id
-      this.initData()
-    },
-    goFavorite() {
-      if (this.loginState) {
-        this.$router.push('/ncmatchHome/favoriteBox')
-      } else {
-        this.$router.push('/login')
-      }
-    },
-    goHistory() {
-      if (this.loginState) {
-        this.$router.push('/ncmatchHome/historyBox')
-      } else {
-        this.$router.push('/login')
+        this.startSolutionCarousel()
       }
     }
+  },
+  mounted() {
+    this.startSolutionCarousel()
+  },
+  beforeDestroy() {
+    this.stopSolutionCarousel()
+    if (this.solutionAnimationTimer) {
+      window.clearTimeout(this.solutionAnimationTimer)
+      this.solutionAnimationTimer = null
+    }
+  },
+  methods: {
+    navigateTo(path) {
+      if (this.$route.path === path) return
+      this.$router.push(path).catch((error) => {
+        if (!error || error.name !== 'NavigationDuplicated') {
+          throw error
+        }
+      })
+    },
+    goSolution() {
+      this.navigateTo('/homePage/opc')
+    },
+    contactSales() {
+      this.$store.commit('setShowTalk', true)
+    },
+    goCases() {
+      this.navigateTo('/homePage/agentStore')
+    },
+    goNews() {
+      this.navigateTo('/homePage/new')
+    },
+  
+    nextSolution() {
+      this.switchSolution(1)
+    },
+    prevSolution() {
+      this.switchSolution(-1)
+    },
+    setSolutionIndex(index) {
+      if (index === this.currentSolutionIndex) return
+      this.switchSolution(index - this.currentSolutionIndex)
+      this.restartSolutionCarousel()
+    },
+    switchSolution(step) {
+      if (this.solutionAnimationTimer) {
+        window.clearTimeout(this.solutionAnimationTimer)
+      }
+      this.isSolutionRotating = false
+      this.$nextTick(() => {
+        this.isSolutionRotating = true
+        this.solutionAnimationTimer = window.setTimeout(() => {
+          this.isSolutionRotating = false
+          this.solutionAnimationTimer = null
+        }, 720)
+      })
+      this.currentSolutionIndex = (this.currentSolutionIndex + step + this.solutionCards.length) % this.solutionCards.length
+    },
+    startSolutionCarousel() {
+      if (this.solutionTimer) return
+      this.solutionTimer = window.setInterval(this.prevSolution, 2200)
+    },
+    stopSolutionCarousel() {
+      if (!this.solutionTimer) return
+      window.clearInterval(this.solutionTimer)
+      this.solutionTimer = null
+    },
+    restartSolutionCarousel() {
+      this.stopSolutionCarousel()
+      this.startSolutionCarousel()
+    }
   }
-})
+}
 </script>
 
 <style scoped lang="scss">
-.jd-homepage {
-  margin: 0;
-  // padding-top: 92px;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-  background: linear-gradient(180deg, #f0f7ff 0%, #ffffff 46%, #f7faff 74%, #f8fafc 100%);
+.home-main-page {
+  min-height: 100vh;
+  background-color: #f0f7ff !important;
+  background-image: linear-gradient(180deg, #f0f7ff 0%, #ffffff 60%, #f5f8ff 100%) !important;
+  color: #111827;
   overflow-x: hidden;
+  overflow-y: visible;
+  position: relative;
 }
 
-.search-box {
-  max-width: 1280px;
-  margin: 0 auto 18px;
-  padding: 0 24px;
+.home-main-page > :not(.bg-orb) {
+  position: relative;
+  z-index: 1;
 }
 
-/* 主内容区域 */
-.main-content {
-  width: 100%;
-  padding: 0;
+.bg-orb {
+  position: fixed;
+  border-radius: 50%;
+  filter: blur(80px);
+  opacity: 0.3;
+  z-index: 0;
+  pointer-events: none;
 }
 
-/* 横幅样式 */
-.public-hero {
-  width: 100%;
+.bg-orb--1 {
+  width: 400px;
+  height: 400px;
+  background: #3b82f6;
+  top: -100px;
+  left: -100px;
+}
+
+.bg-orb--2 {
+  width: 500px;
+  height: 500px;
+  background: #3b82f6;
+  bottom: -150px;
+  right: -150px;
+}
+
+.bg-orb--3 {
+  width: 300px;
+  height: 300px;
+  background: #ec4899;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.bg-orb--4 {
+  width: 350px;
+  height: 350px;
+  background: #f59e0b;
+  bottom: 30%;
+  right: 20%;
+}
+
+body.dark-theme .home-main-page {
+  background: #0f172a !important;
+}
+
+body.dark-theme .bg-orb {
+  opacity: 0.4;
+}
+
+.home-hero {
+  position: relative;
   min-height: 760px;
-  margin: 0 auto;
-  overflow: hidden;
-  position: relative;
-  color: #111827;
-  background:
-    radial-gradient(circle at 16% 18%, rgba(45, 91, 255, 0.12), transparent 28%),
-    radial-gradient(circle at 82% 28%, rgba(124, 58, 237, 0.1), transparent 30%),
-    radial-gradient(circle at 50% 52%, rgba(245, 158, 11, 0.08), transparent 36%),
-    linear-gradient(180deg, #f0f7ff 0%, #ffffff 66%, #f7faff 88%, #f8fafc 100%);
-}
-
-.hero-inner {
-  position: relative;
-  z-index: 3;
   display: flex;
-  flex-direction: column;
   align-items: center;
-  max-width: 1280px;
-  margin: 0 auto;
-  padding: 76px 48px 64px;
+  justify-content: center;
+  padding: 120px 24px 96px;
+  box-sizing: border-box;
+  overflow: hidden;
+  background: transparent;
+}
+
+.home-hero__inner {
+  position: relative;
+  z-index: 2;
+  max-width: 1180px;
+  margin-top: 90px;
   text-align: center;
-}
 
-.hero-slogan {
-  margin: 0 0 28px;
-  font-size: 18px;
-  font-weight: 600;
-  letter-spacing: 0.04em;
-  background: linear-gradient(90deg, #f59e0b 0%, #ef4444 25%, #f59e0b 50%, #2d5bff 75%, #f59e0b 100%);
-  background-size: 200% auto;
-  -webkit-background-clip: text;
-  background-clip: text;
-  color: transparent;
-  animation: sloganShine 4s linear infinite;
-}
+  h1 {
+    margin: 0;
+    color: #111827;
+    font-size: 72px;
+    line-height: 1.18;
+    font-weight: 800;
+    letter-spacing: 0.02em;
+  }
 
-.public-hero h1 {
-  margin: 0;
-  color: #111827;
-  font-size: 64px;
-  line-height: 1.1;
-  font-weight: 800;
-  letter-spacing: 0.02em;
-
-  span {
-    margin: 0 4px;
-    background: linear-gradient(135deg, #2d5bff 0%, #7c3aed 100%);
+  h2 {
+    margin: 20px 0 0;
+    font-size: 72px;
+    line-height: 1.12;
+    font-weight: 800;
+    background: linear-gradient(135deg, #2563eb 0%, #3b82f6 50%, #6366f1 100%);
     -webkit-background-clip: text;
     background-clip: text;
     color: transparent;
   }
-}
 
-.hero-subtitle {
-  max-width: 760px;
-  margin: 22px auto 70px;
-  color: #666666;
-  font-size: 22px;
-  line-height: 1.7;
-
-  strong {
-    color: #2d5bff;
+  p {
+    margin: 28px auto 0;
+    // max-width: 760px;
+    color: #4b5563;
+    font-size: 18px;
+    color: rgb(107 114 128 / var(--tw-text-opacity, 1));
     font-weight: 700;
+    line-height: 1.7;
+    letter-spacing: 0.08em;
   }
 }
 
-.floating-orb {
-  position: absolute;
-  border-radius: 50%;
-  filter: blur(80px);
-  opacity: 0.08;
-  pointer-events: none;
-  z-index: 0;
-
-  &.orb-1 {
-    top: -110px;
-    left: -100px;
-    width: 400px;
-    height: 400px;
-    background: #3b82f6;
-    animation: float1 20s ease-in-out infinite;
-  }
-
-  &.orb-2 {
-    right: -150px;
-    bottom: -160px;
-    width: 500px;
-    height: 500px;
-    background: #8b5cf6;
-    animation: float2 25s ease-in-out infinite;
-  }
-
-  &.orb-3 {
-    left: 50%;
-    top: 50%;
-    width: 300px;
-    height: 300px;
-    background: #ec4899;
-    animation: float3 18s ease-in-out infinite;
-  }
-
-  &.orb-4 {
-    right: 20%;
-    bottom: 30%;
-    width: 350px;
-    height: 350px;
-    background: #f59e0b;
-    animation: float1 22s ease-in-out infinite reverse;
-  }
+.hero-title-row {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  flex-wrap: wrap;
 }
 
-.hero-glow {
-  position: absolute;
-  border-radius: 50%;
-  pointer-events: none;
-  z-index: 1;
-
-  &.glow-blue {
-    top: 90px;
-    left: 9%;
-    width: 360px;
-    height: 360px;
-    background: rgba(59, 130, 246, 0.18);
-    filter: blur(120px);
-  }
-
-  &.glow-purple {
-    right: 8%;
-    bottom: 120px;
-    width: 480px;
-    height: 480px;
-    background: rgba(168, 85, 247, 0.16);
-    filter: blur(150px);
-  }
-
-  &.glow-warm {
-    left: 50%;
-    top: 43%;
-    width: 560px;
-    height: 560px;
-    background: rgba(245, 158, 11, 0.08);
-    filter: blur(180px);
-    transform: translate(-50%, -50%);
-  }
+.hero-actions {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 16px;
+  margin-top: 36px;
 }
 
-.hero-particles {
-  position: absolute;
-  inset: 0;
-  z-index: 1;
-  overflow: hidden;
-  pointer-events: none;
-
-  span {
-    position: absolute;
-    width: 4px;
-    height: 4px;
-    background: rgba(45, 91, 255, 0.12);
-    border-radius: 50%;
-    animation: particleFloat 8s linear infinite;
-
-    @for $i from 1 through 30 {
-      &:nth-child(#{$i}) {
-        left: #{($i * 17) % 100}#{'%'};
-        top: #{($i * 29) % 100}#{'%'};
-        width: #{2 + ($i % 4)}px;
-        height: #{2 + ($i % 4)}px;
-        animation-delay: #{($i % 8) * 0.45}s;
-        animation-duration: #{6 + ($i % 6)}s;
-      }
-    }
-
-    &:nth-child(4n) {
-      background: rgba(16, 185, 129, 0.16);
-    }
-
-    &:nth-child(4n + 1) {
-      background: rgba(59, 130, 246, 0.16);
-    }
-
-    &:nth-child(4n + 2) {
-      background: rgba(139, 92, 246, 0.16);
-    }
-
-    &:nth-child(4n + 3) {
-      background: rgba(236, 72, 153, 0.14);
-    }
-  }
-}
-
-@keyframes particleFloat {
-  0% {
-    transform: translateY(0) scale(0);
-    opacity: 0;
-  }
-
-  10% {
-    transform: translateY(-20px) scale(1);
-    opacity: 1;
-  }
-
-  90% {
-    transform: translateY(-200px) scale(1);
-    opacity: 1;
-  }
-
-  100% {
-    transform: translateY(-240px) scale(0.5);
-    opacity: 0;
-  }
-}
-
-.hero-service-list {
-  display: grid;
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-  gap: 72px;
-  width: 100%;
-  max-width: 900px;
-}
-
-.circle-item {
+.use-btn,
+.outline-btn {
+  min-width: 128px;
+  height: 48px;
+  padding: 0 32px;
+  border-radius: 999px;
   cursor: pointer;
-  color: #111827;
-  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+  font-size: 16px;
+  font-weight: 600;
+  transition: all 0.25s ease;
+}
+
+.use-btn {
+  border: 0;
+  color: #fff;
+  background: #000;
+  box-shadow: 0 12px 28px rgba(37, 90, 255, 0.22);
 
   &:hover {
-    transform: scale(1.08) translateY(-10px);
+    transform: translateY(-2px);
+    box-shadow: 0 16px 34px rgba(37, 90, 255, 0.3);
+  }
+}
+
+.outline-btn {
+  // border: 1px solid rgba(37, 90, 255, 0.24);
+  color: #000;
+  // background: rgba(255, 255, 255, 0.72);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  
+  &:hover {
+    background: #fff;
+    transform: translateY(-2px);
+  }
+}
+
+.ai-solution-section {
+  position: relative;
+  padding: 60px 24px 110px;
+  overflow: hidden;
+  background: transparent;
+}
+
+.ai-solution-inner {
+  position: relative;
+  max-width: 1280px;
+  margin: 0 auto;
+}
+
+.section-title {
+  margin: 0 0 32px;
+  color: #111827;
+  font-size: 32px;
+  line-height: 1.3;
+  font-weight: 800;
+}
+
+.solution-carousel {
+  position: relative;
+  overflow: visible;
+}
+
+.carousel-stage {
+  position: relative;
+  min-height: 430px;
+  perspective: 1200px;
+  overflow: visible;
+}
+
+.solution-carousel.is-rotating {
+  .solution-card {
+    transition-duration: 1.05s;
+  }
+
+  .solution-card--slot-0 {
+    animation: centerCardSpin 0.72s cubic-bezier(0.22, 1, 0.36, 1);
+  }
+
+  .solution-card--slot-0 .solution-card__icon {
+    animation: iconRoundSpin 0.72s cubic-bezier(0.22, 1, 0.36, 1);
+  }
+}
+
+.solution-card {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  width: 31%;
+  min-height: 330px;
+  border-radius: 20px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 28px 20px;
+  cursor: pointer;
+  color: rgba(30, 40, 60, 0.88);
+  border: 1px solid rgba(255, 255, 255, 0.46);
+  backdrop-filter: blur(18px) saturate(1.4);
+  -webkit-backdrop-filter: blur(18px) saturate(1.4);
+  transform: translateX(-50%);
+  transition: transform 1.05s cubic-bezier(0.22, 1, 0.36, 1), opacity 1.05s ease, filter 1.05s ease;
+  box-sizing: border-box;
+
+  &::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+    border-radius: inherit;
+    background: radial-gradient(circle at 30% 18%, rgba(255, 255, 255, 0.48), transparent 42%);
+    pointer-events: none;
   }
 
   h3 {
-    margin: 24px 0 12px;
-    color: #1a1a1a;
+    position: relative;
+    z-index: 1;
+    margin: 24px 0 8px;
     font-size: 24px;
+    line-height: 1.3;
+    font-weight: 800;
+    letter-spacing: 2px;
+  }
+
+  span {
+    position: relative;
+    z-index: 1;
+    width: 28px;
+    height: 2px;
+    margin-bottom: 12px;
+    border-radius: 1px;
+    background: rgba(30, 40, 60, 0.2);
+  }
+
+  p {
+    position: relative;
+    z-index: 1;
+    margin: 0;
+    color: rgba(30, 40, 60, 0.6);
+    font-size: 16px;
+    line-height: 1.6;
+    letter-spacing: 1px;
+  }
+
+  &:hover {
+    filter: brightness(1.05);
+  }
+
+  &:hover .solution-card__front {
+    opacity: 0;
+    transform: translateY(-12px) scale(0.94);
+  }
+
+  &:hover .solution-card__detail {
+    background-color: #fff;
+    opacity: 1;
+    transform: translateY(0);
+    pointer-events: auto;
+  }
+}
+
+.solution-card__front {
+  position: relative;
+  z-index: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.28s ease;
+}
+
+.solution-card__icon {
+  position: relative;
+  z-index: 1;
+  width: 90px;
+  height: 90px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: rgba(20, 70, 130, 0.82);
+  background: rgba(255, 255, 255, 0.35);
+  border: 1px solid rgba(255, 255, 255, 0.55);
+  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
+  backdrop-filter: blur(6px);
+
+  ::v-deep svg {
+    width: 64px;
+    height: 64px;
+  }
+}
+
+.solution-card__detail {
+  position: absolute;
+  inset: 0;
+  z-index: 2;
+  padding: 26px 24px 24px;
+  border-radius: inherit;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  color: #1f2937;
+  text-align: left;
+  background: transparent;
+  box-shadow: none;
+  backdrop-filter: none;
+  opacity: 0;
+  pointer-events: none;
+  transform: translateY(16px);
+  transition: all 0.25s ease;
+
+  strong {
+    margin-bottom: 8px;
+    color: #0f172a;
+    font-size: 22px;
+    line-height: 1.25;
+    font-weight: 800;
+    letter-spacing: -0.02em;
+  }
+
+  em {
+    margin-bottom: 12px;
+    color: #334155;
+    font-size: 14px;
+    line-height: 1.5;
+    font-style: normal;
     font-weight: 700;
   }
 
   p {
-    min-height: 52px;
-    max-width: 210px;
-    margin: 0 auto 18px;
-    color: #666666;
-    font-size: 15px;
-    line-height: 1.7;
-  }
-
-  button {
-    height: 36px;
-    padding: 0 24px;
-    cursor: pointer;
-    background: rgba(255, 255, 255, 0.76);
-    border: 1px solid rgba(45, 91, 255, 0.12);
-    border-radius: 999px;
-    transition: all 0.25s ease;
-  }
-}
-
-.circle-ring {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 192px;
-  height: 192px;
-  margin: 0 auto;
-  border: 2px solid rgba(45, 91, 255, 0.15);
-  border-radius: 50%;
-  background: linear-gradient(135deg, rgba(45, 91, 255, 0.06), rgba(45, 91, 255, 0.02));
-  box-shadow: 0 4px 12px rgba(45, 91, 255, 0.06), 0 0 20px rgba(45, 91, 255, 0.12);
-  animation: rhythmPulse 2.5s ease-in-out infinite;
-}
-
-.circle-core {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 156px;
-  height: 156px;
-  background: rgba(255, 255, 255, 0.9);
-  border-radius: 50%;
-  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
-
-  svg {
-    width: 86px;
-    height: 86px;
-  }
-}
-
-.circle-item.token button {
-  color: #2d5bff;
-  border-color: rgba(45, 91, 255, 0.16);
-
-  &:hover {
-    background: rgba(45, 91, 255, 0.06);
-  }
-}
-
-.circle-item.workshop {
-  .circle-ring {
-    border-color: rgba(124, 58, 237, 0.15);
-    background: linear-gradient(135deg, rgba(124, 58, 237, 0.06), rgba(236, 72, 153, 0.02));
-    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.06), 0 0 20px rgba(139, 92, 246, 0.12);
-    animation-name: rhythmPulse2;
-    animation-duration: 2.8s;
-  }
-
-  button {
-    color: #7c3aed;
-    border-color: rgba(124, 58, 237, 0.16);
-
-    &:hover {
-      background: rgba(124, 58, 237, 0.06);
-    }
-  }
-}
-
-.circle-item.base {
-  .circle-ring {
-    border-color: rgba(5, 150, 105, 0.15);
-    background: linear-gradient(135deg, rgba(5, 150, 105, 0.06), rgba(45, 91, 255, 0.02));
-    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.06), 0 0 20px rgba(16, 185, 129, 0.12);
-    animation-name: rhythmPulse3;
-    animation-duration: 3s;
-  }
-
-  button {
-    color: #059669;
-    border-color: rgba(5, 150, 105, 0.16);
-
-    &:hover {
-      background: rgba(5, 150, 105, 0.06);
-    }
-  }
-}
-
-.hero-stat-list {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(0, 1fr));
-  gap: 24px;
-  width: 100%;
-  max-width: 1180px;
-  margin-top: 72px;
-}
-
-.hero-stat-item {
-  position: relative;
-  min-height: 118px;
-  padding: 20px 18px;
-  overflow: hidden;
-  background: rgba(255, 255, 255, 0.86);
-  border: 1px solid rgba(0, 0, 0, 0.06);
-  border-radius: 18px;
-  box-shadow: 0 8px 24px rgba(45, 91, 255, 0.08);
-  backdrop-filter: blur(20px);
-
-  &::before,
-  &::after {
-    content: "";
-    position: absolute;
-    width: 100%;
-    height: 2px;
-    pointer-events: none;
-  }
-
-  &::before {
-    top: 0;
-    left: -100%;
-    background: linear-gradient(90deg, transparent, #2d5bff, transparent);
-    animation: borderMove 3s linear infinite;
-  }
-
-  &::after {
-    right: -100%;
-    bottom: 0;
-    background: linear-gradient(90deg, transparent, #7c3aed, transparent);
-    animation: borderMoveReverse 3s linear infinite;
-  }
-
-  strong {
-    display: block;
-    margin: 8px 0 10px;
-    background: linear-gradient(135deg, #2d5bff 0%, #7c3aed 100%);
-    -webkit-background-clip: text;
-    background-clip: text;
-    color: transparent;
-    font-size: 36px;
-    line-height: 1;
-  }
-
-  span {
-    color: #666666;
+    margin: 0;
+    color: #475569;
     font-size: 13px;
+    line-height: 1.7;
+    letter-spacing: 0;
   }
 
-  &.highlight strong {
-    background: linear-gradient(135deg, #f59e0b 0%, #ef4444 100%);
-    -webkit-background-clip: text;
-    background-clip: text;
-    color: transparent;
-  }
-}
-
-@keyframes float1 {
-  0%,
-  100% {
-    transform: translate(0, 0);
-  }
-
-  33% {
-    transform: translate(50px, -50px);
-  }
-
-  66% {
-    transform: translate(-30px, 30px);
-  }
-}
-
-@keyframes float2 {
-  0%,
-  100% {
-    transform: translate(0, 0);
-  }
-
-  33% {
-    transform: translate(-40px, 40px);
-  }
-
-  66% {
-    transform: translate(60px, -30px);
-  }
-}
-
-@keyframes float3 {
-  0%,
-  100% {
-    transform: translate(-50%, -50%);
-  }
-
-  33% {
-    transform: translate(calc(-50% + 40px), calc(-50% - 40px));
-  }
-
-  66% {
-    transform: translate(calc(-50% - 30px), calc(-50% + 30px));
-  }
-}
-
-@keyframes sloganShine {
-  0% {
-    background-position: -200% center;
-  }
-
-  100% {
-    background-position: 200% center;
-  }
-}
-
-@keyframes rhythmPulse {
-  0%,
-  100% {
-    box-shadow: 0 4px 12px rgba(45, 91, 255, 0.06), 0 0 20px rgba(59, 130, 246, 0.18);
-  }
-
-  50% {
-    box-shadow: 0 8px 20px rgba(45, 91, 255, 0.1), 0 0 38px rgba(59, 130, 246, 0.25);
-  }
-}
-
-@keyframes rhythmPulse2 {
-  0%,
-  100% {
-    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.06), 0 0 20px rgba(139, 92, 246, 0.18);
-  }
-
-  50% {
-    box-shadow: 0 8px 20px rgba(124, 58, 237, 0.1), 0 0 38px rgba(139, 92, 246, 0.25);
-  }
-}
-
-@keyframes rhythmPulse3 {
-  0%,
-  100% {
-    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.06), 0 0 20px rgba(16, 185, 129, 0.18);
-  }
-
-  50% {
-    box-shadow: 0 8px 20px rgba(5, 150, 105, 0.1), 0 0 38px rgba(16, 185, 129, 0.25);
-  }
-}
-
-@keyframes borderMove {
-  0% {
-    left: -100%;
-  }
-
-  100% {
-    left: 100%;
-  }
-}
-
-@keyframes borderMoveReverse {
-  0% {
-    right: -100%;
-  }
-
-  100% {
-    right: 100%;
-  }
-}
-
-@media (max-width: 1100px) {
-  .public-hero h1 {
-    font-size: 48px;
-  }
-
-  .hero-service-list {
-    gap: 34px;
-  }
-
-  .hero-stat-list {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-}
-
-@media (max-width: 768px) {
-  .main-content {
+  ul {
+    margin: 18px 0 0;
     padding: 0;
-  }
-
-  .hero-inner {
-    padding: 56px 24px;
-  }
-
-  .hero-service-list {
-    grid-template-columns: 1fr;
-    gap: 48px;
-    max-width: 420px;
-  }
-}
-
-/* 产品列表区域 */
-.productList {
-  position: relative;
-  width: 100%;
-  max-width: 1600px;
-  margin: -8px auto 0;
-  padding: 44px 20px 40px;
-  background: linear-gradient(180deg, rgba(247, 250, 255, 0.92) 0%, rgba(255, 255, 255, 0.98) 42%, rgba(248, 250, 252, 0.96) 100%);
-  border-radius: 28px 28px 0 0;
-
-  @media (max-width: 768px) {
-    padding: 32px 10px 30px;
-  }
-}
-
-.myTab {
-  width: 100%;
-  font-size: 18px;
-  border-radius: 16px;
-  background: #f7f8fc;
-  padding: 10px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-top: 0;
-  flex-wrap: wrap;
-  box-shadow: 0 10px 30px rgba(45, 91, 255, 0.06);
-
-  @media (max-width: 768px) {
-    margin-top: 30px;
-    font-size: 16px;
-  }
-
-  .activeMenu {
-    background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
-    color: white;
+    list-style: none;
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 10px;
   }
 
   li {
-    transition: all .2s ease-in-out;
-    z-index: 2;
-    padding: 10px 100px;
-    margin: 5px;
-    border-radius: 8px;
+    min-height: 72px;
+    padding: 10px 6px 9px;
+    border: 1px solid rgba(186, 220, 255, 0.72);
+    border-radius: 14px;
     display: flex;
-    justify-content: center;
+    flex-direction: column;
     align-items: center;
-    cursor: pointer;
+    justify-content: center;
+    background: rgba(240, 249, 255, 0.82);
+    box-shadow: 0 10px 20px rgba(59, 130, 246, 0.06);
+    text-align: center;
 
-    @media (max-width: 768px) {
-      padding: 8px 15px;
-      margin: 3px;
+    b {
+      display: block;
+      color: #2563eb;
+      font-size: 26px;
+      line-height: 1.1;
+      font-weight: 800;
+      letter-spacing: -0.01em;
+      white-space: nowrap;
     }
-  }
-}
 
-/* 分页样式 */
-.el-pagination {
-  padding: 20px 0;
-  display: flex;
-  justify-content: center;
+    small {
+      display: block;
+      margin-top: 7px;
+      color: #64748b;
+      font-size: 12px;
+      line-height: 1.25;
+      font-weight: 700;
+    }
 
-  @media (max-width: 768px) {
-
-    ::v-deep .el-pagination__total,
-    ::v-deep .el-pagination__jump {
+    &::before {
       display: none;
     }
   }
 }
 
-/* 响应式设计 */
-@media (max-width: 576px) {
-  .jd-homepage {
-    padding-top: 80px;
-  }
+.solution-card--slot-0 {
+  z-index: 7;
+  opacity: 1;
+  transform: translateX(-50%) scale(1) rotateY(0);
+}
 
-  .main-content {
+.solution-card--slot--1 {
+  z-index: 6;
+  opacity: 0.72;
+  filter: blur(0.6px);
+  transform: translateX(-100%) translateY(28px) scale(0.82) rotateY(9deg);
+}
+
+.solution-card--slot-1 {
+  z-index: 6;
+  opacity: 0.72;
+  filter: blur(0.6px);
+  transform: translateX(0%) translateY(28px) scale(0.82) rotateY(-9deg);
+}
+
+.solution-card--slot--2 {
+  z-index: 5;
+  opacity: 0.38;
+  filter: blur(2px);
+  transform: translateX(-145%) translateY(54px) scale(0.66) rotateY(16deg);
+}
+
+.solution-card--slot-2 {
+  z-index: 5;
+  opacity: 0.38;
+  filter: blur(2px);
+  transform: translateX(45%) translateY(54px) scale(0.66) rotateY(-16deg);
+}
+
+.solution-card--slot--3 {
+  z-index: 4;
+  opacity: 0.16;
+  filter: blur(4px);
+  transform: translateX(-188%) translateY(76px) scale(0.54) rotateY(22deg);
+  pointer-events: none;
+}
+
+.solution-card--slot-3 {
+  z-index: 4;
+  opacity: 0.16;
+  filter: blur(4px);
+  transform: translateX(88%) translateY(76px) scale(0.54) rotateY(-22deg);
+  pointer-events: none;
+}
+
+.carousel-arrow {
+  position: absolute;
+  top: 44%;
+  z-index: 8;
+  width: 44px;
+  height: 44px;
+  border: 1px solid rgba(0, 0, 0, 0.06);
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #333;
+  background: rgba(255, 255, 255, 0.9);
+  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
+  cursor: pointer;
+  transition: all 0.25s ease;
+
+  &:hover {
+    transform: translateY(-2px);
+    background: #fff;
+    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
+  }
+}
+
+.carousel-arrow--prev {
+  left: -20px;
+}
+
+.carousel-arrow--next {
+  right: -20px;
+}
+
+.carousel-dots {
+  display: flex;
+  justify-content: center;
+  gap: 10px;
+  margin-top: 18px;
+
+  button {
+    width: 10px;
+    height: 10px;
     padding: 0;
-  }
+    border: 0;
+    border-radius: 999px;
+    background: rgba(17, 24, 39, 0.16);
+    cursor: pointer;
+    transition: all 0.25s ease;
 
-  .hero-inner {
-    padding: 42px 18px;
-  }
-
-  .public-hero {
-    min-height: auto;
-  }
-
-  .public-hero h1 {
-    font-size: 34px;
-  }
-
-  .hero-subtitle {
-    margin-bottom: 32px;
-    font-size: 16px;
-  }
-
-  .hero-service-list,
-  .hero-stat-list {
-    grid-template-columns: 1fr;
-    gap: 18px;
-  }
-
-  .circle-ring {
-    width: 156px;
-    height: 156px;
-  }
-
-  .circle-core {
-    width: 126px;
-    height: 126px;
-
-    svg {
-      width: 72px;
-      height: 72px;
+    &.active {
+      width: 28px;
+      background: #5b8def;
     }
   }
+}
 
-  .myTab {
+.case-section {
+  position: relative;
+  padding: 96px 24px 112px;
+  background: transparent;
+}
+
+.case-inner {
+  max-width: 1280px;
+  margin: 0 auto;
+}
+
+.case-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 48px;
+}
+
+.case-more {
+  border: 0;
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  color: #2563eb;
+  background: transparent;
+  cursor: pointer;
+  font-size: 18px;
+  line-height: 1;
+  font-weight: 700;
+  transition: color 0.2s ease, transform 0.2s ease;
+
+  &:hover {
+    color: #1d4ed8;
+    transform: translateX(4px);
+  }
+}
+
+.case-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 32px;
+}
+
+.case-card {
+  min-height: 520px;
+  border-radius: 24px;
+  perspective: 1400px;
+}
+
+.case-card__inner {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  min-height: inherit;
+  border-radius: inherit;
+  transform-style: preserve-3d;
+  transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
+}
+
+.case-card:hover .case-card__inner {
+  transform: rotateY(180deg);
+}
+
+.case-card__face {
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  overflow: hidden;
+  backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+  box-shadow: 0 24px 60px rgba(37, 99, 235, 0.12);
+}
+
+.case-card__front {
+  background: #eef7ff;
+
+  img {
+    width: 100%;
+    height: 100%;
+    display: block;
+    object-fit: cover;
+    transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
+  }
+}
+
+.case-card:hover .case-card__front img {
+  transform: scale(1.06);
+}
+
+.case-card__back {
+  transform: rotateY(180deg);
+  display: flex;
+  color: #fff;
+  background: linear-gradient(135deg, rgba(71, 85, 105, 0.96), rgba(15, 23, 42, 0.98));
+
+  &::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+    background:
+      radial-gradient(circle at 20% 16%, rgba(96, 165, 250, 0.32), transparent 32%),
+      radial-gradient(circle at 80% 86%, rgba(139, 92, 246, 0.24), transparent 34%);
+    pointer-events: none;
+  }
+}
+
+.case-card__content {
+  position: relative;
+  z-index: 1;
+  min-height: 100%;
+  padding: 34px 30px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+
+  h3 {
+    margin: 0 0 12px;
+    font-size: 32px;
+    line-height: 1.18;
+    font-weight: 800;
+  }
+
+  h4 {
+    margin: 0 0 18px;
+    color: #e0f2fe;
+    font-size: 21px;
+    line-height: 1.35;
+    font-weight: 700;
+  }
+
+  p {
+    margin: 0 0 16px;
+    color: rgba(255, 255, 255, 0.9);
+    font-size: 16px;
+    line-height: 1.75;
+  }
+}
+
+.case-card__summary {
+  opacity: 0.82;
+  font-size: 14px !important;
+}
+
+.case-cta {
+  min-height: 168px;
+  margin-top: 64px;
+  padding: 42px 48px;
+  border-radius: 28px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 24px;
+  overflow: hidden;
+  background-size: cover;
+  background-position: center;
+  box-shadow: 0 24px 60px rgba(37, 99, 235, 0.12);
+
+  h2 {
+    margin: 0 0 10px;
+    color: #111827;
+    font-size: 34px;
+    line-height: 1.25;
+    font-weight: 800;
+  }
+
+  p {
+    margin: 0;
+    color: rgba(17, 24, 39, 0.72);
+    font-size: 17px;
+    font-weight: 600;
+  }
+
+  button {
+    flex-shrink: 0;
+    height: 44px;
+    padding: 0 28px;
+    border: 0;
+    border-radius: 999px;
+    color: #fff;
+    background: #111827;
+    cursor: pointer;
+    font-size: 16px;
+    font-weight: 700;
+    transition: transform 0.2s ease, background 0.2s ease;
+
+    &:hover {
+      background: #1f2937;
+      transform: translateY(-2px);
+    }
+  }
+}
+
+.news-section {
+  position: relative;
+  padding: 96px 24px 112px;
+  overflow: hidden;
+  background: transparent;
+}
+
+.news-glow {
+  position: absolute;
+  border-radius: 50%;
+  filter: blur(64px);
+  opacity: 0.42;
+  pointer-events: none;
+}
+
+.news-glow--left {
+  top: 48px;
+  left: 48px;
+  width: 288px;
+  height: 288px;
+  background: linear-gradient(135deg, #dbeafe, #e9d5ff);
+}
+
+.news-glow--right {
+  right: 80px;
+  bottom: 80px;
+  width: 320px;
+  height: 320px;
+  background: linear-gradient(135deg, #e9d5ff, #dbeafe);
+}
+
+.news-glow--center {
+  top: 48%;
+  left: 50%;
+  width: 380px;
+  height: 380px;
+  background: #d8b4fe;
+  opacity: 0.25;
+  transform: translate(-50%, -50%);
+}
+
+.news-inner {
+  position: relative;
+  z-index: 1;
+  max-width: 1280px;
+  margin: 0 auto;
+}
+
+.news-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 48px;
+}
+
+.news-list {
+  display: flex;
+  flex-direction: column;
+  gap: 24px;
+}
+
+.news-card {
+  position: relative;
+  min-height: 164px;
+  padding: 42px 48px;
+  border-radius: 28px;
+  overflow: hidden;
+  cursor: pointer;
+  background: rgba(255, 255, 255, 0.9);
+  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.08);
+  transition: transform 0.35s ease, box-shadow 0.35s ease;
+
+  &:hover,
+  &.news-card-active {
+    transform: translateY(-4px);
+    box-shadow: 0 28px 56px rgba(59, 130, 246, 0.14);
+
+    .news-card-glow,
+    .news-card-border {
+      opacity: 1;
+    }
+  }
+}
+
+.news-card-glow {
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+  opacity: 0;
+  background: radial-gradient(circle at 48% 50%, rgba(139, 92, 246, 0.15) 0%, rgba(59, 130, 246, 0.1) 32%, rgba(236, 72, 153, 0.08) 60%, transparent 100%);
+  filter: blur(8px);
+  transition: opacity 0.45s ease;
+  animation: newsGlowPulse 12s ease-in-out infinite;
+}
+
+.news-card-border {
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  padding: 3px;
+  border-radius: inherit;
+  opacity: 0;
+  background: linear-gradient(90deg, transparent 0%, rgba(139, 92, 246, 0.62) 24%, rgba(59, 130, 246, 0.62) 50%, rgba(236, 72, 153, 0.58) 76%, transparent 100%);
+  background-size: 220% 100%;
+  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  mask-composite: exclude;
+  pointer-events: none;
+  transition: opacity 0.45s ease;
+  animation: newsBorderFlow 4s linear infinite;
+}
+
+.news-card__content {
+  position: relative;
+  z-index: 2;
+}
+
+.news-card__meta {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 12px;
+
+  span {
+    padding: 5px 12px;
+    border-radius: 999px;
+    font-size: 13px;
+    line-height: 1;
+    font-weight: 700;
+  }
+
+  time {
+    color: #6b7280;
     font-size: 14px;
-    margin-top: 20px;
+    font-weight: 600;
+  }
+}
+
+.news-tag--blue {
+  color: #1d4ed8;
+  background: #dbeafe;
+}
+
+.news-tag--green {
+  color: #047857;
+  background: #d1fae5;
+}
+
+.news-card h2 {
+  margin: 0 0 10px;
+  color: #111827;
+  font-size: 25px;
+  line-height: 1.35;
+  font-weight: 800;
+}
+
+.news-card p {
+  margin: 0;
+  color: #4b5563;
+  font-size: 16px;
+  line-height: 1.7;
+}
+
+@keyframes newsGlowPulse {
+  0%, 100% {
+    transform: scale(1);
+    filter: blur(8px);
+  }
+
+  50% {
+    transform: scale(1.12);
+    filter: blur(16px);
+  }
+}
+
+@keyframes newsBorderFlow {
+  0% {
+    background-position: 0% 50%;
+  }
+
+  100% {
+    background-position: 220% 50%;
+  }
+}
+
+@keyframes carouselRingSpin {
+  0% {
+    transform: rotateZ(0deg) scale(0.985);
+  }
+
+  45% {
+    transform: rotateZ(2.5deg) scale(1.015);
+  }
+
+  100% {
+    transform: rotateZ(0deg) scale(1);
+  }
+}
+
+@keyframes centerCardSpin {
+  0% {
+    transform: translateX(-50%) scale(0.92) rotateY(-18deg) rotateZ(-4deg);
+  }
+
+  55% {
+    transform: translateX(-50%) scale(1.04) rotateY(10deg) rotateZ(3deg);
+  }
+
+  100% {
+    transform: translateX(-50%) scale(1) rotateY(0deg) rotateZ(0deg);
+  }
+}
+
+@keyframes iconRoundSpin {
+  0% {
+    transform: rotate(0deg) scale(0.9);
+  }
+
+  70% {
+    transform: rotate(360deg) scale(1.08);
+  }
+
+  100% {
+    transform: rotate(360deg) scale(1);
+  }
+}
+
+@media (max-width: 900px) {
+  .ai-solution-section {
+    padding: 40px 16px 72px;
+  }
+
+  .carousel-stage {
+    height: 360px;
+  }
+
+  .solution-card {
+    width: 72%;
+    height: 330px;
+  }
+
+  .solution-card--slot--2,
+  .solution-card--slot-2 {
+    opacity: 0;
+    pointer-events: none;
+  }
+
+  .carousel-arrow--prev {
+    left: 0;
+  }
+
+  .carousel-arrow--next {
+    right: 0;
+  }
+
+  .case-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .case-card {
+    min-height: 460px;
+  }
+
+  .case-cta {
+    align-items: flex-start;
+    flex-direction: column;
+    padding: 32px 24px;
+  }
+
+  .news-head {
+    align-items: flex-start;
+    flex-direction: column;
+    gap: 16px;
+  }
+
+  .news-card {
+    padding: 30px 24px;
+  }
+}
+
+
+
+@keyframes heroFadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(20px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateY(0);
   }
 }
 </style>
diff --git a/f/web-kboss/src/views/homePage/ncmatch/index.vue b/f/web-kboss/src/views/homePage/ncmatch/index.vue
index 32d9176..9b1c261 100644
--- a/f/web-kboss/src/views/homePage/ncmatch/index.vue
+++ b/f/web-kboss/src/views/homePage/ncmatch/index.vue
@@ -5,7 +5,7 @@
     <!-- <div class="search-box">
       <search></search>
     </div> -->
-    <div style="width: 100%;">
+    <div class="ncmatch-router-view">
       <router-view></router-view>
     </div>
 
@@ -239,6 +239,12 @@ export default Vue.extend({
   background-color: #f6f8fd;
 }
 
+.ncmatch-router-view {
+  width: 100%;
+  padding-top: 0;
+  box-sizing: border-box;
+}
+
 .footer {
   padding: 35px 0;
   width: 100%;
diff --git a/f/web-kboss/src/views/homePage/ncmatch/supplyAndDemandSquare/index.vue b/f/web-kboss/src/views/homePage/ncmatch/supplyAndDemandSquare/index.vue
index ffc5208..0d65a85 100644
--- a/f/web-kboss/src/views/homePage/ncmatch/supplyAndDemandSquare/index.vue
+++ b/f/web-kboss/src/views/homePage/ncmatch/supplyAndDemandSquare/index.vue
@@ -750,6 +750,7 @@ export default {
 .plaza-page {
   position: relative;
   min-height: 100vh;
+  padding-top: 82px;
   overflow-x: hidden;
   background: linear-gradient(180deg, #f0f7ff 0%, #ffffff 60%, #f5f8ff 100%);
   color: #1a1a1a;
diff --git a/f/web-kboss/src/views/homePage/solve/hospital/index.vue b/f/web-kboss/src/views/homePage/solve/hospital/index.vue
index ce4a23e..ba0e8ca 100644
--- a/f/web-kboss/src/views/homePage/solve/hospital/index.vue
+++ b/f/web-kboss/src/views/homePage/solve/hospital/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="hospital-page">
     <div class="banner">
       <img class="bg" src="./img/hospitalBanner.png" alt="">
       <div class="textBox">
diff --git a/f/web-kboss/src/views/homePage/trainPlatform/index.vue b/f/web-kboss/src/views/homePage/trainPlatform/index.vue
index b2650eb..7a4a822 100644
--- a/f/web-kboss/src/views/homePage/trainPlatform/index.vue
+++ b/f/web-kboss/src/views/homePage/trainPlatform/index.vue
@@ -158,5 +158,9 @@ export default {
 </script>
 
 <style scoped>
+.train-page {
+  padding-top: 82px;
+}
+
 @import './train.css';
 </style>
diff --git a/f/web-kboss/src/views/product/allProduct/index.vue b/f/web-kboss/src/views/product/allProduct/index.vue
index ae2749e..efa588a 100644
--- a/f/web-kboss/src/views/product/allProduct/index.vue
+++ b/f/web-kboss/src/views/product/allProduct/index.vue
@@ -1,6 +1,5 @@
 <template>
   <div class="product-service-page" :class="{ 'single-product-page': isSinglePageMode }">
-    <TopBox v-if="isSinglePageMode" class="single-page-topbox" />
  
     <!-- 产品分类导航 -->
     <div v-if="!isSinglePageMode" class="category-nav">
@@ -228,7 +227,6 @@
 <script>
 import { reqNavList, reqNewHomeSync, reqNewHomeFestival } from "@/api/newHome";
 import { gotoYuanJingAPI } from '@/api/gotoYuanJing'
-import TopBox from '@/views/homePage/components/topBox/index.vue'
 
 const getImageUrlPrefix = () => {
   const origin = window.location.origin
@@ -246,9 +244,6 @@ const getImageUrlPrefix = () => {
 
 export default {
   name: "ProductServicePage",
-  components: {
-    TopBox
-  },
   data() {
     return {
       panelData: [],
@@ -270,7 +265,10 @@ export default {
       return this.isTokenMarketCategory(this.activeCategory);
     },
     isSinglePageMode() {
-      return this.$route.path === '/tokenMarket' || this.$route.query.single === '1' || this.$route.query.single === 'true';
+      return this.$route.path === '/tokenMarket' ||
+        this.$route.path === '/homePage/tokenMarket' ||
+        this.$route.query.single === '1' ||
+        this.$route.query.single === 'true';
     },
     currentSubcategories() {
       if (!this.activeCategory || !this.panelData.length) return [];
@@ -531,7 +529,7 @@ export default {
     // 加载导航数据
     async loadNavData() {
       try {
-        const response = await reqNavList({ url_link: window.location.href });
+        const response = await reqNavList({ url_link: this.getNavRequestUrl() });
         if (response.status && response.data.product_service) {
           this.panelData = this.processNavData(response.data.product_service);
         }
@@ -541,6 +539,15 @@ export default {
       }
     },
 
+    getNavRequestUrl() {
+      if (!this.isSinglePageMode) {
+        return window.location.href;
+      }
+      const baseUrl = window.location.href.split('#')[0];
+      const homePath = window.location.hostname.includes('ncmatch.cn') ? '/ncmatchHome/index' : '/homePage/index';
+      return `${baseUrl}#${homePath}`;
+    },
+
     // 处理导航数据 - 修复数据结构
     processNavData(data) {
       return data.map((category, categoryIndex) => {
@@ -897,31 +904,24 @@ export default {
 <style lang="less" scoped>
 .product-service-page {
   margin: 0 auto;
-  padding: 24px;
+  padding: 82px 24px 24px;
   background: #fff;
   min-height: calc(100vh - 100px);
 
   &.single-product-page {
     height: 100vh;
     min-height: 100vh;
-    padding: 28px;
+    padding: 82px 0 0;
     background: linear-gradient(180deg, #f3f7ff 0%, #ffffff 100%);
     overflow-y: auto;
     overflow-x: hidden;
 
-    .single-page-topbox {
-      width: 100vw;
-      margin: -28px calc(50% - 50vw) 24px;
-    }
-
     .product-content {
       max-width: 1180px;
-      margin-right: auto;
-      margin-left: auto;
-    }
-
-    .product-content {
+      margin: 24px auto 0;
+      padding-right: 28px;
       padding-bottom: 40px;
+      padding-left: 28px;
     }
   }