Initial Mashinify homepage rebuild in Next.js.

FA/RTL marketplace home with search-first hero, categories, and stock data from mashinify.com.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/components/Articles.tsx

@@ -0,0 +1,47 @@
+import Image from "next/image";
+import { articles } from "@/data/home";
+
+export function Articles() {
+  return (
+    <section id="articles" className="section bg-surface">
+      <div className="container-page">
+        <div className="section-head">
+          <p className="section-kicker">Insights</p>
+          <h2 className="section-title">مقالات</h2>
+          <p className="section-desc">
+            نکات تخصصی برای خرید هوشمندانه و ارتقاء خطوط تولید صنعتی.
+          </p>
+        </div>
+
+        <div className="grid gap-5 md:grid-cols-3">
+          {articles.map((article) => (
+            <a
+              key={article.id}
+              href={article.href}
+              className="group block overflow-hidden border border-line transition hover:border-brand/40"
+            >
+              <div className="relative aspect-[16/10] overflow-hidden bg-[#e8eef4]">
+                <Image
+                  src={article.image}
+                  alt={article.title}
+                  fill
+                  className="object-cover transition duration-500 group-hover:scale-[1.04]"
+                  sizes="(max-width: 768px) 100vw, 33vw"
+                />
+              </div>
+              <div className="p-5">
+                <h3 className="text-base font-extrabold leading-7 text-brand-ink transition group-hover:text-brand">
+                  {article.title}
+                </h3>
+                <span className="mt-4 inline-flex items-center gap-2 text-sm font-bold text-brand">
+                  بیشتر بخوانید
+                  <span aria-hidden>←</span>
+                </span>
+              </div>
+            </a>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}