feat: 优化页面内容与样式，增强用户体验；更新描述与功能标签，提升信息传达

pages/yougu/index.vue

@@ -45,10 +45,13 @@
             :to="item.to"
             :aria-label="'进入' + item.tag + '产品页'">
             <header class="yg-scene-head">
-              <span class="yg-end-tag"><i></i>{{ item.tag }}</span>
               <span class="yg-scene-mark" aria-hidden="true">
                 <svg viewBox="0 0 24 24" v-html="item.icon"></svg>
               </span>
+              <span class="yg-end-tag">{{ item.tag }}</span>
+              <span class="yg-scene-en" aria-hidden="true">
+                <span v-for="word in item.en" :key="word">{{ word }}</span>
+              </span>
             </header>
             <div class="yg-scene-body">
               <div class="yg-scene-title">
@@ -154,46 +157,47 @@ export default {
           tag: '学校端',
           product: '产教图谱',
           sub: '高校专业建设与人才培养AI决策智能体',
-          desc: '专业动态适配产业，以产业需求为导向的专业与课程调整。',
+          desc: '以产业需求为起点，贯通产业、岗位、能力、专业与课程，为学校专业调整、培养优化和资源配置提供数据支撑。',
+          en: ['SCHOOL', 'PARTNER'],
           to: '/yougu/school',
           icon:
-            '<path d="M21.42 10.922a1 1 0 0 0-.019-1.838L12.83 5.18a2 2 0 0 0-1.66 0L2.6 9.08a1 1 0 0 0 0 1.832l8.57 3.908a2 2 0 0 0 1.66 0z"/><path d="M22 10v6"/><path d="M6 12.5V16a6 3 0 0 0 12 0v-3.5"/>',
+            '<path d="M22 10 12 5 2 10l10 5 10-5z"/><path d="M6 12v4.5c0 1.4 2.7 2.5 6 2.5s6-1.1 6-2.5V12"/><path d="M22 10v6"/>',
           feats: [
-            { name: '看清产业', note: '｜产业链全景分析与人才需求动态洞察' },
-            { name: '对准专业', note: '｜产业—岗位—专业供需匹配分析' },
-            { name: '找准差距', note: '｜岗位能力图谱与课程能力诊断' },
-            { name: '推动改进', note: '｜智能预警、整改闭环与成果输出' }
+            { name: '看产业', note: '｜洞察产业趋势与岗位需求' },
+            { name: '调专业', note: '｜支撑专业布局与动态调整' },
+            { name: '找差距', note: '｜诊断能力缺口与课程矩阵' },
+            { name: '促修改', note: '｜推动专业建设持续改进' }
           ]
         },
         {
           tag: '学生端',
           product: '北斗星',
-          sub: '生涯发展与就业能力提升 AI 平台',
-          desc: '就业能力提前养成，让生涯教育贯穿人才培养全过程。',
+          sub: '高校生涯教育与就业能力提升AI平台',
+          desc: '以AI职业发展教练贯穿大学四年，帮助学生明方向、练能力、强就业。',
+          en: ['STUDENT', 'EMPOWERMENT'],
           to: '/yougu/student',
-          icon:
-            '<circle cx="12" cy="12" r="10"/><polygon points="16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76"/>',
+          icon: '<circle cx="12" cy="8" r="4"/><path d="M5 21v-1a7 7 0 0 1 14 0v1"/>',
           feats: [
-            { name: '看方向', note: '｜从大一开始明确未来方向' },
-            { name: '找差距', note: '｜看清距离目标岗位还差什么' },
-            { name: '练能力', note: '｜把岗位要求真正练成能力' },
-            { name: '做求职', note: '｜把四年成长转化为岗位语言' },
-            { name: '去职场', note: '｜AI职业发展教练陪伴就业全过程' }
+            { name: '明方向', note: '｜从职业认知到目标岗位' },
+            { name: '练能力', note: '｜从知道做什么到真正练出来' },
+            { name: '沉成果', note: '｜从学习经历到能力证据' },
+            { name: '强就业', note: '｜让求职准备更早、更准、更实' }
           ]
         },
         {
           tag: '企业端',
           product: '人才桥',
           sub: 'AI 校企人才匹配与用人反馈平台',
-          desc: '从看简历到看能力，基于真实能力与项目成果精准匹配。',
+          desc: '以岗位标准、能力匹配和实践验证连接企业与高校，让用人反馈反哺培养。',
+          en: ['ENTERPRISE', 'CONNECT'],
           to: '/yougu/enterprise',
           icon:
-            '<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/>',
+            '<path d="M17 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9.5" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/>',
           feats: [
-            { name: '定标准', note: '｜AI把业务需求转化为岗位能力标准' },
-            { name: '找人才', note: '｜AI按岗位能力精准匹配候选人' },
-            { name: '验能力', note: '｜用实战任务验证岗位胜任力' },
-            { name: '做决策', note: '｜沉淀招聘评价与用人反馈' }
+            { name: '定标准', note: '｜把业务需求转化为岗位标准' },
+            { name: '识人才', note: '｜基于能力与成果精准匹配' },
+            { name: '验胜任', note: '｜用真实任务验证岗位能力' },
+            { name: '助育人', note: '｜用人数据反哺人才培养' }
           ]
         }
       ],
