feat(products): 实现大公司品牌级产品独立页，包含矩阵功能版本定价与演示

addons/official/view/web/official_product/list.html

@@ -5,6 +5,9 @@
 {if input('param.pid') == 19 || (isset($res['name']) && strpos($res['name'],'服务') !== false)}
     <!-- 引入纳海川服务独立页 -->
     {include file="web/official_product/service_page" /}
+{elseif input('param.pid') == 22 || (isset($res['name']) && strpos($res['name'],'产品') !== false) /}
+    <!-- 引入纳海川产品独立页 -->
+    {include file="web/official_product/product_page" /}
 {else/}
     <!-- 通用产品/服务列表 开始 -->
     <div class="product nhc-container" style="padding: 110px 0 60px;">

addons/official/view/web/official_product/list_e.html

@@ -5,6 +5,9 @@
 {if input('param.pid') == 19 || (isset($res['name']) && strpos($res['name'],'服务') !== false)}
     <!-- 引入移动端纳海川服务独立页 -->
     {include file="web/official_product/service_page" /}
+{elseif input('param.pid') == 22 || (isset($res['name']) && strpos($res['name'],'产品') !== false) /}
+    <!-- 引入移动端纳海川产品独立页 -->
+    {include file="web/official_product/product_page" /}
 {else/}
     <!-- 通用产品/服务移动端列表 开始 -->
     <div class="product nhc-container" style="padding: 80px 16px 40px;">

addons/official/view/web/official_product/product_page.html

