feat: rebuild product detail page to match cms design (tabs/attrs/spec-table)

Task 12a: rebuild product detail to precisely match cms [slug].astro - sticky tab nav (muted bar, brand underline, single-row h-scroll) with .sf-tp-panel/.active switching via inline script (no-JS renders all panels flat); Product Details panel renders body HTML as rich-body with cms table rules (full-width, hairline borders, zebra, inline width/height override, cell div scrub); Specifications panel shows clean spec-table with two key/value pairs per row when specs exist; panel titles get the cms 3px brand underline. Breakpoints mapped cms 900/960 -> platform 900, cms 620 -> 620; product responsive rules consolidated in the 12a block and removed from the shared responsive block. Product title keeps h1 tag at cms h2 scale (2xl) per platform single-h1 contract. Note: most product.html and test edits were swept into concurrent commit 85e6d4a; this commit carries the pro.css 12a block and the h1 refinements.

Co-Authored-By: Claude Code <noreply@anthropic.com>

themes/trade-pro/pages/product.html

@@ -46,8 +46,9 @@ Specifications 面板（干净 spec-table，每行两对键值，从 fields 读
 </div>
 <div class="sf-tp-product-summary" data-reveal style="--reveal-i: 1">
 <span class="eyebrow">PRODUCT DETAILS / {{ fields.get('brand') or 'CATALOGUE' }}</span>
-{# cms：产品名 h2 量级（2xl 非巨型，[slug].astro 全页无 h1） #}
-<h2 class="sf-tp-product-title">{{ page.title }}</h2>
+{# cms 产品名为 h2 量级（2xl 非巨型）；平台全站单 h1 契约
+（test_theme_pro_v3 全页 h1==1）保留 h1 标签、字号用 cms 2xl #}
+<h1 class="sf-tp-product-title">{{ page.title }}</h1>
 <p class="sf-tp-product-lead">{{ page.summary or 'Detailed product information, specifications and export packaging are published on this page.' }}</p>
 {% if fields.get('brand') or fields.get('model') %}
 <p class="sf-tp-product-meta">{% if fields.get('brand') %}<span>Brand · {{ fields.get('brand') }}</span>{% endif %}{% if fields.get('model') %}<span>Model · {{ fields.get('model') }}</span>{% endif %}</p>