feat: V2/V3组件体系与水墨雅致视觉改造

- 新增detail-v2组件库(HeroV2/V3, TrustSectionV2, CTASectionV2等)
- Hero组件水墨雅致改造:浅色宣纸底/深色墨色文字/墨韵纹理
- 方案卡片添加推荐组合徽标(Package图标)
- 独立产品页从V1组件迁移到V2/V3
- 修复why-us-section未使用导入和ESLint引号转义错误

src/components/detail/detail-certification.tsx

@@ -0,0 +1,36 @@
+'use client';
+
+import { motion } from 'framer-motion';
+import { Award, ExternalLink } from 'lucide-react';
+import type { Certification } from '@/lib/constants/products';
+
+interface CertificationListProps {
+  certifications: Certification[];
+}
+
+export function CertificationList({ certifications }: CertificationListProps) {
+  if (certifications.length === 0) return null;
+
+  return (
+    <div className="flex flex-wrap gap-3">
+      {certifications.map((cert, index) => (
+        <motion.a
+          key={cert.name}
+          href={cert.link || '#'}
+          initial={{ opacity: 0, scale: 0.95 }}
+          whileInView={{ opacity: 1, scale: 1 }}
+          viewport={{ once: true, margin: '-50px' }}
+          transition={{ duration: 0.3, delay: index * 0.05 }}
+          className="inline-flex items-center gap-2 rounded-full border border-gray-200 bg-white px-4 py-2 text-sm text-gray-700 shadow-sm transition-all hover:border-gray-300 hover:shadow-md"
+        >
+          <Award className="h-4 w-4 text-[#C41E3A]" />
+          <span className="font-medium">{cert.name}</span>
+          <span className="text-xs text-gray-400">{cert.issuer}</span>
+          {cert.link && cert.link !== '#' && (
+            <ExternalLink className="h-3 w-3 text-gray-400" />
+          )}
+        </motion.a>
+      ))}
+    </div>
+  );
+}