@@ -0,0 +1,446 @@
+<!-- 纳海川官方网站 · 产品独立页 (Products Page) 开始 -->
+
+<!-- 1. 产品总览 Hero 视窗 -->
+<section class="nhc-page-hero nhc-lattice-pattern">
+    <div class="nhc-container">
+        <div class="nhc-breadcrumb">
+            <a href="{:addon_url('official/web.official_home/index')}">首页</a>
+            <span>/</span>
+            <span>产品矩阵</span>
+        </div>
+        <div style="margin-bottom: 16px;">
+            <span class="nhc-seal">商业重器</span>
+        </div>
+        <h1 class="nhc-page-title">积厚流光成重器 · 矩阵赋能拓坦途</h1>
+        <p class="nhc-page-desc">
+            历经千万级真实交易峰值淬炼的标准化工业级成熟商业软件资产，涵盖全场景商城、智能收银、全链路进销存与云原生 SaaS 底座，支持公有云订阅与专有私有化源码买断。
+        </p>
+        <div style="display: flex; justify-content: center; gap: 16px;">
+            <a href="#product-matrix" class="nhc-btn nhc-btn-primary nhc-btn-lg">
+                <span>浏览产品矩阵</span>
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
+            </a>
+            <a href="#demo-sandbox" class="nhc-btn nhc-btn-outline nhc-btn-lg">
+                <span>申请在线演示沙箱</span>
+            </a>
+        </div>
+    </div>
+</section>
+
+<!-- 2. 【矩阵】与【功能】深度拆解板块 (Matrix & Features) -->
+<section id="product-matrix" class="nhc-product-matrix-section nhc-product-matrix nhc-product-features">
+    <div class="nhc-container">
+        <div class="nhc-section-header">
+            <div class="nhc-section-tag">
+                <span class="nhc-seal">商业矩阵</span>
+                <span class="nhc-tag-text">STANDARDIZED SOLUTIONS</span>
+            </div>
+            <h2 class="nhc-section-title">四大成熟商业产品 · 即开即用的增长引擎</h2>
+            <p class="nhc-section-desc">
+                模块化、松耦合的高可用架构设计，既可独立开箱即用，亦可无缝组合成全链路商业数字闭环。
+            </p>
+            <div class="nhc-line-divider"><span></span></div>
+        </div>
+
+        <div class="nhc-product-matrix-grid">
+            <!-- 产品 01：全场景商城系统 -->
+            <div class="nhc-product-full-card nhc-corner-card">
+                <div>
+                    <div class="nhc-product-card-header">
+                        <div class="nhc-product-icon-wrap">
+                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="9" cy="21" r="1"/><circle cx="20" cy="21" r="1"/><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"/></svg>
+                        </div>
+                        <span class="nhc-seal">商用旗舰</span>
+                    </div>
+                    <h3 class="nhc-product-card-title">全场景商城系统</h3>
+                    <p class="nhc-product-card-desc">
+                        面向品牌自营、多商户联营及供应链分销场景的现代化电商交易系统。融合微信小程序生态、社交裂变分销、会员等级权益与全渠道订单履约中枢，平稳支撑秒杀大促交易峰值。
+                    </p>
+                    <ul class="nhc-product-module-list">
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>B2B2C / S2B2C 多商户独立入驻结算</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>二级分销、拼团、砍价与营销矩阵</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>微信/H5/App 三端订单与购物车无缝互通</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>供应商自动账单对账与灵活分账结算</span>
+                        </li>
+                    </ul>
+                </div>
+                <div class="nhc-product-card-footer">
+                    <span class="nhc-product-deploy-type">支持公有云 SaaS / 私有化买断部署</span>
+                    <a href="#demo-sandbox" class="nhc-btn nhc-btn-outline nhc-btn-sm">申请商城演示</a>
+                </div>
+            </div>
+
+            <!-- 产品 02：智能商业收银系统 -->
+            <div class="nhc-product-full-card nhc-corner-card">
+                <div>
+                    <div class="nhc-product-card-header">
+                        <div class="nhc-product-icon-wrap">
+                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="4" width="20" height="16" rx="2"/><line x1="2" y1="10" x2="22" y2="10"/></svg>
+                        </div>
+                        <span class="nhc-seal">软硬一体</span>
+                    </div>
+                    <h3 class="nhc-product-card-title">智能商业收银系统</h3>
+                    <p class="nhc-product-card-desc">
+                        专为连锁商超、新零售门店及现代餐饮打造的软硬一体化智能收银解决方案。毫秒级聚合扫码付，深度支持断网离线离线记账与网络恢复自动回传，彻底杜绝掉单死机。
+                    </p>
+                    <ul class="nhc-product-module-list">
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>聚合微信/支付宝/银联云闪付秒级结算</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>极端断网断电离线记账 · 联网零丢失回传</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>双屏客显互动 · 会员人脸/扫码精准核销</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>条码秤、扫码盒、热敏小票机即插即用驱动</span>
+                        </li>
+                    </ul>
+                </div>
+                <div class="nhc-product-card-footer">
+                    <span class="nhc-product-deploy-type">硬件全兼容 · 适配主流 Android/Windows POS</span>
+                    <a href="#demo-sandbox" class="nhc-btn nhc-btn-outline nhc-btn-sm">申请收银演示</a>
+                </div>
+            </div>
+
+            <!-- 产品 03：全链路进销存系统 -->
+            <div class="nhc-product-full-card nhc-corner-card">
+                <div>
+                    <div class="nhc-product-card-header">
+                        <div class="nhc-product-icon-wrap">
+                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></svg>
+                        </div>
+                        <span class="nhc-seal">业财一体</span>
+                    </div>
+                    <h3 class="nhc-product-card-title">全链路进销存系统</h3>
+                    <p class="nhc-product-card-desc">
+                        实现采购、销售、多级仓储调拨与财务收支一体化穿透。通过批次批号与保质期精细化管理、智能动态补货建议模型与库存实时盘点，助力供应链大幅降低呆滞物料积压。
+                    </p>
+                    <ul class="nhc-product-module-list">
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>批次批号追溯 · 临期保质期智能预警</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>多级仓库异地调拨与 PDA 扫码动态盘点</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>应收应付账期管理 · 实时自动生成毛利报表</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>AI 智能安全库存与自动化补货采购建议</span>
+                        </li>
+                    </ul>
+                </div>
+                <div class="nhc-product-card-footer">
+                    <span class="nhc-product-deploy-type">支持多仓多店异地协同 · 业财数据实时穿透</span>
+                    <a href="#demo-sandbox" class="nhc-btn nhc-btn-outline nhc-btn-sm">申请进销存演示</a>
+                </div>
+            </div>
+
+            <!-- 产品 04：云原生 SaaS 平台 -->
+            <div class="nhc-product-full-card nhc-corner-card">
+                <div>
+                    <div class="nhc-product-card-header">
+                        <div class="nhc-product-icon-wrap">
+                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z"/></svg>
+                        </div>
+                        <span class="nhc-seal">云原生高可用</span>
+                    </div>
+                    <h3 class="nhc-product-card-title">云原生 SaaS 平台</h3>
+                    <p class="nhc-product-card-desc">
+                        企业级多租户商业云原生技术底座。金融级多租户数据逻辑与物理隔离，开箱即用，免运维部署。提供细粒度 RBAC 权限控制引擎与标准 OpenAPI，伴随业务规模无限弹性扩容。
+                    </p>
+                    <ul class="nhc-product-module-list">
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>多租户严密物理/逻辑隔离 · 保证数据主权</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>微服务弹性容器集群 · 自动故障转移 99.99%</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>标准开放 OpenAPI 与第三方业务生态无缝打通</span>
+                        </li>
+                        <li class="nhc-product-module-item">
+                            <svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>多维度租户计量计费与资源配额动态监管</span>
+                        </li>
+                    </ul>
+                </div>
+                <div class="nhc-product-card-footer">
+                    <span class="nhc-product-deploy-type">弹性微服务集群 · 金融级高可用 99.99%</span>
+                    <a href="#demo-sandbox" class="nhc-btn nhc-btn-outline nhc-btn-sm">申请 SaaS 演示</a>
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- 3. 【版本】商业版本对比选型板块 (Editions) -->
+<section class="nhc-editions-section nhc-product-editions">
+    <div class="nhc-container">
+        <div class="nhc-section-header">
+            <div class="nhc-section-tag">
+                <span class="nhc-seal">版本选型</span>
+                <span class="nhc-tag-text">EDITION COMPARISON</span>
+            </div>
+            <h2 class="nhc-section-title">商业版本功能矩阵 · 科学精准选型</h2>
+            <p class="nhc-section-desc">
+                纳海川提供从初创轻量自营、高成长连锁到大型集团专属定制的梯度版本体系，满足不同发展阶段的数字化诉求。
+            </p>
+            <div class="nhc-line-divider"><span></span></div>
+        </div>
+
+        <div class="nhc-table-container">
+            <table class="nhc-editions-table">
+                <thead>
+                    <tr>
+                        <th style="width: 25%;">对比维度 / 核心特性</th>
+                        <th style="width: 18%;">标准版 (Standard)</th>
+                        <th style="width: 19%;">专业版 (Professional)</th>
+                        <th style="width: 19%;" class="featured">旗舰版 (Enterprise)</th>
+                        <th style="width: 19%;">专有定制版 (Custom)</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td><strong>适用客群定位</strong></td>
+                        <td>单店/初创型商户</td>
+                        <td>成长型自营与连锁</td>
+                        <td class="featured">集团级全渠道运营</td>
+                        <td>大型政企/专网行业龙头</td>
+                    </tr>
+                    <tr>
+                        <td><strong>支持并发日单量</strong></td>
+                        <td>&le; 3,000 单/天</td>
+                        <td>&le; 20,000 单/天</td>
+                        <td class="featured">100,000+ 单/天</td>
+                        <td>千万级无上限集群弹性扩容</td>
+                    </tr>
+                    <tr>
+                        <td><strong>全渠道商城与分销</strong></td>
+                        <td>单店基础小程序</td>
+                        <td>多级分销裂变与多商户</td>
+                        <td class="featured">B2B2C/S2B2C 全渠道覆盖</td>
+                        <td>按需定制专属交易逻辑与结算</td>
+                    </tr>
+                    <tr>
+                        <td><strong>智能收银与硬件对接</strong></td>
+                        <td>基础扫码支付</td>
+                        <td>离线记账+主流外设兼容</td>
+                        <td class="featured">软硬一体全兼容+双屏异显</td>
+                        <td>定制工控机与物联网设备对接</td>
+                    </tr>
+                    <tr>
+                        <td><strong>业财进销存与批次追溯</strong></td>
+                        <td>基础进出库流水</td>
+                        <td>多仓协同+智能补货模型</td>
+                        <td class="featured">批次批号追溯+业财全自动穿透</td>
+                        <td>深度打通集团已有 SAP/用友 ERP</td>
+                    </tr>
+                    <tr>
+                        <td><strong>云原生 SaaS 租户隔离</strong></td>
+                        <td>逻辑共享隔离</td>
+                        <td>多租户独立资源配额</td>
+                        <td class="featured">金融级逻辑+独立数据库隔离</td>
+                        <td>100% 物理专有内网信创隔离</td>
+                    </tr>
+                    <tr>
+                        <td><strong>源码移交与自主二开</strong></td>
+                        <td><span class="nhc-check-no">&minus; 不提供</span></td>
+                        <td><span class="nhc-check-no">&minus; 不提供</span></td>
+                        <td class="featured"><span class="nhc-check-yes">&radic; 开放核心拓展模块</span></td>
+                        <td><span class="nhc-check-yes" style="color: var(--primary);">&radic; 100% 全量源码工程买断移交</span></td>
+                    </tr>
+                    <tr>
+                        <td><strong>技术支持与 SLA 维保</strong></td>
+                        <td>工作日工单响应</td>
+                        <td>7&times;12 小时技术协助</td>
+                        <td class="featured"><strong>7&times;24 小时极速响应</strong></td>
+                        <td><strong>专属系统架构师 1 对 1 驻场/专线</strong></td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+</section>
+
+<!-- 4. 【定价与部署】商业合作模式 (Pricing & Deployment) -->
+<section class="nhc-pricing-section nhc-product-pricing">
+    <div class="nhc-container">
+        <div class="nhc-section-header">
+            <div class="nhc-section-tag">
+                <span class="nhc-seal">商业授权</span>
+                <span class="nhc-tag-text">DEPLOYMENT MODES</span>
+            </div>
+            <h2 class="nhc-section-title">两种灵活合作模式 · 赋能长期稳健发展</h2>
+            <p class="nhc-section-desc">
+                根据企业的预算周期、技术团队实力及合规要求，灵活选择公有云敏捷订阅或专有云私有化源码买断。
+            </p>
+            <div class="nhc-line-divider"><span></span></div>
+        </div>
+
+        <div class="nhc-pricing-grid">
+            <!-- 模式 A：公有云 SaaS 订阅 -->
+            <div class="nhc-pricing-card">
+                <div>
+                    <div class="nhc-pricing-header">
+                        <span class="nhc-seal" style="margin-bottom: 8px;">敏捷开箱</span>
+                        <h3 class="nhc-pricing-title">公有云 SaaS 订阅模式</h3>
+                        <p class="nhc-pricing-subtitle">无需自备服务器与专职运维，即开即用，伴随业务快速启航。</p>
+                    </div>
+                    <ul class="nhc-pricing-features">
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>零初始服务器硬件与网络宽带采购投入</span>
+                        </li>
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>按年灵活订阅，支持随门店与业务规模平滑升级</span>
+                        </li>
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>纳海川官方运维团队全天候守护与自动备份</span>
+                        </li>
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>免费享受持续迭代的功能更新与系统性能调优</span>
+                        </li>
+                    </ul>
+                </div>
+                <div>
+                    <a href="#demo-sandbox" class="nhc-btn nhc-btn-outline" style="width: 100%;">咨询公有云订阅方案</a>
+                </div>
+            </div>
+
+            <!-- 模式 B：专有云私有化源码买断 -->
+            <div class="nhc-pricing-card featured">
+                <div>
+                    <div class="nhc-pricing-header">
+                        <span class="nhc-seal" style="margin-bottom: 8px;">资产独占</span>
+                        <h3 class="nhc-pricing-title">专有私有化 · 源码买断模式</h3>
+                        <p class="nhc-pricing-subtitle">部署于客户专属服务器或信创专网机房，核心资产 100% 自主合规。</p>
+                    </div>
+                    <ul class="nhc-pricing-features">
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>100% 移交规范注释工程源码与全部数据库字典</span>
+                        </li>
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>数据完全在客户专有内网封闭存储，零合规外泄风险</span>
+                        </li>
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>自研技术团队拥有无限二次开发、扩展与定制权限</span>
+                        </li>
+                        <li class="nhc-pricing-feature-item">
+                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                            <span>首年享专属架构师技术维保与技术团队赋能培训</span>
+                        </li>
+                    </ul>
+                </div>
+                <div>
+                    <a href="{:addon_url('official/web.official_online_message/list',[':pid'=>18,':sid'=>18])}" class="nhc-btn nhc-btn-primary" style="width: 100%;">预约私有化部署评估</a>
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- 5. 【演示】在线体验与演示沙箱申请 (Demo Sandbox) -->
+<section id="demo-sandbox" class="nhc-demo-section nhc-product-demo">
+    <div class="nhc-container">
+        <div class="nhc-demo-box nhc-corner-card">
+            <div class="nhc-demo-info">
+                <span class="nhc-seal" style="margin-bottom: 12px;">即刻体验</span>
+                <h3>申请成熟产品沙箱在线演示</h3>
+                <p>
+                    我们为企业决策人准备了全功能在线演示沙箱环境，涵盖商城前台多端、门店智能收银台及进销存中央管理后台，您可即时获取体验账号，亲测系统流畅度与业务契合度。
+                </p>
+                <div class="nhc-demo-badges">
+                    <div class="nhc-demo-badge-item">
+                        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                        <span>真实业务数据模拟，体验秒级聚合扫码与进销存扣减</span>
+                    </div>
+                    <div class="nhc-demo-badge-item">
+                        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg>
+                        <span>支持预约资深架构师进行 1 对 1 专属业务流程联调演示</span>
+                    </div>
+                </div>
+            </div>
+            <div>
+                <div style="background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: var(--radius-sm); padding: 28px;">
+                    <h4 style="font-family: var(--font-serif); font-size: 16px; margin-bottom: 16px; color: var(--text-primary);">预约专家在线联调演示</h4>
+                    <form action="{:addon_url('official/web.official_online_message/list',[':pid'=>18,':sid'=>18])}" method="get">
+                        <div style="margin-bottom: 14px;">
+                            <label style="display: block; font-size: 12px; color: var(--text-muted); margin-bottom: 6px;">感兴趣的产品系统</label>
+                            <select style="width: 100%; padding: 10px; border: 1px solid #CBD5E1; border-radius: 4px; font-size: 13px; background: #FFF;">
+                                <option value="mall">全场景多商户商城系统</option>
+                                <option value="pos">智能商业收银系统</option>
+                                <option value="erp">全链路业财进销存系统</option>
+                                <option value="saas">云原生 SaaS 商业底座</option>
+                                <option value="all">全套商业产品矩阵</option>
+                            </select>
+                        </div>
+                        <div style="margin-bottom: 18px;">
+                            <label style="display: block; font-size: 12px; color: var(--text-muted); margin-bottom: 6px;">联系电话或企业名称</label>
+                            <input type="text" placeholder="请输入您的手机号或企业名称" style="width: 100%; padding: 10px; border: 1px solid #CBD5E1; border-radius: 4px; font-size: 13px;" required>
+                        </div>
+                        <a href="{:addon_url('official/web.official_online_message/list',[':pid'=>18,':sid'=>18])}" class="nhc-btn nhc-btn-primary" style="width: 100%; text-align: center;">
+                            <span>立即获取演示权限</span>
+                            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
+                        </a>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- 6. 底部行动号召 (CTA Section) -->
+<section class="nhc-cta">
+    <div class="nhc-container">
+        <div class="nhc-cta-inner">
+            <div class="nhc-cta-content">
+                <span class="nhc-seal" style="background: rgba(255, 255, 255, 0.15); border-color: rgba(255, 255, 255, 0.4); color: #FFFFFF; margin-bottom: 12px;">商业咨询</span>
+                <h2 class="nhc-cta-title">准备好用成熟工业级产品矩阵驱动业务跃升了吗？</h2>
+                <p class="nhc-cta-desc">
+                    纳海川解决方案专家团队随时待命，为您提供深度业务选型评估、专属架构建议与商务方案，24 小时内快速响应对接。
+                </p>
+            </div>
+            <div class="nhc-cta-buttons">
+                <a href="{:addon_url('official/web.official_online_message/list',[':pid'=>18,':sid'=>18])}" class="nhc-btn nhc-cta-btn-light nhc-btn-lg">
+                    <span>立即提交选型咨询</span>
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 12h14M12 5l7 7-7 7"/></svg>
+                </a>
+                <a href="tel:{:__config('site_mobile','value')}" class="nhc-btn nhc-cta-btn-ghost nhc-btn-lg">
+                    <span>致电产品专线</span>
+                </a>
+            </div>
+        </div>
+    </div>
+</section>
+<!-- 纳海川官方网站 · 产品独立页 (Products Page) 结束 -->

