style(portal): 核心能力改为深色强调区块，并前移到产品功能之前

用户反馈"上方没有核心能力重点突出"。原因是原实现里
核心能力用的是 p-section--alt（浅灰底），而它相邻的产品功能是白底、
项目列表也是浅灰底，三者色阶接近，深色上没有形成视觉断点，
区块在页面里读起来和普通段落没有区别。

改动
- 新增 .p-section--deep 变体：浅色主题下用 #0d1220 近黑底 +
  顶部靛蓝径向光晕 + 一道渐变高光线，卡片改半透明白
- 核心能力改用该变体，并从产品功能之后移到之前：
  项目 → 核心能力（深色）→ 产品功能 → 界面预览
  深色块夹在项目列表与产品功能之间，形成明显的节奏断点
- 产品功能改用 p-section--alt，与前后白底交替
- 暗色主题下强调区不能用"压深"（页面底已是 #0c0f16），
  改用 #161b2c 冷灰蓝 + 更强光晕，靠提亮形成层次

验证
- 构建 13 页，256 条引用 0 失效
- 浏览器实测区块顺序：hero → projects → core → features → preview
  → foundation → howtheyfit → docs → cta
- 浅色 / 暗色两套主题均截图核对，强调区都能跳出来

.vitepress/theme/components/HomePage.vue

@@ -70,8 +70,29 @@ import {
       </div>
     </section>
 
+    <!-- 核心能力 -->
+    <section class="p-section p-section--deep" id="core">
+      <div class="p-wrap">
+        <header class="p-head">
+          <span class="p-eyebrow">CORE CAPABILITIES</span>
+          <h2 class="p-title">工程层面的硬指标</h2>
+          <p class="p-desc">
+            功能列表谁都能写。这些是真正决定能不能上线、好不好维护的部分。
+          </p>
+        </header>
+
+        <div class="p-grid p-grid--4">
+          <div v-for="a in coreAbilities" :key="a.title" class="p-card ca-card">
+            <span class="ca-tag">{{ a.tag }}</span>
+            <h3 class="p-card-title">{{ a.title }}</h3>
+            <p class="p-card-text">{{ a.text }}</p>
+          </div>
+        </div>
+      </div>
+    </section>
+
     <!-- 产品功能 -->
-    <section class="p-section" id="features">
+    <section class="p-section p-section--alt" id="features">
       <div class="p-wrap">
         <header class="p-head">
           <span class="p-eyebrow">PRODUCT FEATURES</span>
@@ -94,26 +115,6 @@ import {
       </div>
     </section>
 
-    <!-- 核心能力 -->
-    <section class="p-section p-section--alt" id="core">
-      <div class="p-wrap">
-        <header class="p-head">
-          <span class="p-eyebrow">CORE CAPABILITIES</span>
-          <h2 class="p-title">工程层面的硬指标</h2>
-          <p class="p-desc">
-            功能列表谁都能写。这些是真正决定能不能上线、好不好维护的部分。
-          </p>
-        </header>
-
-        <div class="p-grid p-grid--4">
-          <div v-for="a in coreAbilities" :key="a.title" class="p-card ca-card">
-            <span class="ca-tag">{{ a.tag }}</span>
-            <h3 class="p-card-title">{{ a.title }}</h3>
-            <p class="p-card-text">{{ a.text }}</p>
-          </div>
-        </div>
-      </div>
-    </section>
 
     <!-- 界面预览 -->
     <section class="p-section" id="preview">