feat(ui): 更新车间和产品页面UI设计并添加新图片资源

更新多个页面的UI设计，包括产品卡片、车间详情页和列表页，采用现代化卡片设计和动画效果
添加新的车间图片资源并更新相关页面的图片引用路径
优化响应式布局和交互体验，增强视觉吸引力

app/[locale]/line/page.tsx

@@ -57,25 +57,47 @@ function ProductCard({ product }: { product: Line }) {
       href={`/line/${product.slug}`}
       locale={product.locale}
     >
-      <div className="border rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
-        {/* 封面图：优化属性，确保服务端/客户端渲染一致 */}
-        <div className="relative h-64 w-full">
-          <img
-            src={coverSrc}
-            alt={coverAlt}
-            sizes="100vw" // 简化 sizes，避免解析差异
-            className="object-cover"
-            // 显式设置属性，避免隐式差异
-            loading="lazy"
-          />
+      <div
+        className="mb-4 relative flex w-full flex-col rounded-xl bg-gradient-to-br from-white to-gray-50 bg-clip-border text-gray-700 shadow-lg hover:shadow-xl transition-all duration-300 hover:-translate-y-1"
+      >
+        <div
+          className="relative mx-4 -mt-6 h-40 overflow-hidden rounded-xl bg-clip-border shadow-lg group"
+        >
+          <div
+            className="absolute inset-0 bg-gradient-to-r from-blue-600 via-blue-500 to-indigo-600 opacity-90"
+          ></div>
+          <div
+            className="absolute inset-0 bg-[linear-gradient(to_right,rgba(255,255,255,0.1)_1px,transparent_1px),linear-gradient(to_bottom,rgba(255,255,255,0.1)_1px,transparent_1px)] bg-[size:20px_20px] animate-pulse"
+          ></div>
+          <div className="absolute inset-0 flex items-center justify-center">
+            <img
+              src={coverSrc}
+              alt={coverAlt}
+              className="w-full h-full text-white/90 transform transition-transform group-hover:scale-110 duration-300"
+            />
+          </div>
         </div>
-
-        {/* 车间信息 */}
-        <div className="p-4">
-          <h2 className="text-xl font-bold mb-2">{product.title || "未命名产品线"}</h2>
-          <p className="text-gray-600 mb-4">{product.desc || "暂无描述"}</p>
+        <div className="p-6">
+          <h5
+            className="mb-2 block font-sans text-xl font-semibold leading-snug tracking-normal text-gray-900 antialiased group-hover:text-blue-600 transition-colors duration-300"
+          >
+            {product.title}
+          </h5>
+          {/* 最多四行，超过四行溢出隐藏 */}
+          <p
+            className="block font-sans text-base font-light leading-relaxed text-gray-700 antialiased overflow-hidden"
+            style={{
+              display: '-webkit-box',
+              WebkitBoxOrient: 'vertical',
+              WebkitLineClamp: 4,
+              overflow: 'hidden', // 确保文本溢出时隐藏
+            }}
+          >
+            {product.desc}
+          </p>
         </div>
       </div>
+
     </I18nLink>
   );
 }