public/assets/addons/official/css/modern_nhc.css

@@ -2173,3 +2173,339 @@ img {
   background: var(--primary-hover);
   box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25);
 }
+
+/* ==========================================================================
+   产品独立页专有样式 (Products Page Modern Style)
+   ========================================================================== */
+
+/* 产品矩阵全景板块 */
+.nhc-product-matrix-section {
+  padding: 90px 0;
+}
+
+.nhc-product-matrix-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 32px;
+}
+
+.nhc-product-full-card {
+  background: #FFFFFF;
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  padding: 40px;
+  box-shadow: var(--shadow-subtle);
+  transition: all 0.3s ease;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+.nhc-product-full-card:hover {
+  border-color: rgba(37, 99, 235, 0.35);
+  box-shadow: 0 16px 36px -10px rgba(15, 23, 42, 0.08);
+  transform: translateY(-2px);
+}
+
+.nhc-product-card-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  margin-bottom: 20px;
+}
+
+.nhc-product-icon-wrap {
+  width: 48px;
+  height: 48px;
+  border-radius: 8px;
+  background: var(--primary-light);
+  color: var(--primary);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 16px;
+}
+
+.nhc-product-card-title {
+  font-family: var(--font-serif);
+  font-size: 24px;
+  font-weight: 700;
+  color: var(--text-primary);
+  margin-bottom: 12px;
+}
+
+.nhc-product-card-desc {
+  font-size: 14px;
+  line-height: 1.8;
+  color: var(--text-secondary);
+  margin-bottom: 24px;
+}
+
+.nhc-product-module-list {
+  list-style: none;
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 10px;
+  margin-bottom: 28px;
+  border-top: 1px dashed #E2E8F0;
+  padding-top: 20px;
+}
+
+.nhc-product-module-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: var(--text-primary);
+}
+
+.nhc-product-module-item svg {
+  color: var(--primary);
+  flex-shrink: 0;
+}
+
+.nhc-product-card-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-top: 1px solid #F1F5F9;
+  padding-top: 18px;
+}
+
+.nhc-product-deploy-type {
+  font-size: 12px;
+  color: var(--text-muted);
+}
+
+/* 版本选型对比表格 */
+.nhc-editions-section {
+  padding: 90px 0;
+  background-color: var(--bg-secondary);
+  border-top: 1px solid var(--border-color);
+  border-bottom: 1px solid var(--border-color);
+}
+
+.nhc-table-container {
+  overflow-x: auto;
+  background: #FFFFFF;
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  box-shadow: var(--shadow-subtle);
+}
+
+.nhc-editions-table {
+  width: 100%;
+  border-collapse: collapse;
+  text-align: left;
+  font-size: 14px;
+}
+
+.nhc-editions-table th,
+.nhc-editions-table td {
+  padding: 18px 24px;
+  border-bottom: 1px solid var(--border-color);
+  border-right: 1px solid #F1F5F9;
+}
+
+.nhc-editions-table th:last-child,
+.nhc-editions-table td:last-child {
+  border-right: none;
+}
+
+.nhc-editions-table thead th {
+  background: #F8FAFC;
+  font-family: var(--font-serif);
+  font-size: 16px;
+  font-weight: 700;
+  color: var(--text-primary);
+}
+
+.nhc-editions-table thead th.featured {
+  background: #EFF6FF;
+  color: var(--primary);
+  border-top: 2px solid var(--primary);
+}
+
+.nhc-editions-table tbody tr:hover td {
+  background: #FAFAFA;
+}
+
+.nhc-editions-table tbody tr:hover td.featured {
+  background: #F0F7FF;
+}
+
+.nhc-editions-table td.featured {
+  background: #F8FAFC;
+}
+
+.nhc-check-yes {
+  color: #10B981;
+  font-weight: 700;
+}
+
+.nhc-check-no {
+  color: #CBD5E1;
+}
+
+/* 部署模式与商业授权板块 */
+.nhc-pricing-section {
+  padding: 90px 0;
+}
+
+.nhc-pricing-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 32px;
+  max-width: 960px;
+  margin: 0 auto;
+}
+
+.nhc-pricing-card {
+  background: #FFFFFF;
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  padding: 40px;
+  box-shadow: var(--shadow-subtle);
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+.nhc-pricing-card.featured {
+  border-color: var(--primary);
+  box-shadow: 0 12px 30px -8px rgba(37, 99, 235, 0.15);
+}
+
+.nhc-pricing-card.featured::before {
+  content: "推荐方案";
+  position: absolute;
+  top: -12px;
+  right: 24px;
+  background: var(--primary);
+  color: #FFFFFF;
+  font-size: 11px;
+  padding: 2px 10px;
+  border-radius: 12px;
+  font-weight: 600;
+}
+
+.nhc-pricing-header {
+  margin-bottom: 24px;
+  padding-bottom: 20px;
+  border-bottom: 1px solid #F1F5F9;
+}
+
+.nhc-pricing-title {
+  font-family: var(--font-serif);
+  font-size: 22px;
+  font-weight: 700;
+  color: var(--text-primary);
+  margin-bottom: 8px;
+}
+
+.nhc-pricing-subtitle {
+  font-size: 13px;
+  color: var(--text-secondary);
+}
+
+.nhc-pricing-features {
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-bottom: 32px;
+  font-size: 14px;
+}
+
+.nhc-pricing-feature-item {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  color: var(--text-primary);
+}
+
+.nhc-pricing-feature-item svg {
+  color: var(--primary);
+  flex-shrink: 0;
+}
+
+/* 预约演示沙箱板块 */
+.nhc-demo-section {
+  padding: 80px 0;
+  background-color: var(--bg-secondary);
+  border-top: 1px solid var(--border-color);
+}
+
+.nhc-demo-box {
+  background: #FFFFFF;
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-md);
+  padding: 48px;
+  max-width: 880px;
+  margin: 0 auto;
+  box-shadow: var(--shadow-subtle);
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 40px;
+  align-items: center;
+}
+
+.nhc-demo-info h3 {
+  font-family: var(--font-serif);
+  font-size: 26px;
+  font-weight: 700;
+  color: var(--text-primary);
+  margin-bottom: 14px;
+}
+
+.nhc-demo-info p {
+  font-size: 14px;
+  line-height: 1.8;
+  color: var(--text-secondary);
+  margin-bottom: 20px;
+}
+
+.nhc-demo-badges {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.nhc-demo-badge-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: var(--text-primary);
+}
+
+.nhc-demo-badge-item svg {
+  color: #10B981;
+}
+
+/* 响应式微调 */
+@media (max-width: 1024px) {
+  .nhc-product-matrix-grid {
+    grid-template-columns: 1fr;
+  }
+  .nhc-pricing-grid {
+    grid-template-columns: 1fr;
+  }
+  .nhc-demo-box {
+    grid-template-columns: 1fr;
+  }
+}
+
+@media (max-width: 768px) {
+  .nhc-product-full-card {
+    padding: 24px;
+  }
+  .nhc-product-module-list {
+    grid-template-columns: 1fr;
+  }
+  .nhc-demo-box {
+    padding: 24px;
+  }
+}