@@ -506,63 +510,62 @@ export default {
     flex-direction: column;
   }
 
+  /* 红渐变横幅头：白底圆图标 + 端名 + 英文块 */
   .yg-scene-head {
     display: flex;
     align-items: center;
-    justify-content: space-between;
-    padding: 0.16rem 0.16rem 0.14rem;
-    border-bottom: 1px solid var(--line);
-    background: linear-gradient(180deg, rgba(171, 10, 61, 0.07) 0%, rgba(171, 10, 61, 0) 100%);
+    justify-content: flex-start;
+    gap: 0.12rem;
+    padding: 0.14rem 0.16rem;
+    background: linear-gradient(135deg, #c22650 0%, var(--red) 45%, var(--red-deep) 100%);
   }
 
   .yg-scene-grid .yg-scene-card:nth-child(2) .yg-scene-head {
-    background: linear-gradient(180deg, rgba(171, 10, 61, 0.07) 0%, rgba(171, 10, 61, 0) 100%);
+    background: linear-gradient(135deg, #c22650 0%, var(--red) 45%, var(--red-deep) 100%);
   }
 
   .yg-end-tag {
-    display: inline-flex;
-    align-items: center;
-    gap: 0.07rem;
-    padding: 0.05rem 0.13rem;
-    border-radius: 999px;
     color: #fff;
-    font-size: 0.13rem;
+    font-size: 0.17rem;
     font-weight: 800;
-    letter-spacing: 0.06em;
-    background: linear-gradient(135deg, var(--red), var(--red-deep));
-    box-shadow: 0 0.05rem 0.14rem rgba(171, 10, 61, 0.24);
-
-    i {
-      display: block;
-      width: 5px;
-      height: 5px;
-      border-radius: 50%;
-      background: rgba(255, 255, 255, 0.9);
-    }
+    letter-spacing: 0.16em;
+    white-space: nowrap;
   }
 
-  .yg-scene-grid .yg-scene-card:nth-child(2) .yg-end-tag {
-    background: linear-gradient(135deg, var(--red), var(--red-deep));
-    box-shadow: 0 0.05rem 0.14rem rgba(171, 10, 61, 0.24);
+  .yg-scene-en {
+    display: flex;
+    flex-direction: column;
+    gap: 0.02rem;
+    margin-left: auto;
+    padding-left: 0.09rem;
+    border-left: 1px solid rgba(255, 255, 255, 0.45);
+    color: rgba(255, 255, 255, 0.82);
+    font-size: 0.09rem;
+    font-weight: 700;
+    letter-spacing: 0.22em;
+    line-height: 1.6;
+    white-space: nowrap;
   }
 
   .yg-scene-mark {
     display: flex;
     align-items: center;
     justify-content: center;
-    width: 0.36rem;
-    height: 0.36rem;
-    border-radius: 0.1rem;
+    width: 0.4rem;
+    height: 0.4rem;
+    flex: 0 0 auto;
+    border-radius: 50%;
     color: var(--red);
-    background: rgba(171, 10, 61, 0.08);
+    background: #fff;
+    box-shadow: 0 0.04rem 0.12rem rgba(90, 5, 26, 0.28);
 
     svg {
       display: block;
-      width: 0.2rem;
-      height: 0.2rem;
+      width: 0.21rem;
+      height: 0.21rem;
       fill: none;
       stroke: currentColor;
-      stroke-width: 1.6;
+      stroke-width: 1.7;
       stroke-linecap: round;
       stroke-linejoin: round;
     }
@@ -570,7 +573,8 @@ export default {
 
   .yg-scene-grid .yg-scene-card:nth-child(2) .yg-scene-mark {
     color: var(--red);
-    background: rgba(171, 10, 61, 0.08);
+    background: #fff;
+    box-shadow: 0 0.04rem 0.12rem rgba(90, 5, 26, 0.28);
   }
 
   .yg-scene-body {
@@ -592,7 +596,8 @@ export default {
       letter-spacing: 0.02em;
 
       em {
-        font-style: normal;
+        font-family: Georgia, 'Times New Roman', 'Songti SC', serif;
+        font-style: italic;
         color: var(--red);
       }
     }
@@ -612,62 +617,43 @@ export default {
   }
 
   .yg-scene-sub {
-    position: relative;
-    margin: 0.12rem 0 0;
-    padding-left: 0.1rem;
+    margin: 0.1rem 0 0;
     color: var(--red);
-    font-size: 0.13rem;
-    font-weight: 700;
+    font-size: 0.15rem;
+    font-weight: 800;
+    letter-spacing: 0.01em;
     line-height: 1.6;
-
-    &::before {
-      content: '';
-      position: absolute;
-      left: 0;
-      top: 0.03rem;
-      bottom: 0.03rem;
-      width: 3px;
-      border-radius: 2px;
-      background: linear-gradient(180deg, var(--red), var(--red-deep));
-    }
   }
 
   .yg-scene-grid .yg-scene-card:nth-child(2) .yg-scene-sub {
     color: var(--red);
-
-    &::before {
-      background: linear-gradient(180deg, var(--red), var(--red-deep));
-    }
   }
 
   .yg-scene-desc {
     margin: 0.12rem 0 0;
     color: var(--ink-2);
-    font-size: 0.13rem;
-    line-height: 1.8;
+    font-size: 0.135rem;
+    line-height: 1.85;
   }
 
   .yg-feat-list {
-    margin: 0.12rem 0 0;
+    margin: auto 0 0;
     padding: 0;
     list-style: none;
 
     li {
       display: flex;
-      gap: 0.06rem;
-      padding: 0.09rem 0;
+      gap: 0.08rem;
+      padding: 0.1rem 0;
       border-top: 1px solid var(--line);
       color: var(--ink-3);
       font-size: 0.13rem;
-      line-height: 1.5;
-
-      &:first-child {
-        border-top: 0;
-      }
+      line-height: 1.55;
 
       b {
         flex: 0 0 auto;
-        color: var(--ink);
+        color: var(--red);
+        font-size: 0.14rem;
         font-weight: 800;
       }
     }
@@ -680,14 +666,13 @@ export default {
     gap: 0.06rem;
     min-height: 0.42rem;
     margin-top: 0.14rem;
-    border-radius: 0.1rem;
+    border-radius: 999px;
     color: #fff;
     font-size: 0.14rem;
     font-weight: 800;
     letter-spacing: 0.04em;
     background: linear-gradient(135deg, var(--red), var(--red-deep));
     box-shadow: 0 0.06rem 0.16rem rgba(171, 10, 61, 0.2);
-    margin-top: auto;
 
     i {
       font-style: normal;