feat: refine trade-pro variant pages (brand/service/faq/search/notfound)

Task 11 (layout port finale): rebuild the five thin variant pages in the
sf-tp design language, informed by upstream industrial/automotive
1.3.0/1.4.0 information architecture.

- brand: page-hero (breadcrumb Home > Brands > name, cover bg, anchor
  button) + related-product card grid (fields.brand == page title) +
  brand profile body only when authored; derived placeholder summary
  excluded, empty brands get an empty state, never fabricated intros.
- service: page-hero + 1.2/0.8 detail grid (article-body typography +
  sticky CTA card with contact/back links); empty body collapses to a
  centered solo column with the CTA card kept.
- faq: page-hero + article-body for the rich-text body (platform has no
  faq content type; sanitize strips details/summary so the typography
  layer carries it, block-driven details coexist via sf-canvas) +
  dark contact-guidance card; empty body swaps to an empty state.
- search: adopts the same platform mechanism as all four upstream
  themes (site-runtime.js ?q= client search over dist-root
  search-index.json); #sf-search/#sf-search-results/#sf-search-count
  hooks and .sf-search-page kept as JS contract, panel and injected
  result cards restyled via scoped cms-token overrides.
- notfound: branded dark-band 404 (icon macro, giant 404 h1, English
  copy, back-home + browse-products buttons); no end-cta.

CSS: Task 11 block appended to pro.css (new sf-tp-* classes only, own
900/620 media queries; shared hero/grid/typography responsive rules
come from existing 10a/10c/10d blocks; search overrides beat
factory.css by specificity without touching hooks).

Tests: test_trade_pro_variant_pages_structure covers brand fixture
(related filtering, empty forms), service/faq body-vs-empty, search
mechanism contract + noindex + index asset, 404 structure, v3 spot
checks (single h1, chrome, SVG arrows) and clean build report.

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

themes/trade-pro/pages/notfound.html

@@ -1 +1,22 @@
-<section class="pro-404 pro-wrap"><span>ERROR / 404</span><h1>404</h1><p>The page you are looking for does not exist or has been moved.</p><a class="sf-tp-btn" href="/">Back to home {{ icon('arrow-right') }}</a></section>
+{# trade-pro notfound — 品牌化 404（Task 11）。
+   设计参照（本轮无 cms 源对应）：上游 industrial/automotive 1.3.0/1.4.0
+   的 404 为「眉题 + 巨号 404 + 一句文案 + 返回首页」的居中薄形态；本模板
+   保留该信息架构并以 sf-tp 深色带语汇品牌化（10a 应用带的藏青渐变 + 光晕
+   底、反色文案、白底按钮反色），双动作位：返回首页 + 浏览产品目录。
+   渲染流：构建器以 mode='notfound' 渲染（noindex meta），pro.html 对
+   notfound 不渲染结尾 CTA 带；h1 唯一（「404」大标题即页题）。图标走
+   Task 9 icon 宏（search：找不到页面的语义），无裸箭头字符。 #}
+<section class="sf-tp-notfound">
+  <div class="wrap">
+    <div class="sf-tp-notfound-inner" data-reveal>
+      <div class="icon-circle sf-tp-notfound-icon" aria-hidden="true">{{ icon('search') }}</div>
+      <span class="eyebrow">ERROR / 404</span>
+      <h1>404</h1>
+      <p class="sf-tp-notfound-lead">The page you are looking for does not exist or has been moved.</p>
+      <div class="sf-tp-notfound-actions">
+        <a class="sf-tp-btn" href="/">Back to home {{ icon('arrow-right') }}</a>
+        <a class="sf-tp-btn sf-tp-btn--ghost" href="/products/">Browse products {{ icon('arrow-right') }}</a>
+      </div>
+    </div>
+  </div>
+</section>