tests/ProductsPageTest.php

@@ -0,0 +1,137 @@
+<?php
+/**
+ * 产品独立页改版规范与内容完整性测试 (TDD 模式)
+ * 验证产品页必备板块：矩阵、功能、版本、定价、演示，以及色彩体系、去AI味道与禁止项
+ */
+
+class ProductsPageTest
+{
+    private $passed = 0;
+    private $failed = 0;
+    private $htmlContent = '';
+    private $cssContent = '';
+
+    public function __construct()
+    {
+        $baseDir = dirname(__DIR__);
+        $productFile = $baseDir . '/addons/official/view/web/official_product/product_page.html';
+        $listFile = $baseDir . '/addons/official/view/web/official_product/list.html';
+        $cssFile = $baseDir . '/public/assets/addons/official/css/modern_nhc.css';
+
+        $this->htmlContent = '';
+        if (file_exists($productFile)) {
+            $this->htmlContent .= file_get_contents($productFile) . "\n";
+        }
+        if (file_exists($listFile)) {
+            $this->htmlContent .= file_get_contents($listFile) . "\n";
+        }
+        if (file_exists($cssFile)) {
+            $this->cssContent = file_get_contents($cssFile);
+        }
+    }
+
+    public function run()
+    {
+        echo "=== 开始执行产品独立页设计规范与内容完整性测试 (TDD) ===\n";
+
+        // 1. 品牌名称必须为纳海川
+        $this->testBrandName();
+
+        // 2. 必备四大产品线
+        $this->testProductLines();
+
+        // 3. 必备板块测试：矩阵、功能、版本、定价、演示 (AGENTS.md 规范)
+        $this->testEssentialSections();
+
+        // 4. 去除 AI 味道：真实具体的业务参数与商业能力
+        $this->testNoAiCharacteristics();
+
+        // 5. 禁止项测试（严禁 emoji）
+        $this->testForbiddenElements();
+
+        // 6. 色彩与设计规范
+        $this->testDesignTokens();
+
+        echo "\n测试结果: {$this->passed} 通过, {$this->failed} 失败\n";
+        if ($this->failed > 0) {
+            exit(1);
+        }
+    }
+
+    private function assert($condition, $message)
+    {
+        if ($condition) {
+            echo "  [PASS] {$message}\n";
+            $this->passed++;
+        } else {
+            echo "  [FAIL] {$message}\n";
+            $this->failed++;
+        }
+    }
+
+    public function testBrandName()
+    {
+        $this->assert(strpos($this->htmlContent, '纳海川') !== false, "产品页必须明确包含品牌名称【纳海川】");
+        $hasWrongAbbr = preg_match('/纳川(?![海])/u', $this->htmlContent);
+        $this->assert(!$hasWrongAbbr, "产品页严禁错误简称为【纳川】");
+    }
+
+    public function testProductLines()
+    {
+        $this->assert(strpos($this->htmlContent, '商城') !== false, "必须深度包含【商城系统】产品线");
+        $this->assert(strpos($this->htmlContent, '收银') !== false, "必须深度包含【智能收银系统】产品线");
+        $this->assert(strpos($this->htmlContent, '进销存') !== false, "必须深度包含【进销存系统】产品线");
+        $this->assert(strpos($this->htmlContent, 'SaaS') !== false, "必须深度包含【SaaS版本/云原生平台】产品线");
+    }
+
+    public function testEssentialSections()
+    {
+        // 按照 AGENTS.md 规范：产品页含矩阵、功能、版本、定价、演示
+        $hasMatrix = (strpos($this->htmlContent, 'nhc-product-matrix') !== false || strpos($this->htmlContent, '产品矩阵') !== false || strpos($this->htmlContent, '商业矩阵') !== false);
+        $this->assert($hasMatrix, "产品页必须包含【矩阵】(产品矩阵全景)板块");
+
+        $hasFeatures = (strpos($this->htmlContent, 'nhc-product-features') !== false || strpos($this->htmlContent, '功能架构') !== false || strpos($this->htmlContent, '核心功能') !== false);
+        $this->assert($hasFeatures, "产品页必须包含【功能】(功能深度架构与模块拆解)板块");
+
+        $hasEditions = (strpos($this->htmlContent, 'nhc-product-editions') !== false || strpos($this->htmlContent, '版本对比') !== false || strpos($this->htmlContent, '版本选型') !== false);
+        $this->assert($hasEditions, "产品页必须包含【版本】(多商业版本功能对比)板块");
+
+        $hasPricing = (strpos($this->htmlContent, 'nhc-product-pricing') !== false || strpos($this->htmlContent, '定价') !== false || strpos($this->htmlContent, '部署模式') !== false || strpos($this->htmlContent, '商业授权') !== false);
+        $this->assert($hasPricing, "产品页必须包含【定价】(部署模式与商业合作/定价策略)板块");
+
+        $hasDemo = (strpos($this->htmlContent, 'nhc-product-demo') !== false || strpos($this->htmlContent, '在线演示') !== false || strpos($this->htmlContent, '预约演示') !== false || strpos($this->htmlContent, '申请演示') !== false);
+        $this->assert($hasDemo, "产品页必须包含【演示】(在线体验/沙箱演示预约)板块");
+    }
+
+    public function testNoAiCharacteristics()
+    {
+        // 真实具体参数：多商户、离线记账、批次批号、多租户等
+        $hasRealParams = (strpos($this->htmlContent, '多商户') !== false || strpos($this->htmlContent, '分销') !== false)
+                      && (strpos($this->htmlContent, '离线') !== false || strpos($this->htmlContent, '扫码') !== false)
+                      && (strpos($this->htmlContent, '批次') !== false || strpos($this->htmlContent, '盘点') !== false)
+                      && (strpos($this->htmlContent, '多租户') !== false || strpos($this->htmlContent, '隔离') !== false);
+        $this->assert($hasRealParams, "去AI味道：必须展示具体的商业系统功能参数与落地特性，拒绝假大空套话");
+
+        // 商业版本清晰边界
+        $hasVersions = (strpos($this->htmlContent, '标准版') !== false || strpos($this->htmlContent, '企业版') !== false || strpos($this->htmlContent, '旗舰版') !== false || strpos($this->htmlContent, '定制') !== false);
+        $this->assert($hasVersions, "去AI味道：必须具备严谨清晰的商业版本划分");
+    }
+
+    public function testForbiddenElements()
+    {
+        $hasEmoji = preg_match('/[\x{1F600}-\x{1F64F}\x{1F300}-\x{1F5FF}\x{1F680}-\x{1F6FF}\x{2600}-\x{26FF}\x{2700}-\x{27BF}]/u', $this->htmlContent);
+        $this->assert(!$hasEmoji, "产品页严禁使用任何 emoji 表情符号");
+    }
+
+    public function testDesignTokens()
+    {
+        $hasSerif = (stripos($this->cssContent, 'SimSun') !== false || stripos($this->cssContent, 'Songti') !== false || stripos($this->cssContent, 'Noto Serif SC') !== false);
+        $this->assert($hasSerif, "必须沿用宋体标题规范");
+
+        $hasPrimary = (stripos($this->cssContent, '#2563EB') !== false || stripos($this->cssContent, '#2563eb') !== false);
+        $this->assert($hasPrimary, "必须沿用科技蓝 #2563EB 主色规范");
+    }
+}
+
+$test = new ProductsPageTest();
+$test->run();