Build Havaran storefront with Meshkee-backed blogs and portfolios.

Clone product, solution, and company pages from the original site and wire articles/projects to the Meshkee Website API with pagination and media from the backend CDN.

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

next.config.ts

@@ -1,7 +1,17 @@
 import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
-  /* config options here */
+  images: {
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "meshkee-storage.sas.amin.parminstorage.ir",
+      },
+      { protocol: "https", hostname: "cdn.willaspace.com" },
+      { protocol: "https", hostname: "cdn.meshkee.com" },
+      { protocol: "https", hostname: "c804387.parspack.net" },
+    ],
+  },
 };
 
 export default nextConfig;

public/files

@@ -0,0 +1 @@
+../src/files

public/images

@@ -0,0 +1 @@
+../src/images

src/app/about/page.tsx

@@ -0,0 +1,108 @@
+import Image from "next/image";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { aboutPage } from "@/data/company";
+
+export const metadata = {
+  title: "درباره ما | رسام تجارت هواران",
+  description:
+    "درباره شرکت رسام تجارت هواران؛ طراحی، تامین و تولید تجهیزات تهویه مطبوع و سیستم‌های مدیریت دود",
+};
+
+export default function AboutUsPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title={aboutPage.title}
+          titleEn={aboutPage.titleEn}
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "درباره ما", href: "/about" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+            <div className="relative aspect-[4/3] overflow-hidden">
+              <Image
+                src={aboutPage.image}
+                alt={aboutPage.companyTitle}
+                fill
+                className="object-cover"
+                sizes="(max-width: 1024px) 100vw, 50vw"
+                priority
+              />
+            </div>
+            <div>
+              <h2 className="mb-1 text-xl font-bold text-[#232323] sm:text-2xl">
+                {aboutPage.companyTitle}
+              </h2>
+              <p className="mb-5 text-sm tracking-wide text-[#999]">
+                {aboutPage.companyTitleEn}
+              </p>
+              <div className="space-y-4">
+                {aboutPage.paragraphs.map((paragraph) => (
+                  <p
+                    key={paragraph.slice(0, 32)}
+                    className="text-sm leading-8 text-[#666] text-justify"
+                  >
+                    {paragraph}
+                  </p>
+                ))}
+              </div>
+            </div>
+          </div>
+        </section>
+
+        <section className="section section-gray">
+          <div className="container-page max-w-4xl">
+            <div className="mb-6 text-center">
+              <h2 className="mb-1 text-xl font-bold text-[#232323] sm:text-2xl">
+                {aboutPage.activitiesTitle}
+              </h2>
+              <p className="text-sm tracking-wide text-[#999]">
+                {aboutPage.activitiesTitleEn}
+              </p>
+            </div>
+            <ol className="space-y-3">
+              {aboutPage.activities.map((item, index) => (
+                <li
+                  key={item}
+                  className="flex gap-3 text-sm leading-8 text-[#555] text-justify"
+                >
+                  <span className="mt-0.5 flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-brand-navy text-xs font-bold text-white">
+                    {index + 1}
+                  </span>
+                  <span>{item}</span>
+                </li>
+              ))}
+            </ol>
+
+            <h3 className="mt-8 mb-4 text-lg font-bold text-[#232323]">
+              {aboutPage.technicalTitle}
+            </h3>
+            <ul className="space-y-2">
+              {aboutPage.technicalServices.map((item) => (
+                <li
+                  key={item}
+                  className="flex gap-2 border-b border-[#eaeaea] py-2 text-sm leading-7 text-[#555]"
+                >
+                  <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+                  <span>{item}</span>
+                </li>
+              ))}
+            </ul>
+
+            <p className="mt-10 text-center text-base font-bold text-[#232323]">
+              {aboutPage.slogan}
+            </p>
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/article-details/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { redirect } from "next/navigation";
+
+type PageProps = {
+  params: Promise<{ id: string }>;
+};
+
+export default async function ArticleDetailsAliasPage({ params }: PageProps) {
+  const { id } = await params;
+  redirect(`/articles/${id}`);
+}

src/app/articles/[slug]/page.tsx

@@ -0,0 +1,52 @@
+import { notFound } from "next/navigation";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { ArticleDetailView } from "@/components/ArticleDetail";
+import { articlesFallback } from "@/data/articles";
+import { getBlog } from "@/lib/meshkee";
+
+type PageProps = {
+  params: Promise<{ slug: string }>;
+};
+
+export async function generateStaticParams() {
+  return articlesFallback.map((item) => ({ slug: item.slug }));
+}
+
+export async function generateMetadata({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getBlog(slug);
+  if (!item) {
+    return { title: "مقاله | رسام تجارت هواران" };
+  }
+  return {
+    title: `${item.title} | رسام تجارت هواران`,
+    description: item.excerpt || item.title,
+  };
+}
+
+export default async function ArticleDetailPage({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getBlog(slug);
+  if (!item) notFound();
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title={item.title}
+          titleEn="ARTICLE"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "مقالات", href: "/articles" },
+            { label: "جزئیات مقاله", href: `/articles/${item.slug}` },
+          ]}
+        />
+        <ArticleDetailView item={item} />
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/articles/page.tsx

@@ -0,0 +1,60 @@
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { ArticlesGrid } from "@/components/ArticlesGrid";
+import { Pagination } from "@/components/Pagination";
+import { DEFAULT_LIST_PAGE_SIZE, listBlogs } from "@/lib/meshkee";
+
+export const metadata = {
+  title: "مقالات | رسام تجارت هواران",
+  description: "مقالات و دانشنامه تخصصی شرکت رسام تجارت هواران",
+};
+
+type PageProps = {
+  searchParams: Promise<{ page?: string }>;
+};
+
+export default async function ArticlesPage({ searchParams }: PageProps) {
+  const params = await searchParams;
+  const page = Math.max(1, Number.parseInt(params.page || "1", 10) || 1);
+  const pageSize = DEFAULT_LIST_PAGE_SIZE;
+  const { items, total } = await listBlogs({
+    page,
+    pageSize,
+    type: "blog",
+  });
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="مقالات"
+          titleEn="ARTICLES"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "مقالات", href: "/articles" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page">
+            <div className="mb-8 flex justify-center border-b border-[#eee] pb-3">
+              <span className="border-b border-[#232323] px-3 pb-2 text-sm font-semibold text-[#232323]">
+                همه
+              </span>
+            </div>
+            <ArticlesGrid items={items} />
+            <Pagination
+              basePath="/articles"
+              page={page}
+              pageSize={pageSize}
+              total={total}
+            />
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/blogs/page.tsx

@@ -0,0 +1,5 @@
+import { redirect } from "next/navigation";
+
+export default function BlogsAliasPage() {
+  redirect("/articles");
+}

src/app/catalog/page.tsx

@@ -0,0 +1,93 @@
+import Image from "next/image";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { catalogPage } from "@/data/company";
+
+export const metadata = {
+  title: "کاتالوگ | رسام تجارت هواران",
+  description:
+    "دانلود کاتالوگ عمومی شرکت رسام تجارت هواران؛ محصولات و فعالیت‌ها",
+};
+
+export default function CatalogPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title={catalogPage.title}
+          titleEn={catalogPage.titleEn}
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "کاتالوگ", href: "/catalog" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page grid max-w-4xl items-center gap-8 md:grid-cols-2">
+            <div className="relative mx-auto aspect-[5/4] w-full max-w-md overflow-hidden bg-[#fafafa]">
+              <Image
+                src={catalogPage.cover}
+                alt={catalogPage.heading}
+                fill
+                className="object-contain p-4"
+                sizes="(max-width: 768px) 100vw, 40vw"
+                priority
+              />
+            </div>
+
+            <div>
+              <h2 className="mb-4 text-xl font-bold text-[#232323]">
+                {catalogPage.heading}
+              </h2>
+              <div className="mb-6 space-y-3">
+                {catalogPage.text.map((paragraph) => (
+                  <p
+                    key={paragraph}
+                    className="text-sm leading-8 text-[#666] text-justify"
+                  >
+                    {paragraph}
+                  </p>
+                ))}
+              </div>
+
+              <a
+                href={catalogPage.downloadHref}
+                download={catalogPage.fileName}
+                className="group inline-flex items-stretch overflow-hidden bg-[#f3f3f3] text-[#232323] transition hover:bg-[#ececec]"
+              >
+                <span className="flex items-center justify-center bg-accent-green px-4 text-white transition group-hover:bg-[#218838]">
+                  <svg
+                    width="20"
+                    height="20"
+                    viewBox="0 0 24 24"
+                    fill="none"
+                    aria-hidden
+                  >
+                    <path
+                      d="M12 3v12m0 0 4-4m-4 4-4-4M5 21h14"
+                      stroke="currentColor"
+                      strokeWidth="1.8"
+                      strokeLinecap="round"
+                      strokeLinejoin="round"
+                    />
+                  </svg>
+                </span>
+                <span className="flex flex-col justify-center px-5 py-3 text-right">
+                  <span className="text-sm font-bold leading-none">
+                    {catalogPage.downloadLabel} کاتالوگ
+                  </span>
+                  <span className="mt-1.5 text-[11px] tracking-wide text-[#888]">
+                    PDF — HavaranCatalog.pdf
+                  </span>
+                </span>
+              </a>
+            </div>
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/contact/page.tsx

@@ -0,0 +1,11 @@
+import type { Metadata } from "next";
+import { ContactUsView } from "@/components/ContactUsView";
+
+export const metadata: Metadata = {
+  title: "تماس باما | هواران",
+  description: "تماس با رسام تجارت هواران؛ آدرس، تلفن، ایمیل و فرم پیام",
+};
+
+export default function ContactUsPage() {
+  return <ContactUsView />;
+}

src/app/documents/page.tsx

@@ -0,0 +1,45 @@
+import { DocumentsGallery } from "@/components/DocumentsGallery";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { documentsCerts, documentsSatisfaction } from "@/data/documents";
+
+export const metadata = {
+  title: "مدارک | رسام تجارت هواران",
+  description:
+    "گواهینامه‌ها و رضایتمندی‌های مشتریان رسام تجارت هواران",
+};
+
+export default function DocumentsPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="مدارک"
+          titleEn="DOCUMENTS"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "مدارک", href: "/documents" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page">
+            <DocumentsGallery items={documentsCerts} />
+          </div>
+        </section>
+
+        <section className="section section-gray">
+          <div className="container-page">
+            <div className="section-head">
+              <h2>رضایتمندی ها</h2>
+            </div>
+            <DocumentsGallery items={documentsSatisfaction} />
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/globals.css

@@ -1,26 +1,365 @@
 @import "tailwindcss";
 
+@font-face {
+  font-family: "iran-yekan";
+  src: url("https://cdn.meshkee.com/web-builder/fonts/iran-yekan/iran-yekan-regular.ttf");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "iran-yekan";
+  src: url("https://cdn.meshkee.com/web-builder/fonts/iran-yekan/iran-yekan-medium.ttf");
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "iran-yekan";
+  src: url("https://cdn.meshkee.com/web-builder/fonts/iran-yekan/iran-yekan-bold.ttf");
+  font-weight: 700;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: "iran-yekan";
+  src: url("https://cdn.meshkee.com/web-builder/fonts/iran-yekan/iran-yekan-extrabold.ttf");
+  font-weight: 800;
+  font-style: normal;
+  font-display: swap;
+}
+
 :root {
   --background: #ffffff;
-  --foreground: #171717;
+  --foreground: #232323;
+  --muted: #6f6f6f;
+  --light-gray: #f7f7f7;
+  --btn-gray: #efefef;
+  --line: #e5e5e5;
+  --brand: #ee1c25;
+  --brand-navy: #002776;
+  --accent-green: #009543;
+  --container: 1170px;
 }
 
 @theme inline {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
+  --color-muted: var(--muted);
+  --color-light-gray: var(--light-gray);
+  --color-btn-gray: var(--btn-gray);
+  --color-line: var(--line);
+  --color-brand: var(--brand);
+  --color-brand-navy: var(--brand-navy);
+  --color-accent-green: var(--accent-green);
+  --font-sans: "iran-yekan", Tahoma, sans-serif;
 }
 
-@media (prefers-color-scheme: dark) {
-  :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
-  }
+* {
+  box-sizing: border-box;
+}
+
+html {
+  scroll-behavior: smooth;
 }
 
 body {
-  background: var(--background);
+  margin: 0;
+  background: #fff;
   color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
+  font-family: "iran-yekan", Tahoma, sans-serif;
+  font-size: 14px;
+  line-height: 1.7;
+}
+
+/* Force Western digits for mixed Latin+number tokens (F300, IP55, …).
+   Iran Yekan maps ASCII 0-9 to Persian glyphs; Tahoma keeps Latin shapes. */
+.latin-digits {
+  font-family: Tahoma, Arial, "iran-yekan", sans-serif;
+  unicode-bidi: isolate;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+  display: block;
+}
+
+.container-page {
+  width: min(var(--container), calc(100% - 30px));
+  margin-inline: auto;
+}
+
+.section {
+  padding: 30px 0;
+}
+
+.section-gray {
+  background: var(--light-gray);
+}
+
+.section-head {
+  text-align: center;
+  margin-bottom: 35px;
+}
+
+.section-head h2 {
+  margin: 0 0 8px;
+  font-size: 28px;
+  font-weight: 700;
+  color: #232323;
+}
+
+.section-head p {
+  margin: 0;
+  color: #9a9a9a;
+  font-size: 15px;
+  letter-spacing: 2px;
+  text-transform: uppercase;
+}
+
+.btn-more {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 40px;
+  padding: 8px 22px;
+  background: var(--btn-gray);
+  color: #222;
+  border: none;
+  border-left: 3px solid var(--accent-green);
+  font-size: 13px;
+  font-weight: 500;
+  transition: 0.25s ease;
+}
+
+.btn-more:hover {
+  background: #e4e4e4;
+}
+
+.btn-cart {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  min-height: 42px;
+  background: var(--btn-gray);
+  color: #222;
+  border: none;
+  border-left: 3px solid var(--accent-green);
+  font-size: 13px;
+  font-weight: 500;
+}
+
+.card-shadow {
+  background: #fff;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
+}
+
+.round-box {
+  border-radius: 8px;
+  overflow: hidden;
+}
+
+.nav-link-item {
+  color: #232323;
+  font-size: 14px;
+  font-weight: 500;
+  padding: 8px 11px;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  white-space: nowrap;
+}
+
+.nav-link-item:hover {
+  color: var(--brand);
+}
+
+.dropdown-panel {
+  position: absolute;
+  top: 100%;
+  right: 0;
+  min-width: 210px;
+  background: #fff;
+  border: 1px solid #eee;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+  padding: 8px 0;
+  z-index: 50;
+}
+
+.dropdown-panel a {
+  display: block;
+  padding: 9px 16px;
+  font-size: 13px;
+  color: #444;
+}
+
+.dropdown-panel a:hover {
+  background: #f7f7f7;
+  color: var(--brand);
+}
+
+.portfolio-card {
+  display: block;
+  overflow: hidden;
+  background: #fff;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
+  transition: box-shadow 0.3s ease;
+}
+
+.portfolio-card:hover {
+  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.1);
+}
+
+.portfolio-card-overlay {
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(
+    to top,
+    rgba(0, 39, 118, 0.88) 0%,
+    rgba(0, 39, 118, 0.35) 42%,
+    rgba(0, 0, 0, 0.05) 100%
+  );
+  transition: opacity 0.3s ease;
+}
+
+.portfolio-card:hover .portfolio-card-overlay {
+  opacity: 0.95;
+}
+
+.portfolio-card-text {
+  position: absolute;
+  inset-inline: 0;
+  bottom: 0;
+  padding: 18px 16px;
+  text-align: right;
+  color: #fff;
+  z-index: 1;
+}
+
+.portfolio-card-text h2 {
+  margin: 0 0 4px;
+  font-size: 16px;
+  font-weight: 700;
+  line-height: 1.5;
+}
+
+.portfolio-card-text p {
+  margin: 0;
+  font-size: 12px;
+  font-weight: 500;
+  letter-spacing: 0.4px;
+  color: rgba(255, 255, 255, 0.82);
+}
+
+.article-body {
+  color: #555;
+  font-size: 15px;
+  line-height: 2;
+  text-align: justify;
+}
+
+.article-body p {
+  margin: 0 0 1rem;
+}
+
+.article-body strong {
+  color: #232323;
+  font-weight: 700;
+}
+
+.article-body a {
+  color: var(--brand-navy);
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+
+.article-body img {
+  display: block;
+  max-width: 100%;
+  height: auto;
+  margin: 1.25rem auto;
+}
+
+.article-body ul,
+.article-body ol {
+  margin: 0 0 1rem;
+  padding-inline-start: 1.4rem;
+}
+
+.article-body li {
+  margin-bottom: 0.4rem;
+}
+
+.pagination-nav {
+  display: flex;
+  justify-content: center;
+  margin-top: 40px;
+  padding-top: 10px;
+}
+
+.pagination-list {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  direction: rtl;
+}
+
+.pagination-link {
+  display: inline-flex;
+  min-width: 40px;
+  height: 40px;
+  align-items: center;
+  justify-content: center;
+  padding: 0 12px;
+  border: 1px solid #e5e5e5;
+  background: #fff;
+  color: #555;
+  font-size: 14px;
+  font-weight: 500;
+  transition: 0.2s ease;
+}
+
+.pagination-link:hover {
+  border-color: var(--brand-navy);
+  color: var(--brand-navy);
+}
+
+.pagination-link.is-active {
+  border-color: var(--brand-navy);
+  background: var(--brand-navy);
+  color: #fff;
+}
+
+.pagination-link.is-disabled {
+  opacity: 0.45;
+  pointer-events: none;
+}
+
+.pagination-ellipsis {
+  display: inline-flex;
+  min-width: 28px;
+  justify-content: center;
+  color: #999;
+}
+
+@media (max-width: 991px) {
+  .section-head h2 {
+    font-size: 22px;
+  }
 }

src/app/layout.tsx

@@ -1,29 +1,27 @@
 import type { Metadata } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
+import { LatinDigitsEnhancer } from "@/components/LatinDigits";
 import "./globals.css";
 
-const geistSans = Geist({
-  variable: "--font-geist-sans",
-  subsets: ["latin"],
-});
-
-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",
-  subsets: ["latin"],
-});
-
 export const metadata: Metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
+  title: "صفحه اصلی | رسام تجارت هواران",
+  description:
+    "شرکت رسام تجارت هواران در حوزه طراحی و تولید تجهیزاتی نظیر چیلر، فن، هواساز، فن کویل و غیره و همچنین توان و تجربه در امور بازرگانی اعضای مجموعه خود آماده همکاری و ارائه خدمات در این زمینه است.",
+  icons: {
+    icon: "/favicon.png",
+  },
 };
 
-export default function RootLayout({ children }: LayoutProps<"/">) {
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
   return (
-    <html
-      lang="en"
-      className={`${geistSans.variable} ${geistMono.variable} h-full antialiased`}
-    >
-      <body className="min-h-full flex flex-col">{children}</body>
+    <html lang="fa" dir="rtl">
+      <body className="min-h-full antialiased">
+        {children}
+        <LatinDigitsEnhancer />
+      </body>
     </html>
   );
 }

src/app/page.tsx

@@ -1,69 +1,31 @@
-import Image from "next/image";
+import { About } from "@/components/About";
+import { Articles } from "@/components/Articles";
+import { Clients } from "@/components/Clients";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { Hero } from "@/components/Hero";
+import { Partners } from "@/components/Partners";
+import { Products } from "@/components/Products";
+import { Services } from "@/components/Services";
+import { Solutions } from "@/components/Solutions";
+import { SpecialProducts } from "@/components/SpecialProducts";
 
 export default function Home() {
   return (
-    <div className="flex flex-col flex-1 items-center justify-center bg-zinc-50 font-sans dark:bg-black">
-      <main className="flex flex-1 w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
-        <Image
-          className="dark:invert h-5 w-[100px]"
-          src="/next.svg"
-          alt="Next.js logo"
-          width={100}
-          height={20}
-          priority
-        />
-        <div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
-          <h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
-            To get started, edit the{" "}
-            <code className="rounded bg-black/[.06] px-1.5 py-0.5 font-mono text-[0.9em] dark:bg-white/[.08]">
-              page.tsx
-            </code>{" "}
-            file.
-          </h1>
-          <p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
-            Looking for a starting point or more instructions? Head over to{" "}
-            <a
-              href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Templates
-            </a>{" "}
-            or the{" "}
-            <a
-              href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Learning
-            </a>{" "}
-            center.
-          </p>
-        </div>
-        <div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
-          <a
-            className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Image
-              className="dark:invert h-[14px] w-4"
-              src="/vercel.svg"
-              alt="Vercel logomark"
-              width={16}
-              height={14}
-            />
-            Deploy Now
-          </a>
-          <a
-            className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
-            href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Documentation
-          </a>
-        </div>
+    <>
+      <Header />
+      <main>
+        <Hero />
+        <Partners />
+        <Products />
+        <SpecialProducts />
+        <Solutions />
+        <Services />
+        <Articles />
+        <About />
+        <Clients />
       </main>
-    </div>
+      <Footer />
+    </>
   );
 }

src/app/portfolio-details/[id]/page.tsx

@@ -0,0 +1,10 @@
+import { redirect } from "next/navigation";
+
+type PageProps = {
+  params: Promise<{ id: string }>;
+};
+
+export default async function PortfolioDetailsAliasPage({ params }: PageProps) {
+  const { id } = await params;
+  redirect(`/portfolios/${id}`);
+}

src/app/portfolios/[slug]/page.tsx

@@ -0,0 +1,54 @@
+import { notFound } from "next/navigation";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { PortfolioDetailView } from "@/components/PortfolioDetail";
+import { portfoliosFallback } from "@/data/portfolios";
+import { getPortfolio } from "@/lib/meshkee";
+
+type PageProps = {
+  params: Promise<{ slug: string }>;
+};
+
+export async function generateStaticParams() {
+  return portfoliosFallback.map((item) => ({ slug: item.slug }));
+}
+
+export async function generateMetadata({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getPortfolio(slug);
+  if (!item) {
+    return { title: "پروژه | رسام تجارت هواران" };
+  }
+  return {
+    title: `${item.title} | رسام تجارت هواران`,
+    description:
+      item.description ||
+      `نمونه کار ${item.title} — شرکت رسام تجارت هواران`,
+  };
+}
+
+export default async function PortfolioDetailPage({ params }: PageProps) {
+  const { slug } = await params;
+  const { item } = await getPortfolio(slug);
+  if (!item) notFound();
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title={item.title}
+          titleEn={item.titleEn || "PROJECT DETAILS"}
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "پروژه ها", href: "/portfolios" },
+            { label: "جزئیات نمونه کار", href: `/portfolios/${item.slug}` },
+          ]}
+        />
+        <PortfolioDetailView item={item} />
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/portfolios/page.tsx

@@ -0,0 +1,56 @@
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { PortfolioGrid } from "@/components/PortfolioGrid";
+import { Pagination } from "@/components/Pagination";
+import { DEFAULT_LIST_PAGE_SIZE, listPortfolios } from "@/lib/meshkee";
+
+export const metadata = {
+  title: "پروژه ها | رسام تجارت هواران",
+  description: "پروژه ها و نمونه کار های شرکت رسام تجارت هواران",
+};
+
+type PageProps = {
+  searchParams: Promise<{ page?: string }>;
+};
+
+export default async function PortfoliosPage({ searchParams }: PageProps) {
+  const params = await searchParams;
+  const page = Math.max(1, Number.parseInt(params.page || "1", 10) || 1);
+  const pageSize = DEFAULT_LIST_PAGE_SIZE;
+  const { items, total } = await listPortfolios({ page, pageSize });
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="پروژه ها"
+          titleEn="PROJECTS"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "پروژه ها", href: "/portfolios" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page">
+            <div className="mb-8 flex justify-center border-b border-[#eee] pb-3">
+              <span className="border-b border-[#232323] px-3 pb-2 text-sm font-semibold text-[#232323]">
+                همه
+              </span>
+            </div>
+            <PortfolioGrid items={items} />
+            <Pagination
+              basePath="/portfolios"
+              page={page}
+              pageSize={pageSize}
+              total={total}
+            />
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/products/air-conditioner/page.tsx

@@ -0,0 +1,139 @@
+import Image from "next/image";
+import { Accordion } from "@/components/Accordion";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero, SpecList } from "@/components/PageShared";
+import { ahuAdvantages, ahuFaq, ahuIntro } from "@/data/ahu";
+
+export const metadata = {
+  title: "هواساز | رسام تجارت هواران",
+  description: "خرید انواع هواساز با قیمت مناسب و گارانتی معتبر",
+};
+
+export default function AirConditionerPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="خرید هــواســاز"
+          titleEn="Air Handling Unit"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "محصولات", href: "/products" },
+            { label: "هواساز", href: "/products/air-conditioner" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+            <div className="relative flex min-h-[280px] items-center justify-center">
+              <Image
+                src={ahuIntro.image}
+                alt={ahuIntro.imageAlt}
+                width={560}
+                height={420}
+                className="h-auto w-full max-w-lg object-contain"
+                sizes="(max-width: 1024px) 100vw, 50vw"
+                priority
+              />
+            </div>
+            <div>
+              <h2 className="mb-1 text-xl font-bold text-[#232323]">
+                {ahuIntro.title}
+              </h2>
+              <p className="mb-4 text-sm tracking-wide text-[#999]">
+                {ahuIntro.titleEn}
+              </p>
+              <div className="space-y-3">
+                {ahuIntro.text.map((paragraph) => (
+                  <p
+                    key={paragraph.slice(0, 40)}
+                    className="text-sm leading-8 text-[#666] text-justify"
+                  >
+                    {paragraph}
+                  </p>
+                ))}
+              </div>
+              <h3 className="mt-5 mb-3 text-base font-bold text-[#232323]">
+                {ahuIntro.componentsTitle}
+              </h3>
+              <ul className="space-y-2">
+                {ahuIntro.components.map((item) => (
+                  <li
+                    key={item}
+                    className="flex gap-2 text-sm leading-7 text-[#555]"
+                  >
+                    <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+                    <span>{item}</span>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </div>
+        </section>
+
+        <section className="section section-gray">
+          <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+            <div>
+              <SpecList items={ahuIntro.specs} />
+            </div>
+            <div className="relative flex min-h-[280px] items-center justify-center">
+              <Image
+                src={ahuIntro.specsImage}
+                alt="مشخصات فنی هواساز"
+                width={560}
+                height={420}
+                className="h-auto w-full max-w-lg object-contain"
+                sizes="(max-width: 1024px) 100vw, 50vw"
+              />
+            </div>
+          </div>
+        </section>
+
+        <section className="section">
+          <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+            <div
+              className={`relative flex min-h-[280px] items-center justify-center overflow-hidden bg-[#f7f7f7]`}
+            >
+              <Image
+                src={ahuAdvantages.image}
+                alt={ahuAdvantages.imageAlt}
+                width={560}
+                height={420}
+                className="h-auto w-full max-w-lg object-cover"
+                sizes="(max-width: 1024px) 100vw, 50vw"
+              />
+            </div>
+            <div>
+              <h2 className="mb-4 text-xl font-bold text-[#232323]">
+                {ahuAdvantages.title}
+              </h2>
+              <ul className="space-y-3">
+                {ahuAdvantages.items.map((item) => (
+                  <li
+                    key={item.slice(0, 40)}
+                    className="flex gap-2 text-sm leading-8 text-[#555] text-justify"
+                  >
+                    <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+                    <span>{item}</span>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </div>
+        </section>
+
+        <section className="section section-gray">
+          <div className="container-page max-w-3xl">
+            <h2 className="mb-4 text-xl font-bold text-[#232323]">
+              پرسش‌های متداول
+            </h2>
+            <Accordion items={ahuFaq} />
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/products/chiller/page.tsx

@@ -0,0 +1,122 @@
+import Image from "next/image";
+import { Accordion } from "@/components/Accordion";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero, SpecList } from "@/components/PageShared";
+import { chillerBlocks, chillerFaq, chillerIntro } from "@/data/chiller";
+
+export const metadata = {
+  title: "چیلر | رسام تجارت هواران",
+  description: "خرید انواع چیلر با قیمت مناسب و کیفیت بالا | رسام تجارت هواران",
+};
+
+export default function ChillerPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="چیلـــر"
+          titleEn="Chiller"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "محصولات", href: "/products" },
+            { label: "چیلر", href: "/products/chiller" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page max-w-4xl">
+            <h2 className="mb-4 text-center text-xl font-bold text-[#232323]">
+              {chillerIntro.title}
+            </h2>
+            {chillerIntro.text.map((paragraph) => (
+              <p
+                key={paragraph.slice(0, 40)}
+                className="text-sm leading-8 text-[#666] text-justify"
+              >
+                {paragraph}
+              </p>
+            ))}
+          </div>
+        </section>
+
+        {chillerBlocks.map((block, index) => (
+          <section
+            key={block.id}
+            className={`section ${index % 2 === 0 ? "section-gray" : ""}`}
+          >
+            <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+              <div className={index % 2 === 1 ? "lg:order-2" : ""}>
+                <h2 className="mb-1 text-lg font-bold leading-8 text-[#232323] sm:text-xl">
+                  {block.title}
+                </h2>
+                <p className="mb-4 text-sm tracking-wide text-[#999]">
+                  {block.titleEn}
+                </p>
+                <div className="space-y-3">
+                  {block.intro.map((paragraph) => (
+                    <p
+                      key={paragraph.slice(0, 40)}
+                      className="text-sm leading-8 text-[#666] text-justify"
+                    >
+                      {paragraph}
+                    </p>
+                  ))}
+                </div>
+
+                <h3 className="mt-6 mb-3 text-base font-bold text-[#232323]">
+                  {block.benefitsTitle}
+                </h3>
+                <div className="mb-4 grid grid-cols-3 gap-3">
+                  {block.benefits.map((f) => (
+                    <div key={f.label} className="text-center">
+                      <Image
+                        src={f.img}
+                        alt={f.label}
+                        width={64}
+                        height={64}
+                        className="mx-auto mb-2 object-contain"
+                      />
+                      <p className="text-xs text-[#555]">{f.label}</p>
+                    </div>
+                  ))}
+                </div>
+
+                <SpecList items={[...block.specs]} />
+              </div>
+
+              <div
+                className={`relative flex min-h-[280px] items-center justify-center ${
+                  index % 2 === 1 ? "lg:order-1" : ""
+                } ${block.isPng ? "" : "overflow-hidden bg-[#f7f7f7]"}`}
+              >
+                <Image
+                  src={block.image}
+                  alt={block.imageAlt}
+                  width={560}
+                  height={420}
+                  className={`h-auto w-full max-w-lg object-contain ${
+                    block.isPng ? "" : "object-cover"
+                  }`}
+                  sizes="(max-width: 1024px) 100vw, 50vw"
+                  priority={index === 0}
+                />
+              </div>
+            </div>
+          </section>
+        ))}
+
+        <section className="section section-gray">
+          <div className="container-page max-w-3xl">
+            <h2 className="mb-4 text-xl font-bold text-[#232323]">
+              پرسش‌های متداول
+            </h2>
+            <Accordion items={chillerFaq} />
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/products/f300/page.tsx

@@ -0,0 +1,116 @@
+import Image from "next/image";
+import { Accordion } from "@/components/Accordion";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { f300Blocks, f300Intro } from "@/data/f300";
+
+export const metadata = {
+  title: "فن تخلیه دود F300 | رسام تجارت هواران",
+  description:
+    "فن تخلیه دود f300 با بهترین قیمت و کیفیت مناسب | رسام تجارت هواران",
+};
+
+export default function F300Page() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="فـن تخلیه دود F300"
+          titleEn="F300 Smoke Exhaust Fan"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "محصولات", href: "/products" },
+            { label: "فن تخلیه دود F300", href: "/products/f300" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page grid items-center gap-8 md:grid-cols-2">
+            <div className="relative aspect-[16/10] overflow-hidden">
+              <Image
+                src={f300Intro.image}
+                alt={f300Intro.title}
+                fill
+                className="object-cover"
+                sizes="(max-width: 768px) 100vw, 50vw"
+                priority
+              />
+            </div>
+            <div>
+              <h2 className="mb-4 text-xl font-bold text-[#232323]">
+                {f300Intro.title}
+              </h2>
+              <div className="mb-5 space-y-3">
+                {f300Intro.text.map((paragraph) => (
+                  <p
+                    key={paragraph.slice(0, 40)}
+                    className="text-sm leading-8 text-[#666] text-justify"
+                  >
+                    {paragraph}
+                  </p>
+                ))}
+              </div>
+              <ul className="space-y-2">
+                {f300Intro.benefits.map((item) => (
+                  <li
+                    key={item}
+                    className="flex gap-2 text-sm leading-7 text-[#555]"
+                  >
+                    <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+                    <span>{item}</span>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </div>
+        </section>
+
+        {f300Blocks.map((block, index) => (
+          <section
+            key={block.id}
+            className={`section ${index % 2 === 0 ? "section-gray" : ""}`}
+          >
+            <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+              <div className={index % 2 === 1 ? "lg:order-2" : ""}>
+                <h2 className="mb-4 text-lg font-bold leading-8 text-[#232323] sm:text-xl">
+                  {block.title}
+                </h2>
+                <div className="space-y-3">
+                  {block.intro.map((paragraph) => (
+                    <p
+                      key={paragraph.slice(0, 40)}
+                      className="text-sm leading-8 text-[#666] text-justify"
+                    >
+                      {paragraph}
+                    </p>
+                  ))}
+                </div>
+                {block.accordion ? <Accordion items={block.accordion} /> : null}
+              </div>
+
+              <div
+                className={`relative flex min-h-[280px] items-center justify-center ${
+                  index % 2 === 1 ? "lg:order-1" : ""
+                } ${block.isPng ? "" : "overflow-hidden bg-[#f7f7f7]"}`}
+              >
+                <Image
+                  src={block.image}
+                  alt={block.imageAlt}
+                  width={560}
+                  height={420}
+                  className={`h-auto w-full max-w-lg object-contain ${
+                    block.isPng ? "" : "object-cover"
+                  }`}
+                  sizes="(max-width: 1024px) 100vw, 50vw"
+                />
+              </div>
+            </div>
+          </section>
+        ))}
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/products/fancoil/page.tsx

@@ -0,0 +1,101 @@
+import Image from "next/image";
+import { Accordion } from "@/components/Accordion";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero, SpecList } from "@/components/PageShared";
+import { fancoilBlocks, fancoilFaq, fancoilIntro } from "@/data/fancoil";
+
+export const metadata = {
+  title: "فن کویل | رسام تجارت هواران",
+  description: "خرید انواع فن کویل با کیفیت مناسب | رسام تجارت هواران",
+};
+
+export default function FanCoilPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="فــن کویـــل"
+          titleEn="Fan Coil"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "محصولات", href: "/products" },
+            { label: "فن کویل", href: "/products/fancoil" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page max-w-4xl">
+            <h2 className="mb-1 text-xl font-bold text-[#232323]">
+              {fancoilIntro.title}
+            </h2>
+            <p className="mb-4 text-sm tracking-wide text-[#999]">
+              {fancoilIntro.titleEn}
+            </p>
+            {fancoilIntro.text.map((paragraph) => (
+              <p
+                key={paragraph.slice(0, 40)}
+                className="text-sm leading-8 text-[#666] text-justify"
+              >
+                {paragraph}
+              </p>
+            ))}
+          </div>
+        </section>
+
+        {fancoilBlocks.map((block, index) => (
+          <section
+            key={block.id}
+            className={`section ${index % 2 === 0 ? "section-gray" : ""}`}
+          >
+            <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+              <div className={index % 2 === 1 ? "lg:order-2" : ""}>
+                <h2 className="mb-4 text-lg font-bold leading-8 text-[#232323] sm:text-xl">
+                  {block.title}
+                </h2>
+                <div className="space-y-3">
+                  {block.intro.map((paragraph) => (
+                    <p
+                      key={paragraph.slice(0, 40)}
+                      className="text-sm leading-8 text-[#666] text-justify"
+                    >
+                      {paragraph}
+                    </p>
+                  ))}
+                </div>
+                <SpecList items={[...block.specs]} />
+              </div>
+
+              <div
+                className={`relative flex min-h-[280px] items-center justify-center ${
+                  index % 2 === 1 ? "lg:order-1" : ""
+                }`}
+              >
+                <Image
+                  src={block.image}
+                  alt={block.imageAlt}
+                  width={560}
+                  height={420}
+                  className="h-auto w-full max-w-lg object-contain"
+                  sizes="(max-width: 1024px) 100vw, 50vw"
+                  priority={index === 0}
+                />
+              </div>
+            </div>
+          </section>
+        ))}
+
+        <section className="section section-gray">
+          <div className="container-page max-w-3xl">
+            <h2 className="mb-4 text-xl font-bold text-[#232323]">
+              پرسش‌های متداول
+            </h2>
+            <Accordion items={fancoilFaq} />
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/products/havaran-fan/page.tsx

@@ -0,0 +1,177 @@
+import Image from "next/image";
+import { Accordion } from "@/components/Accordion";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero, SpecList } from "@/components/PageShared";
+import {
+  havaranFanAxial,
+  havaranFanBlocks,
+  havaranFanCentrifugal,
+  havaranFanFaq,
+} from "@/data/havaranFan";
+
+export const metadata = {
+  title: "فن هواران | رسام تجارت هواران",
+  description: "خرید انواع فن های هواران با بهترین کیفیت",
+};
+
+export default function HavaranFanPage() {
+  const axialBlocks = havaranFanBlocks.filter((b) => b.group === "axial");
+  const centrifugalBlocks = havaranFanBlocks.filter(
+    (b) => b.group === "centrifugal",
+  );
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="فــــن هــواران"
+          titleEn="Havaran Fan"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "محصولات", href: "/products" },
+            { label: "فن هواران", href: "/products/havaran-fan" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page max-w-4xl">
+            <h2 className="mb-1 text-xl font-bold text-[#232323]">
+              {havaranFanAxial.title}
+            </h2>
+            <p className="mb-4 text-sm tracking-wide text-[#999]">
+              {havaranFanAxial.titleEn}
+            </p>
+            {havaranFanAxial.intro.map((paragraph) => (
+              <p
+                key={paragraph.slice(0, 40)}
+                className="text-sm leading-8 text-[#666] text-justify"
+              >
+                {paragraph}
+              </p>
+            ))}
+          </div>
+        </section>
+
+        {axialBlocks.map((block, index) => (
+          <section
+            key={block.id}
+            className={`section ${index % 2 === 0 ? "section-gray" : ""}`}
+          >
+            <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+              <div className={index % 2 === 1 ? "lg:order-2" : ""}>
+                <h2 className="mb-1 text-lg font-bold leading-8 text-[#232323] sm:text-xl">
+                  {block.title}
+                </h2>
+                <p className="mb-4 text-sm tracking-wide text-[#999]">
+                  {block.titleEn}
+                </p>
+                <div className="space-y-3">
+                  {block.intro.map((paragraph) => (
+                    <p
+                      key={paragraph.slice(0, 40)}
+                      className="text-sm leading-8 text-[#666] text-justify"
+                    >
+                      {paragraph}
+                    </p>
+                  ))}
+                </div>
+                <SpecList items={[...block.specs]} />
+              </div>
+              <div
+                className={`relative flex min-h-[280px] items-center justify-center ${
+                  index % 2 === 1 ? "lg:order-1" : ""
+                }`}
+              >
+                <Image
+                  src={block.image}
+                  alt={block.imageAlt}
+                  width={560}
+                  height={420}
+                  className="h-auto w-full max-w-lg object-contain"
+                  sizes="(max-width: 1024px) 100vw, 50vw"
+                  priority={index === 0}
+                />
+              </div>
+            </div>
+          </section>
+        ))}
+
+        <section className="section">
+          <div className="container-page max-w-4xl">
+            <h2 className="mb-1 text-xl font-bold text-[#232323]">
+              {havaranFanCentrifugal.title}
+            </h2>
+            <p className="mb-4 text-sm tracking-wide text-[#999]">
+              {havaranFanCentrifugal.titleEn}
+            </p>
+            {havaranFanCentrifugal.intro.map((paragraph) => (
+              <p
+                key={paragraph.slice(0, 40)}
+                className="mb-3 text-sm leading-8 text-[#666] text-justify"
+              >
+                {paragraph}
+              </p>
+            ))}
+          </div>
+        </section>
+
+        {centrifugalBlocks.map((block, index) => (
+          <section
+            key={block.id}
+            className={`section ${index % 2 === 0 ? "section-gray" : ""}`}
+          >
+            <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+              <div className={index % 2 === 1 ? "lg:order-2" : ""}>
+                <h2 className="mb-1 text-lg font-bold leading-8 text-[#232323] sm:text-xl">
+                  {block.title}
+                </h2>
+                <p className="mb-4 text-sm tracking-wide text-[#999]">
+                  {block.titleEn}
+                </p>
+                <div className="space-y-3">
+                  {block.intro.map((paragraph) => (
+                    <p
+                      key={paragraph.slice(0, 40)}
+                      className="text-sm leading-8 text-[#666] text-justify"
+                    >
+                      {paragraph}
+                    </p>
+                  ))}
+                </div>
+                <SpecList items={[...block.specs]} />
+              </div>
+              <div
+                className={`relative flex min-h-[280px] items-center justify-center ${
+                  index % 2 === 1 ? "lg:order-1" : ""
+                } ${block.isPng ? "" : "overflow-hidden bg-[#f7f7f7]"}`}
+              >
+                <Image
+                  src={block.image}
+                  alt={block.imageAlt}
+                  width={560}
+                  height={420}
+                  className={`h-auto w-full max-w-lg object-contain ${
+                    block.isPng ? "" : "object-cover"
+                  }`}
+                  sizes="(max-width: 1024px) 100vw, 50vw"
+                />
+              </div>
+            </div>
+          </section>
+        ))}
+
+        <section className="section">
+          <div className="container-page max-w-3xl">
+            <h2 className="mb-4 text-xl font-bold text-[#232323]">
+              پرسش‌های متداول
+            </h2>
+            <Accordion items={havaranFanFaq} />
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/products/page.tsx

@@ -0,0 +1,45 @@
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { CatalogCard, PageHero } from "@/components/PageShared";
+import { productsList } from "@/data/pages";
+
+export const metadata = {
+  title: "محصولات | رسام تجارت هواران",
+  description:
+    "خرید انواع فن تخلیه دود F300، فن هواران، چیلر، فن کویل و هواساز از رسام تجارت هواران",
+};
+
+export default function ProductsPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="محصولات رسام تجارت هواران"
+          titleEn="HAVARAN Products"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "محصولات", href: "/products" },
+          ]}
+        />
+        <section className="section section-gray">
+          <div className="container-page">
+            <div className="grid gap-5 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5">
+              {productsList.map((item) => (
+                <CatalogCard
+                  key={item.slug}
+                  href={item.href}
+                  image={item.image}
+                  title={item.title}
+                  titleEn={item.titleEn}
+                  description={item.description}
+                />
+              ))}
+            </div>
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/projects/page.tsx

@@ -0,0 +1,5 @@
+import { redirect } from "next/navigation";
+
+export default function ProjectsAliasPage() {
+  redirect("/portfolios");
+}

src/app/solutions/building-installations/page.tsx

@@ -0,0 +1,31 @@
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero, UpdatingNotice } from "@/components/PageShared";
+
+export const metadata = {
+  title: "تاسیسات ساختمانی | هواران",
+};
+
+export default function BuildingInstallationsPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="تاسیسات ساختمانی"
+          titleEn="Building Installations"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "راهکارها", href: "/solutions" },
+            {
+              label: "تاسیسات ساختمانی",
+              href: "/solutions/building-installations",
+            },
+          ]}
+        />
+        <UpdatingNotice />
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/solutions/building-smoke-management/page.tsx

@@ -0,0 +1,170 @@
+import Image from "next/image";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { smokeBlocks, smokeIntro } from "@/data/smoke";
+
+export const metadata = {
+  title: "مدیریت دود ساختمان | هواران",
+  description: "سیستم های مدیریت دود ساختمان | رسام تجارت هواران",
+};
+
+export default function SmokeManagementPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="سیستم های مدیریت دود"
+          titleEn="Smoke Management Systems"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "راهکارها", href: "/solutions" },
+            {
+              label: "مدیریت دود ساختمان",
+              href: "/solutions/building-smoke-management",
+            },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page grid items-center gap-8 md:grid-cols-2">
+            <div className="relative flex min-h-[280px] items-center justify-center">
+              <Image
+                src={smokeIntro.image}
+                alt={smokeIntro.title}
+                width={560}
+                height={420}
+                className="h-auto w-full max-w-lg object-contain"
+                sizes="(max-width: 768px) 100vw, 50vw"
+                priority
+              />
+            </div>
+            <div>
+              <h2 className="mb-2 text-xl font-bold text-[#232323]">
+                {smokeIntro.title}
+              </h2>
+              {smokeIntro.titleEn ? (
+                <p className="mb-4 text-xs tracking-wide text-[#999]">
+                  {smokeIntro.titleEn}
+                </p>
+              ) : null}
+              <div className="space-y-3">
+                {smokeIntro.text.map((paragraph) => (
+                  <p
+                    key={paragraph.slice(0, 48)}
+                    className="text-sm leading-8 text-[#666] text-justify"
+                  >
+                    {paragraph}
+                  </p>
+                ))}
+              </div>
+              {smokeIntro.videoUrl ? (
+                <div className="mt-6 aspect-video overflow-hidden bg-black">
+                  <iframe
+                    src={smokeIntro.videoUrl}
+                    title="ویدیو سیستم مدیریت دود"
+                    className="h-full w-full"
+                    allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
+                    allowFullScreen
+                  />
+                </div>
+              ) : null}
+            </div>
+          </div>
+        </section>
+
+        {smokeBlocks.map((block, index) => (
+          <section
+            key={block.id}
+            className={`section ${index % 2 === 0 ? "section-gray" : ""}`}
+          >
+            <div
+              className={`container-page grid items-start gap-8 ${
+                block.image ? "lg:grid-cols-2" : ""
+              }`}
+            >
+              <div className={index % 2 === 1 && block.image ? "lg:order-2" : ""}>
+                <h2 className="mb-2 text-lg font-bold leading-8 text-[#232323] sm:text-xl">
+                  {block.title}
+                </h2>
+                {block.titleEn ? (
+                  <p className="mb-4 text-xs tracking-wide text-[#999]">
+                    {block.titleEn}
+                  </p>
+                ) : (
+                  <div className="mb-4" />
+                )}
+                {block.intro.length > 0 ? (
+                  <div className="space-y-3">
+                    {block.intro.map((paragraph) => (
+                      <p
+                        key={paragraph.slice(0, 48)}
+                        className="text-sm leading-8 text-[#666] text-justify"
+                      >
+                        {paragraph}
+                      </p>
+                    ))}
+                  </div>
+                ) : null}
+                {block.lists ? (
+                  <ul className="mt-4 space-y-2">
+                    {block.lists.map((item) => (
+                      <li
+                        key={item}
+                        className="flex gap-2 text-sm leading-7 text-[#555]"
+                      >
+                        <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+                        <span>{item}</span>
+                      </li>
+                    ))}
+                  </ul>
+                ) : null}
+                {block.groups
+                  ? block.groups.map((group) => (
+                      <div key={group.title} className="mt-4">
+                        <h3 className="mb-2 text-sm font-bold text-[#333]">
+                          {group.title}
+                        </h3>
+                        <ul className="space-y-2">
+                          {group.items.map((item) => (
+                            <li
+                              key={item}
+                              className="flex gap-2 text-sm leading-7 text-[#555]"
+                            >
+                              <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+                              <span>{item}</span>
+                            </li>
+                          ))}
+                        </ul>
+                      </div>
+                    ))
+                  : null}
+              </div>
+
+              {block.image ? (
+                <div
+                  className={`relative flex min-h-[280px] items-center justify-center ${
+                    index % 2 === 1 ? "lg:order-1" : ""
+                  } ${block.isPng ? "" : "overflow-hidden"}`}
+                >
+                  <Image
+                    src={block.image}
+                    alt={block.imageAlt ?? block.title}
+                    width={560}
+                    height={420}
+                    className={`h-auto w-full max-w-lg object-contain ${
+                      block.isPng ? "" : "object-cover"
+                    }`}
+                    sizes="(max-width: 1024px) 100vw, 50vw"
+                  />
+                </div>
+              ) : null}
+            </div>
+          </section>
+        ))}
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/solutions/hvac/page.tsx

@@ -0,0 +1,28 @@
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero, UpdatingNotice } from "@/components/PageShared";
+
+export const metadata = {
+  title: "تهویه مطبوع | هواران",
+};
+
+export default function HvacSolutionPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="تهویه مطبوع"
+          titleEn="Air Conditioning"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "راهکارها", href: "/solutions" },
+            { label: "تهویه مطبوع", href: "/solutions/hvac" },
+          ]}
+        />
+        <UpdatingNotice />
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/solutions/page.tsx

@@ -0,0 +1,45 @@
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { CatalogCard, PageHero } from "@/components/PageShared";
+import { solutionsList } from "@/data/pages";
+
+export const metadata = {
+  title: "راهکارها | رسام تجارت هواران",
+  description:
+    "راهکارهای مدیریت دود ساختمان، تهویه فضاهای مختلف، تهویه مطبوع، تونل و مترو و تاسیسات ساختمانی",
+};
+
+export default function SolutionsPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="راهکارهای تخصصی هواران"
+          titleEn="HAVARAN Solutions"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "راهکارها", href: "/solutions" },
+          ]}
+        />
+        <section className="section">
+          <div className="container-page">
+            <div className="grid gap-5 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5">
+              {solutionsList.map((item) => (
+                <CatalogCard
+                  key={item.slug}
+                  href={item.href}
+                  image={item.image}
+                  title={item.title}
+                  titleEn={item.titleEn}
+                  description={item.description}
+                />
+              ))}
+            </div>
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/solutions/tunnels-and-subways/page.tsx

@@ -0,0 +1,129 @@
+import Image from "next/image";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { tunnelBlocks, tunnelIntro } from "@/data/tunnel";
+
+export const metadata = {
+  title: "تونل و مترو | هواران",
+  description: "راهکارهای تهویه تونل و مترو | رسام تجارت هواران",
+};
+
+export default function TunnelsPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="تونل و مترو"
+          titleEn="Tunnels and Subways"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "راهکارها", href: "/solutions" },
+            { label: "تونل و مترو", href: "/solutions/tunnels-and-subways" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page grid items-center gap-8 md:grid-cols-2">
+            <div className="relative flex min-h-[280px] items-center justify-center overflow-hidden">
+              <Image
+                src={tunnelIntro.image}
+                alt={tunnelIntro.title}
+                width={560}
+                height={420}
+                className="h-auto w-full max-w-lg object-cover"
+                sizes="(max-width: 768px) 100vw, 50vw"
+                priority
+              />
+            </div>
+            <div>
+              <h2 className="mb-4 text-xl font-bold text-[#232323]">
+                {tunnelIntro.title}
+              </h2>
+              <div className="space-y-3">
+                {tunnelIntro.text.map((paragraph) => (
+                  <p
+                    key={paragraph.slice(0, 48)}
+                    className="text-sm leading-8 text-[#666] text-justify"
+                  >
+                    {paragraph}
+                  </p>
+                ))}
+              </div>
+            </div>
+          </div>
+        </section>
+
+        {tunnelBlocks.map((block, index) => (
+          <section
+            key={block.id}
+            className={`section ${index % 2 === 0 ? "section-gray" : ""}`}
+          >
+            <div
+              className={`container-page grid items-start gap-8 ${
+                block.image ? "lg:grid-cols-2" : ""
+              }`}
+            >
+              <div className={index % 2 === 1 && block.image ? "lg:order-2" : ""}>
+                <h2 className="mb-2 text-lg font-bold leading-8 text-[#232323] sm:text-xl">
+                  {block.title}
+                </h2>
+                {block.titleEn ? (
+                  <p className="mb-4 text-xs tracking-wide text-[#999]">
+                    {block.titleEn}
+                  </p>
+                ) : (
+                  <div className="mb-4" />
+                )}
+                <div className="space-y-3">
+                  {block.intro.map((paragraph) => (
+                    <p
+                      key={paragraph.slice(0, 48)}
+                      className="text-sm leading-8 text-[#666] text-justify"
+                    >
+                      {paragraph}
+                    </p>
+                  ))}
+                </div>
+                {block.lists ? (
+                  <ul className="mt-4 space-y-2">
+                    {block.lists.map((item) => (
+                      <li
+                        key={item}
+                        className="flex gap-2 text-sm leading-7 text-[#555]"
+                      >
+                        <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+                        <span>{item}</span>
+                      </li>
+                    ))}
+                  </ul>
+                ) : null}
+              </div>
+
+              {block.image ? (
+                <div
+                  className={`relative flex min-h-[280px] items-center justify-center ${
+                    index % 2 === 1 ? "lg:order-1" : ""
+                  } ${block.isPng ? "" : "overflow-hidden"}`}
+                >
+                  <Image
+                    src={block.image}
+                    alt={block.imageAlt ?? block.title}
+                    width={560}
+                    height={420}
+                    className={`h-auto w-full max-w-lg object-contain ${
+                      block.isPng ? "" : "object-cover"
+                    }`}
+                    sizes="(max-width: 1024px) 100vw, 50vw"
+                  />
+                </div>
+              ) : null}
+            </div>
+          </section>
+        ))}
+      </main>
+      <Footer />
+    </>
+  );
+}

src/app/solutions/ventilation-spaces/page.tsx

@@ -0,0 +1,28 @@
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero, UpdatingNotice } from "@/components/PageShared";
+
+export const metadata = {
+  title: "تهویه فضاهای مختلف | هواران",
+};
+
+export default function VentilationSpacesPage() {
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title="تهویه فضاهای مختلف"
+          titleEn="Ventilation of Different Spaces"
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "راهکارها", href: "/solutions" },
+            { label: "تهویه فضاهای مختلف", href: "/solutions/ventilation-spaces" },
+          ]}
+        />
+        <UpdatingNotice />
+      </main>
+      <Footer />
+    </>
+  );
+}

src/components/About.tsx

@@ -0,0 +1,24 @@
+import { about } from "@/data/home";
+
+export function About() {
+  return (
+    <section id="about" className="section">
+      <div className="container-page">
+        <div className="mx-auto max-w-3xl border-x border-[#ddd] px-6 py-2 text-center sm:px-12">
+          <h1 className="mb-5 text-2xl font-bold text-[#232323] sm:text-[28px]">
+            {about.title}
+          </h1>
+          <p className="mb-4 leading-8 text-[#666]">{about.paragraphs[0]}</p>
+          <p className="mb-6 leading-8 text-[#666]">{about.paragraphs[1]}</p>
+          <a
+            href="/about"
+            className="inline-flex items-center gap-2 text-sm font-bold text-[#232323]"
+          >
+            <span aria-hidden className="text-lg">‹</span>
+            ادامه
+          </a>
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/Accordion.tsx

@@ -0,0 +1,57 @@
+"use client";
+
+import { useState } from "react";
+
+type AccordionItem = {
+  title: string;
+  items: string[];
+};
+
+export function Accordion({ items }: { items: AccordionItem[] }) {
+  const [open, setOpen] = useState<number | null>(null);
+
+  return (
+    <div className="mt-5 space-y-2">
+      {items.map((item, index) => {
+        const isOpen = open === index;
+        return (
+          <div key={item.title} className="overflow-hidden border border-[#e8e8e8]">
+            <button
+              type="button"
+              onClick={() => setOpen(isOpen ? null : index)}
+              className="flex w-full items-center justify-between bg-[#f7f7f7] px-4 py-3 text-right text-sm font-medium text-[#232323]"
+            >
+              <span>{item.title}</span>
+              <svg
+                width="12"
+                height="12"
+                viewBox="0 0 12 12"
+                className={`shrink-0 transition ${isOpen ? "rotate-180" : ""}`}
+                aria-hidden
+              >
+                <path
+                  d="M2 4.5 6 8.5 10 4.5"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="1.5"
+                />
+              </svg>
+            </button>
+            {isOpen ? (
+              <div className="bg-[#f7f7f7] px-4 pb-4 pt-1 text-sm leading-8 text-[#7b7373]">
+                <ul className="space-y-2">
+                  {item.items.map((line) => (
+                    <li key={line} className="flex gap-2">
+                      <span className="mt-2 shrink-0">•</span>
+                      <span>{line}</span>
+                    </li>
+                  ))}
+                </ul>
+              </div>
+            ) : null}
+          </div>
+        );
+      })}
+    </div>
+  );
+}

src/components/ArticleDetail.tsx

@@ -0,0 +1,60 @@
+import Image from "next/image";
+import type { BlogArticle } from "@/data/articles";
+import { resolveMediaUrl } from "@/lib/meshkee";
+
+function formatDate(date: string) {
+  if (!date) return "";
+  try {
+    return new Intl.DateTimeFormat("fa-IR", {
+      year: "numeric",
+      month: "long",
+      day: "numeric",
+    }).format(new Date(date));
+  } catch {
+    return date;
+  }
+}
+
+export function ArticleDetailView({ item }: { item: BlogArticle }) {
+  const image = resolveMediaUrl(item.image);
+  const contentHtml = (item.contentHtml || "").replace(
+    /\bsrc=["']([^"']+)["']/gi,
+    (_full, src: string) => `src="${resolveMediaUrl(src)}"`,
+  );
+
+  return (
+    <section className="section">
+      <div className="container-page max-w-4xl">
+        {item.date ? (
+          <p className="mb-4 text-sm text-[#999]">{formatDate(item.date)}</p>
+        ) : null}
+
+        {image ? (
+          <div className="mb-8 overflow-hidden bg-[#f3f3f3]">
+            <Image
+              src={image}
+              alt={item.title}
+              width={1200}
+              height={800}
+              unoptimized
+              priority
+              className="h-auto w-full object-contain"
+              sizes="(max-width: 896px) 100vw, 896px"
+            />
+          </div>
+        ) : null}
+
+        {contentHtml ? (
+          <div
+            className="article-body"
+            dangerouslySetInnerHTML={{ __html: contentHtml }}
+          />
+        ) : item.excerpt ? (
+          <p className="text-justify text-base leading-8 text-[#555]">
+            {item.excerpt}
+          </p>
+        ) : null}
+      </div>
+    </section>
+  );
+}

src/components/Articles.tsx

@@ -0,0 +1,65 @@
+import Image from "next/image";
+import { listBlogs } from "@/lib/meshkee";
+
+export async function Articles() {
+  const { items } = await listBlogs({ page: 1, pageSize: 6, type: "blog" });
+  const articles = items.slice(0, 6);
+
+  return (
+    <section id="articles" className="section section-gray">
+      <div className="container-page">
+        <div className="section-head">
+          <h2>آخرین مقالات</h2>
+          <p>Latest Articles</p>
+        </div>
+
+        <div className="grid gap-5 sm:grid-cols-2 xl:grid-cols-3">
+          {articles.map((article) => (
+            <article
+              key={article.id}
+              className="card-shadow overflow-hidden bg-white"
+            >
+              <a
+                href={`/articles/${article.slug}`}
+                className="block overflow-hidden bg-[#f3f3f3]"
+              >
+                {article.image ? (
+                  <Image
+                    src={article.image}
+                    alt={article.title}
+                    width={800}
+                    height={600}
+                    unoptimized
+                    className="h-auto w-full object-contain"
+                    sizes="(max-width: 768px) 100vw, 33vw"
+                  />
+                ) : null}
+              </a>
+              <div className="p-4">
+                <h3 className="mb-3 min-h-14 text-[15px] font-bold leading-7 text-[#232323]">
+                  <a href={`/articles/${article.slug}`}>{article.title}</a>
+                </h3>
+                <p className="mb-4 line-clamp-3 text-sm leading-7 text-[#777]">
+                  {article.excerpt}
+                </p>
+                <a
+                  href={`/articles/${article.slug}`}
+                  className="inline-flex items-center gap-1 text-sm font-bold text-[#232323]"
+                >
+                  بیشتر بخوانید
+                  <span aria-hidden>›</span>
+                </a>
+              </div>
+            </article>
+          ))}
+        </div>
+
+        <div className="mt-8 text-center">
+          <a href="/articles" className="btn-more">
+            مشاهده همه مقالات
+          </a>
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/ArticlesGrid.tsx

@@ -0,0 +1,82 @@
+import Image from "next/image";
+import type { BlogArticle } from "@/data/articles";
+import { resolveMediaUrl } from "@/lib/meshkee";
+
+function formatDate(date: string) {
+  if (!date) return "";
+  try {
+    return new Intl.DateTimeFormat("fa-IR", {
+      year: "numeric",
+      month: "long",
+      day: "numeric",
+    }).format(new Date(date));
+  } catch {
+    return date;
+  }
+}
+
+export function ArticlesGrid({ items }: { items: BlogArticle[] }) {
+  if (!items.length) {
+    return (
+      <p className="py-16 text-center text-[#777]">
+        در حال حاضر مقاله‌ای برای نمایش وجود ندارد.
+      </p>
+    );
+  }
+
+  return (
+    <div className="grid gap-7 sm:grid-cols-2 xl:grid-cols-3">
+      {items.map((item) => {
+        const image = resolveMediaUrl(item.image);
+        return (
+          <article
+            key={item.id}
+            className="article-card flex h-full flex-col overflow-hidden bg-white shadow-[0_0_10px_rgba(0,0,0,0.05)]"
+          >
+            <a
+              href={`/articles/${item.slug}`}
+              className="block overflow-hidden bg-[#f3f3f3]"
+            >
+              {image ? (
+                <Image
+                  src={image}
+                  alt={item.title}
+                  width={800}
+                  height={600}
+                  unoptimized
+                  className="h-auto w-full object-contain transition duration-500 hover:opacity-95"
+                  sizes="(max-width: 640px) 100vw, (max-width: 1280px) 50vw, 33vw"
+                />
+              ) : null}
+            </a>
+
+            <div className="flex flex-1 flex-col p-4">
+              {item.date ? (
+                <p className="mb-2 text-[13px] text-[#999]">
+                  {formatDate(item.date)}
+                </p>
+              ) : null}
+              <h2 className="mb-3 text-[15px] font-bold leading-7 text-[#232323]">
+                <a href={`/articles/${item.slug}`} className="hover:text-brand">
+                  {item.title}
+                </a>
+              </h2>
+              <p className="mb-4 line-clamp-3 flex-1 text-sm leading-7 text-[#777]">
+                {item.excerpt}
+              </p>
+              <div className="mt-auto border-t border-[#eee] pt-3">
+                <a
+                  href={`/articles/${item.slug}`}
+                  className="inline-flex items-center gap-1 text-[13px] font-medium text-[#232323] hover:text-brand"
+                >
+                  بیشتر بخوانید
+                  <span aria-hidden>›</span>
+                </a>
+              </div>
+            </div>
+          </article>
+        );
+      })}
+    </div>
+  );
+}

src/components/Clients.tsx

@@ -0,0 +1,34 @@
+import Image from "next/image";
+import { clients } from "@/data/home";
+
+export function Clients() {
+  return (
+    <section className="section section-gray">
+      <div className="container-page">
+        <div className="section-head">
+          <h2>رضایتمندی ها</h2>
+          <p>Satisfied</p>
+        </div>
+
+        <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+          {clients.map((client) => (
+            <figure key={client.name} className="card-shadow overflow-hidden bg-white">
+              <div className="relative aspect-[16/10]">
+                <Image
+                  src={client.image}
+                  alt={client.name}
+                  fill
+                  className="object-cover"
+                  sizes="(max-width: 768px) 100vw, 33vw"
+                />
+              </div>
+              <figcaption className="px-3 py-3 text-center text-sm font-bold text-[#333]">
+                {client.name}
+              </figcaption>
+            </figure>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/ContactUsView.tsx

@@ -0,0 +1,236 @@
+"use client";
+
+import { FormEvent, useState } from "react";
+import { Footer } from "@/components/Footer";
+import { Header } from "@/components/Header";
+import { PageHero } from "@/components/PageShared";
+import { contactPage } from "@/data/company";
+import { site } from "@/data/home";
+
+function IconShell({ children }: { children: React.ReactNode }) {
+  return (
+    <div className="mx-auto mb-5 flex h-20 w-20 items-center justify-center rounded-full bg-white shadow-[0_0_0_1px_rgba(0,39,118,0.08)]">
+      {children}
+    </div>
+  );
+}
+
+function LocationIcon() {
+  return (
+    <svg width="40" height="40" viewBox="0 0 48 48" fill="none" aria-hidden>
+      <path
+        d="M24 44s14-10.4 14-22a14 14 0 1 0-28 0c0 11.6 14 22 14 22Z"
+        stroke="#002776"
+        strokeWidth="2.2"
+        strokeLinejoin="round"
+      />
+      <circle cx="24" cy="22" r="5.5" stroke="#009543" strokeWidth="2.2" />
+      <path
+        d="M24 8.5c-7.5 0-13.5 6-13.5 13.5 0 1.4.2 2.7.6 4"
+        stroke="#009543"
+        strokeWidth="2.2"
+        strokeLinecap="round"
+        opacity="0.35"
+      />
+    </svg>
+  );
+}
+
+function MailIcon() {
+  return (
+    <svg width="40" height="40" viewBox="0 0 48 48" fill="none" aria-hidden>
+      <rect
+        x="6"
+        y="12"
+        width="36"
+        height="26"
+        rx="4"
+        stroke="#002776"
+        strokeWidth="2.2"
+      />
+      <path
+        d="m8 15 14.2 11.2a3 3 0 0 0 3.6 0L40 15"
+        stroke="#009543"
+        strokeWidth="2.2"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M8 35.5 18.5 26M40 35.5 29.5 26"
+        stroke="#002776"
+        strokeWidth="2.2"
+        strokeLinecap="round"
+        opacity="0.35"
+      />
+    </svg>
+  );
+}
+
+function PhoneIcon() {
+  return (
+    <svg width="40" height="40" viewBox="0 0 48 48" fill="none" aria-hidden>
+      <path
+        d="M16.5 8.5h7.2l3.2 8.4-4.2 2.6a22 22 0 0 0 9.8 9.8l2.6-4.2 8.4 3.2v7.2A3.5 3.5 0 0 1 40 39a28 28 0 0 1-28-28 3.5 3.5 0 0 1 4.5-3.5Z"
+        stroke="#002776"
+        strokeWidth="2.2"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M28.5 11.5c3.8.6 6.9 3.2 8.2 6.8M31.8 8c5.4 1 9.8 4.8 11.5 10"
+        stroke="#009543"
+        strokeWidth="2.2"
+        strokeLinecap="round"
+        opacity="0.85"
+      />
+    </svg>
+  );
+}
+
+export function ContactUsView() {
+  const [sent, setSent] = useState(false);
+
+  function onSubmit(e: FormEvent<HTMLFormElement>) {
+    e.preventDefault();
+    setSent(true);
+  }
+
+  return (
+    <>
+      <Header />
+      <main>
+        <PageHero
+          title={contactPage.title}
+          titleEn={contactPage.titleEn}
+          breadcrumb={[
+            { label: "صفحه اصلی", href: "/" },
+            { label: "تماس با ما", href: "/contact" },
+          ]}
+        />
+
+        <section className="section">
+          <div className="container-page grid gap-6 md:grid-cols-3">
+            <div className="bg-[#f7f7f7] px-6 py-8 text-center">
+              <IconShell>
+                <LocationIcon />
+              </IconShell>
+              <h3 className="mb-3 text-base font-bold text-[#232323]">
+                {contactPage.visitTitle}
+              </h3>
+              <p className="text-sm leading-7 text-[#666]">{contactPage.office}</p>
+              <p className="mt-2 text-sm leading-7 text-[#666]">
+                {contactPage.factory}
+              </p>
+              <p className="text-sm leading-7 text-[#666]">
+                {contactPage.factoryAddress}
+              </p>
+            </div>
+
+            <div className="bg-[#f7f7f7] px-6 py-8 text-center">
+              <IconShell>
+                <MailIcon />
+              </IconShell>
+              <h3 className="mb-3 text-base font-bold text-[#232323]">
+                {contactPage.emailTitle}
+              </h3>
+              <a
+                href={`mailto:${contactPage.email}`}
+                className="text-sm text-[#666] hover:text-brand-navy"
+              >
+                {contactPage.email}
+              </a>
+            </div>
+
+            <div className="bg-[#f7f7f7] px-6 py-8 text-center">
+              <IconShell>
+                <PhoneIcon />
+              </IconShell>
+              <h3 className="mb-3 text-base font-bold text-[#232323]">
+                اطلاعات تماس با ما
+              </h3>
+              <div className="space-y-1 text-sm text-[#666]">
+                {contactPage.phones.map((phone) => (
+                  <p key={phone}>
+                    <a
+                      href={`tel:${phone.replace(/\D/g, "")}`}
+                      className="hover:text-brand-navy"
+                    >
+                      {phone}
+                    </a>
+                  </p>
+                ))}
+              </div>
+            </div>
+          </div>
+        </section>
+
+        <section className="section section-gray">
+          <div className="container-page grid items-start gap-8 lg:grid-cols-2">
+            <div>
+              <h2 className="mb-1 text-xl font-bold text-[#232323]">
+                {contactPage.formTitle}
+              </h2>
+              <p className="mb-6 text-sm tracking-wide text-[#999]">
+                {contactPage.formTitleEn}
+              </p>
+
+              <form className="space-y-3" onSubmit={onSubmit}>
+                <input
+                  name="name"
+                  type="text"
+                  required
+                  placeholder="نام"
+                  className="w-full border border-[#ddd] bg-white px-4 py-3 text-sm outline-none focus:border-brand-navy"
+                />
+                <input
+                  name="email"
+                  type="email"
+                  required
+                  placeholder="ایمیل"
+                  className="w-full border border-[#ddd] bg-white px-4 py-3 text-sm outline-none focus:border-brand-navy"
+                />
+                <input
+                  name="subject"
+                  type="text"
+                  required
+                  placeholder="موضوع"
+                  className="w-full border border-[#ddd] bg-white px-4 py-3 text-sm outline-none focus:border-brand-navy"
+                />
+                <textarea
+                  name="text"
+                  required
+                  rows={6}
+                  placeholder="متن پیام"
+                  className="w-full resize-y border border-[#ddd] bg-white px-4 py-3 text-sm outline-none focus:border-brand-navy"
+                />
+                <button type="submit" className="btn-more">
+                  {contactPage.submitLabel}
+                </button>
+                {sent ? (
+                  <p className="text-sm text-accent-green">
+                    پیام شما ثبت شد. به زودی با شما تماس می‌گیریم.
+                  </p>
+                ) : null}
+              </form>
+            </div>
+
+            <div className="overflow-hidden border border-[#eee] bg-white">
+              <iframe
+                title={`نقشه ${site.name}`}
+                src={contactPage.mapEmbedUrl}
+                className="h-[420px] w-full border-0"
+                loading="lazy"
+                referrerPolicy="no-referrer-when-downgrade"
+              />
+              <div className="space-y-1 p-4 text-sm leading-7 text-[#666]">
+                <p>{contactPage.office}</p>
+                <p>{contactPage.factory}</p>
+                <p>{contactPage.factoryAddress}</p>
+              </div>
+            </div>
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}

src/components/DocumentsGallery.tsx

@@ -0,0 +1,83 @@
+"use client";
+
+import Image from "next/image";
+import { useEffect, useState } from "react";
+import type { DocumentItem } from "@/data/documents";
+
+export function DocumentsGallery({ items }: { items: DocumentItem[] }) {
+  const [active, setActive] = useState<DocumentItem | null>(null);
+
+  useEffect(() => {
+    if (!active) return;
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key === "Escape") setActive(null);
+    };
+    document.body.style.overflow = "hidden";
+    window.addEventListener("keydown", onKey);
+    return () => {
+      document.body.style.overflow = "";
+      window.removeEventListener("keydown", onKey);
+    };
+  }, [active]);
+
+  return (
+    <>
+      <div className="grid gap-6 sm:grid-cols-2">
+        {items.map((item) => (
+          <button
+            key={item.id}
+            type="button"
+            onClick={() => setActive(item)}
+            className="group overflow-hidden bg-white text-center shadow-[0_0_10px_rgba(0,0,0,0.05)] transition hover:shadow-[0_8px_24px_rgba(0,0,0,0.08)]"
+          >
+            <div className="relative aspect-[3/4] w-full bg-[#fafafa]">
+              <Image
+                src={item.image}
+                alt={item.title}
+                fill
+                className="object-contain p-3 transition duration-300 group-hover:scale-[1.02]"
+                sizes="(max-width: 640px) 100vw, 50vw"
+              />
+            </div>
+            <p className="border-t border-[#eee] px-3 py-3 text-sm font-medium text-[#333]">
+              {item.title}
+            </p>
+          </button>
+        ))}
+      </div>
+
+      {active ? (
+        <div
+          className="fixed inset-0 z-[100] flex items-center justify-center bg-black/70 p-4"
+          role="dialog"
+          aria-modal="true"
+          aria-label={active.title}
+          onClick={() => setActive(null)}
+        >
+          <button
+            type="button"
+            className="absolute top-4 left-4 rounded bg-white/90 px-3 py-1.5 text-sm text-[#232323]"
+            onClick={() => setActive(null)}
+          >
+            بستن
+          </button>
+          <div
+            className="relative max-h-[90vh] w-full max-w-3xl"
+            onClick={(e) => e.stopPropagation()}
+          >
+            <Image
+              src={active.image}
+              alt={active.title}
+              width={900}
+              height={1200}
+              className="mx-auto h-auto max-h-[90vh] w-auto object-contain"
+              sizes="90vw"
+              priority
+            />
+            <p className="mt-3 text-center text-sm text-white">{active.title}</p>
+          </div>
+        </div>
+      ) : null}
+    </>
+  );
+}

src/components/Footer.tsx

@@ -0,0 +1,96 @@
+"use client";
+
+import Image from "next/image";
+import { footerLinks, site } from "@/data/home";
+
+export function Footer() {
+  return (
+    <footer id="contact" className="bg-[#f7f7f7] text-[#333]">
+      <div className="container-page grid gap-8 py-12 md:grid-cols-2 lg:grid-cols-4">
+        <div>
+          <Image
+            src="/images/brand/footer-logo.png"
+            alt={site.name}
+            width={140}
+            height={48}
+            className="mb-4 h-12 w-auto object-contain"
+          />
+          <h3 className="mb-3 text-base font-bold">{site.name}</h3>
+          <div className="space-y-1 text-sm leading-7 text-[#666]">
+            <p>{site.office}</p>
+            <p>{site.factory}</p>
+            <p>{site.factoryAddress}</p>
+            {site.phones.map((phone) => (
+              <p key={phone}>{phone}</p>
+            ))}
+          </div>
+        </div>
+
+        <div>
+          <h4 className="mb-4 text-sm font-bold">محصولات</h4>
+          <ul className="space-y-2 text-sm text-[#666]">
+            {footerLinks.products.map((item) => (
+              <li key={item.label}>
+                <a href={item.href} className="hover:text-brand">
+                  {item.label}
+                </a>
+              </li>
+            ))}
+          </ul>
+        </div>
+
+        <div>
+          <h4 className="mb-4 text-sm font-bold">راهکارها</h4>
+          <ul className="space-y-2 text-sm text-[#666]">
+            {footerLinks.solutions.map((item) => (
+              <li key={item.label}>
+                <a href={item.href} className="hover:text-brand">
+                  {item.label}
+                </a>
+              </li>
+            ))}
+          </ul>
+        </div>
+
+        <div>
+          <h4 className="mb-4 text-sm font-bold">همراه ما باشید</h4>
+          <ul className="mb-5 space-y-2 text-sm text-[#666]">
+            {footerLinks.pages.map((item) => (
+              <li key={item.label}>
+                <a href={item.href} className="hover:text-brand">
+                  {item.label}
+                </a>
+              </li>
+            ))}
+          </ul>
+          <form
+            className="space-y-2"
+            onSubmit={(e) => {
+              e.preventDefault();
+            }}
+          >
+            <input
+              type="text"
+              placeholder="نام خانوادگی"
+              className="w-full border border-[#ddd] bg-white px-3 py-2 text-sm outline-none"
+            />
+            <input
+              type="tel"
+              placeholder="شماره همراه"
+              className="w-full border border-[#ddd] bg-white px-3 py-2 text-sm outline-none"
+            />
+            <button type="submit" className="btn-more w-full">
+              عضویت
+            </button>
+          </form>
+        </div>
+      </div>
+
+      <div className="border-t border-[#e5e5e5] bg-white">
+        <div className="container-page py-4 text-center text-xs text-[#999]">
+          © {new Date().getFullYear()} {site.name}
+        </div>
+      </div>
+    </footer>
+  );
+}

src/components/Header.tsx

@@ -0,0 +1,156 @@
+"use client";
+
+import Image from "next/image";
+import { useEffect, useState } from "react";
+import { navItems, site } from "@/data/home";
+
+export function Header() {
+  const [open, setOpen] = useState(false);
+  const [active, setActive] = useState<string | null>(null);
+
+  useEffect(() => {
+    document.body.style.overflow = open ? "hidden" : "";
+    return () => {
+      document.body.style.overflow = "";
+    };
+  }, [open]);
+
+  return (
+    <header className="wb-header sticky top-0 z-50 border-b border-[#eee] bg-white">
+      <div className="container-page flex items-center justify-between gap-4 py-3 lg:py-4">
+        <a href="/" className="shrink-0">
+          <Image
+            src="/images/brand/logo.png"
+            alt={site.name}
+            width={110}
+            height={36}
+            className="h-9 w-auto object-contain"
+            priority
+          />
+        </a>
+
+        <nav className="hidden items-center lg:flex">
+          {navItems.map((item) => (
+            <div
+              key={item.label}
+              className="relative"
+              onMouseEnter={() => setActive(item.label)}
+              onMouseLeave={() => setActive(null)}
+            >
+              <a href={item.href} className="nav-link-item">
+                {item.label}
+                {item.children ? (
+                  <svg width="10" height="10" viewBox="0 0 10 10" aria-hidden>
+                    <path
+                      d="M2 3.5 5 6.5 8 3.5"
+                      fill="none"
+                      stroke="currentColor"
+                      strokeWidth="1.4"
+                    />
+                  </svg>
+                ) : null}
+              </a>
+              {item.children && active === item.label ? (
+                <div className="dropdown-panel">
+                  {item.children.map((child) => (
+                    <a key={child.label} href={child.href}>
+                      {child.label}
+                    </a>
+                  ))}
+                </div>
+              ) : null}
+            </div>
+          ))}
+        </nav>
+
+        <div className="hidden items-center gap-3 lg:flex">
+          <button
+            type="button"
+            aria-label="جستجو"
+            className="flex h-9 w-9 items-center justify-center text-[#555]"
+          >
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none">
+              <circle cx="11" cy="11" r="7" stroke="currentColor" strokeWidth="1.8" />
+              <path d="m20 20-3.5-3.5" stroke="currentColor" strokeWidth="1.8" />
+            </svg>
+          </button>
+          <a
+            href="#"
+            aria-label="اینستاگرام"
+            className="flex h-9 w-9 items-center justify-center text-[#555]"
+          >
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none">
+              <rect
+                x="3"
+                y="3"
+                width="18"
+                height="18"
+                rx="5"
+                stroke="currentColor"
+                strokeWidth="1.8"
+              />
+              <circle cx="12" cy="12" r="4" stroke="currentColor" strokeWidth="1.8" />
+              <circle cx="17.5" cy="6.5" r="1" fill="currentColor" />
+            </svg>
+          </a>
+          <a
+            href="#"
+            className="inline-flex items-center gap-2 rounded border border-[#ddd] px-3 py-1.5 text-sm text-[#333]"
+          >
+            <svg width="16" height="16" viewBox="0 0 24 24" fill="none">
+              <path
+                d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4M10 17l5-5-5-5M15 12H3"
+                stroke="currentColor"
+                strokeWidth="1.8"
+                strokeLinecap="round"
+                strokeLinejoin="round"
+              />
+            </svg>
+            ورود
+          </a>
+        </div>
+
+        <button
+          type="button"
+          className="inline-flex h-10 w-10 items-center justify-center border border-[#ddd] lg:hidden"
+          aria-label="منو"
+          onClick={() => setOpen((v) => !v)}
+        >
+          <span className="flex w-5 flex-col gap-1.5">
+            <span className="h-0.5 w-full bg-[#333]" />
+            <span className="h-0.5 w-full bg-[#333]" />
+            <span className="h-0.5 w-full bg-[#333]" />
+          </span>
+        </button>
+      </div>
+
+      {open ? (
+        <div className="border-t border-[#eee] bg-white lg:hidden">
+          <div className="container-page max-h-[70vh] overflow-y-auto py-3">
+            {navItems.map((item) => (
+              <div key={item.label} className="border-b border-[#f2f2f2] py-2">
+                <a
+                  href={item.href}
+                  className="block py-1 text-[15px] font-bold"
+                  onClick={() => setOpen(false)}
+                >
+                  {item.label}
+                </a>
+                {item.children?.map((child) => (
+                  <a
+                    key={child.label}
+                    href={child.href}
+                    className="block py-1 pr-3 text-sm text-[#666]"
+                    onClick={() => setOpen(false)}
+                  >
+                    {child.label}
+                  </a>
+                ))}
+              </div>
+            ))}
+          </div>
+        </div>
+      ) : null}
+    </header>
+  );
+}

src/components/Hero.tsx

@@ -0,0 +1,83 @@
+"use client";
+
+import Image from "next/image";
+import { useEffect, useState } from "react";
+import { heroSideBanners, heroSlides } from "@/data/home";
+
+export function Hero() {
+  const [index, setIndex] = useState(0);
+
+  useEffect(() => {
+    const id = window.setInterval(() => {
+      setIndex((i) => (i + 1) % heroSlides.length);
+    }, 4500);
+    return () => window.clearInterval(id);
+  }, []);
+
+  return (
+    <section className="section !pb-[30px] !pt-5">
+      <div className="container-page">
+        <div className="grid items-stretch gap-3 md:grid-cols-12 md:gap-4">
+          {/* In RTL: order-1 sits on the right (main slider), order-2 on the left (side banners) */}
+          <div className="order-1 h-full md:col-span-8">
+            <div className="round-box card-shadow relative aspect-[800/474] h-full min-h-[280px] overflow-hidden bg-[#f3f3f3] md:aspect-auto">
+              {heroSlides.map((slide, i) => (
+                <a
+                  key={`${slide.title}-${i}`}
+                  href="#"
+                  title={slide.title}
+                  className={`absolute inset-0 transition-opacity duration-500 ${
+                    i === index ? "opacity-100" : "opacity-0"
+                  }`}
+                >
+                  <Image
+                    src={slide.image}
+                    alt={slide.title}
+                    fill
+                    className="object-cover"
+                    sizes="(max-width: 768px) 100vw, 66vw"
+                    priority={i === 0}
+                  />
+                </a>
+              ))}
+
+              <div className="absolute bottom-4 left-1/2 z-10 flex -translate-x-1/2 gap-2">
+                {heroSlides.map((slide, i) => (
+                  <button
+                    key={`${slide.image}-${i}`}
+                    type="button"
+                    aria-label={`Go to slide ${i + 1}`}
+                    onClick={() => setIndex(i)}
+                    className={`h-2.5 w-2.5 rounded-sm border border-white/80 ${
+                      i === index ? "bg-white" : "bg-white/40"
+                    }`}
+                  />
+                ))}
+              </div>
+            </div>
+          </div>
+
+          <div className="order-2 flex flex-col gap-3 md:col-span-4">
+            {heroSideBanners.map((banner) => (
+              <a
+                key={banner.title}
+                href={banner.href}
+                className="round-box card-shadow relative block aspect-[361/230] overflow-hidden bg-[#f3f3f3]"
+                title={banner.title}
+              >
+                <Image
+                  src={banner.image}
+                  alt={banner.title}
+                  fill
+                  className="object-cover"
+                  sizes="(max-width: 768px) 100vw, 33vw"
+                  priority
+                />
+              </a>
+            ))}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/LatinDigits.tsx

@@ -0,0 +1,83 @@
+"use client";
+
+import { useEffect } from "react";
+
+/** Tokens that mix Latin letters with digits, e.g. F300, IP55, 24VDC */
+const MIXED_TOKEN =
+  /[A-Za-z][A-Za-z0-9.+/-]*\d[A-Za-z0-9.+/-]*|\d+[A-Za-z][A-Za-z0-9.+/-]*/g;
+
+function wrapLatinDigitTokens(root: ParentNode) {
+  const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT, {
+    acceptNode(node) {
+      const parent = node.parentElement;
+      if (!parent) return NodeFilter.FILTER_REJECT;
+      if (
+        parent.closest(
+          "script, style, noscript, textarea, code, pre, .latin-digits, [data-no-latin-digits]",
+        )
+      ) {
+        return NodeFilter.FILTER_REJECT;
+      }
+      return NodeFilter.FILTER_ACCEPT;
+    },
+  });
+
+  const textNodes: Text[] = [];
+  while (walker.nextNode()) {
+    textNodes.push(walker.currentNode as Text);
+  }
+
+  for (const textNode of textNodes) {
+    const value = textNode.nodeValue;
+    if (!value || !MIXED_TOKEN.test(value)) continue;
+    MIXED_TOKEN.lastIndex = 0;
+
+    const frag = document.createDocumentFragment();
+    let lastIndex = 0;
+
+    for (const match of value.matchAll(MIXED_TOKEN)) {
+      const start = match.index ?? 0;
+      if (start > lastIndex) {
+        frag.appendChild(document.createTextNode(value.slice(lastIndex, start)));
+      }
+
+      const span = document.createElement("span");
+      span.className = "latin-digits";
+      span.dir = "ltr";
+      span.textContent = match[0];
+      frag.appendChild(span);
+
+      lastIndex = start + match[0].length;
+    }
+
+    if (lastIndex < value.length) {
+      frag.appendChild(document.createTextNode(value.slice(lastIndex)));
+    }
+
+    textNode.parentNode?.replaceChild(frag, textNode);
+  }
+}
+
+/** Keeps Western digits next to English letters site-wide (Iran Yekan FaNum fix). */
+export function LatinDigitsEnhancer() {
+  useEffect(() => {
+    wrapLatinDigitTokens(document.body);
+
+    const observer = new MutationObserver((mutations) => {
+      for (const mutation of mutations) {
+        for (const node of mutation.addedNodes) {
+          if (node.nodeType === Node.ELEMENT_NODE) {
+            wrapLatinDigitTokens(node as Element);
+          } else if (node.nodeType === Node.TEXT_NODE && node.parentElement) {
+            wrapLatinDigitTokens(node.parentElement);
+          }
+        }
+      }
+    });
+
+    observer.observe(document.body, { childList: true, subtree: true });
+    return () => observer.disconnect();
+  }, []);
+
+  return null;
+}

src/components/PageShared.tsx

@@ -0,0 +1,167 @@
+import Image from "next/image";
+
+type PageHeroProps = {
+  title: string;
+  titleEn?: string;
+  breadcrumb?: { label: string; href: string }[];
+};
+
+export function PageHero({ title, titleEn, breadcrumb }: PageHeroProps) {
+  return (
+    <section className="border-b border-[#eee] bg-[#f7f7f7]">
+      <div className="container-page py-10 text-center sm:py-12">
+        {breadcrumb ? (
+          <nav className="mb-4 flex flex-wrap items-center justify-center gap-2 text-xs text-[#888]">
+            {breadcrumb.map((item, i) => (
+              <span key={item.href} className="inline-flex items-center gap-2">
+                {i > 0 ? <span>/</span> : null}
+                <a href={item.href} className="hover:text-brand">
+                  {item.label}
+                </a>
+              </span>
+            ))}
+          </nav>
+        ) : null}
+        <h1 className="mb-2 text-2xl font-bold text-[#232323] sm:text-[32px]">
+          {title}
+        </h1>
+        {titleEn ? (
+          <p className="text-sm tracking-[2px] text-[#9a9a9a] uppercase">
+            {titleEn}
+          </p>
+        ) : null}
+      </div>
+    </section>
+  );
+}
+
+type CatalogCardProps = {
+  href: string;
+  image: string;
+  title: string;
+  titleEn: string;
+  description: string;
+};
+
+export function CatalogCard({
+  href,
+  image,
+  title,
+  titleEn,
+  description,
+}: CatalogCardProps) {
+  return (
+    <article className="card-shadow flex h-full flex-col bg-white p-5 text-center">
+      <a href={href} className="mb-4 flex h-[120px] items-center justify-center">
+        <Image
+          src={image}
+          alt={title}
+          width={160}
+          height={120}
+          unoptimized
+          className="max-h-[120px] w-auto object-contain"
+          style={{ width: "auto", height: 120 }}
+        />
+      </a>
+      <h2 className="mb-1 text-[16px] font-bold text-[#232323]">
+        <a href={href}>{title}</a>
+      </h2>
+      <p className="mb-3 text-xs font-semibold tracking-wide text-[#999]">
+        {titleEn}
+      </p>
+      <p className="mb-5 line-clamp-3 flex-1 text-sm leading-7 text-[#666]">
+        {description}
+      </p>
+      <a href={href} className="btn-more mx-auto">
+        بیشتر بدانید
+      </a>
+    </article>
+  );
+}
+
+type ContentSectionProps = {
+  title: string;
+  titleEn?: string;
+  image?: string;
+  imageAlt?: string;
+  children: React.ReactNode;
+  reverse?: boolean;
+};
+
+export function ContentSection({
+  title,
+  titleEn,
+  image,
+  imageAlt,
+  children,
+  reverse,
+}: ContentSectionProps) {
+  return (
+    <section className="section">
+      <div
+        className={`container-page grid items-center gap-8 md:grid-cols-2 ${
+          reverse ? "md:[&>*:first-child]:order-2" : ""
+        }`}
+      >
+        {image ? (
+          <div
+            className={`relative aspect-[4/3] overflow-hidden ${
+              image.endsWith(".png") ? "" : "bg-[#f7f7f7]"
+            }`}
+          >
+            <Image
+              src={image}
+              alt={imageAlt || title}
+              fill
+              className="object-contain p-4"
+              sizes="(max-width: 768px) 100vw, 50vw"
+            />
+          </div>
+        ) : null}
+        <div className={image ? "" : "md:col-span-2"}>
+          <h2 className="mb-2 text-xl font-bold text-[#232323] sm:text-2xl">
+            {title}
+          </h2>
+          {titleEn ? (
+            <p className="mb-4 text-sm tracking-wide text-[#999]">{titleEn}</p>
+          ) : null}
+          <div className="space-y-3 text-sm leading-8 text-[#666]">{children}</div>
+        </div>
+      </div>
+    </section>
+  );
+}
+
+export function SpecList({ items }: { items: string[] }) {
+  return (
+    <div className="mt-4">
+      <h3 className="mb-3 text-base font-bold text-[#232323]">مشخصات فنـــــی</h3>
+      <ul className="space-y-2">
+        {items.map((item) => (
+          <li
+            key={item}
+            className="flex gap-2 border-b border-[#f0f0f0] py-2 text-sm leading-7 text-[#555]"
+          >
+            <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-accent-green" />
+            <span>{item}</span>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}
+
+export function UpdatingNotice() {
+  return (
+    <div className="container-page py-20 text-center">
+      <Image
+        src="/images/pages/shared/updating.png"
+        alt="در حال بروز رسانی"
+        width={120}
+        height={120}
+        className="mx-auto mb-6 opacity-70"
+      />
+      <p className="text-lg font-bold text-[#666]">در حال بروز رسانی ...</p>
+    </div>
+  );
+}

src/components/Pagination.tsx

@@ -0,0 +1,81 @@
+type PaginationProps = {
+  basePath: string;
+  page: number;
+  pageSize: number;
+  total: number;
+};
+
+function buildHref(basePath: string, page: number) {
+  if (page <= 1) return basePath;
+  return `${basePath}?page=${page}`;
+}
+
+function pageItems(current: number, totalPages: number): (number | "…")[] {
+  if (totalPages <= 7) {
+    return Array.from({ length: totalPages }, (_, i) => i + 1);
+  }
+
+  const items: (number | "…")[] = [1];
+  const start = Math.max(2, current - 1);
+  const end = Math.min(totalPages - 1, current + 1);
+
+  if (start > 2) items.push("…");
+  for (let p = start; p <= end; p += 1) items.push(p);
+  if (end < totalPages - 1) items.push("…");
+  items.push(totalPages);
+  return items;
+}
+
+export function Pagination({ basePath, page, pageSize, total }: PaginationProps) {
+  const totalPages = Math.max(1, Math.ceil(total / pageSize));
+  if (totalPages <= 1) return null;
+
+  const current = Math.min(Math.max(1, page), totalPages);
+  const pages = pageItems(current, totalPages);
+
+  return (
+    <nav className="pagination-nav" aria-label="صفحه‌بندی">
+      <ul className="pagination-list">
+        <li>
+          {current > 1 ? (
+            <a href={buildHref(basePath, current - 1)} className="pagination-link">
+              قبلی
+            </a>
+          ) : (
+            <span className="pagination-link is-disabled">قبلی</span>
+          )}
+        </li>
+
+        {pages.map((item, index) =>
+          item === "…" ? (
+            <li key={`ellipsis-${index}`}>
+              <span className="pagination-ellipsis">…</span>
+            </li>
+          ) : (
+            <li key={item}>
+              {item === current ? (
+                <span className="pagination-link is-active" aria-current="page">
+                  {item}
+                </span>
+              ) : (
+                <a href={buildHref(basePath, item)} className="pagination-link">
+                  {item}
+                </a>
+              )}
+            </li>
+          ),
+        )}
+
+        <li>
+          {current < totalPages ? (
+            <a href={buildHref(basePath, current + 1)} className="pagination-link">
+              بعدی
+            </a>
+          ) : (
+            <span className="pagination-link is-disabled">بعدی</span>
+          )}
+        </li>
+      </ul>
+    </nav>
+  );
+}

src/components/Partners.tsx

@@ -0,0 +1,36 @@
+import Image from "next/image";
+import { partners } from "@/data/home";
+
+export function Partners() {
+  return (
+    <section className="section !py-[30px]">
+      <div className="container-page">
+        <div className="mx-auto grid max-w-4xl grid-cols-1 gap-8 sm:grid-cols-3 sm:gap-6">
+          {partners.map((partner) => (
+            <a
+              key={partner.name}
+              href={partner.href}
+              className="flex flex-col items-center text-center"
+              title={partner.name}
+            >
+              <div className="mb-3 flex items-center justify-center">
+                <Image
+                  src={partner.image}
+                  alt={partner.country}
+                  width={150}
+                  height={80}
+                  unoptimized
+                  className="object-contain"
+                  style={{ width: 150, height: 80 }}
+                />
+              </div>
+              <span className="text-[15px] font-medium text-[#333]">
+                {partner.country}
+              </span>
+            </a>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/PortfolioDetail.tsx

@@ -0,0 +1,121 @@
+"use client";
+
+import Image from "next/image";
+import { useEffect, useState } from "react";
+import type { PortfolioItem } from "@/data/portfolios";
+import { resolveMediaUrl } from "@/lib/meshkee";
+
+export function PortfolioDetailView({ item }: { item: PortfolioItem }) {
+  const cover = resolveMediaUrl(item.coverImage || item.image);
+  const gallery = (item.gallery.length ? item.gallery : cover ? [cover] : [])
+    .map(resolveMediaUrl)
+    .filter(Boolean);
+  const [active, setActive] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!active) return;
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key === "Escape") setActive(null);
+    };
+    document.body.style.overflow = "hidden";
+    window.addEventListener("keydown", onKey);
+    return () => {
+      document.body.style.overflow = "";
+      window.removeEventListener("keydown", onKey);
+    };
+  }, [active]);
+
+  return (
+    <>
+      <section className="section">
+        <div className="container-page">
+          <div className="grid items-start gap-8 lg:grid-cols-[minmax(0,1fr)_240px]">
+            <div>
+              {cover ? (
+                <div className="relative mb-6 aspect-[16/10] overflow-hidden border border-[#e5e5e5] bg-[#fafafa] p-1">
+                  <div className="relative h-full w-full overflow-hidden">
+                    <Image
+                      src={cover}
+                      alt={item.title}
+                      fill
+                      unoptimized
+                      priority
+                      className="object-contain"
+                      sizes="(max-width: 1024px) 100vw, 70vw"
+                    />
+                  </div>
+                </div>
+              ) : null}
+              {item.description ? (
+                <p className="text-justify text-base leading-8 text-[#666]">
+                  {item.description}
+                </p>
+              ) : null}
+              {item.titleEn ? (
+                <p className="mt-4 text-sm tracking-wide text-[#999]">
+                  {item.titleEn}
+                </p>
+              ) : null}
+            </div>
+
+            {gallery.length ? (
+              <ul className="grid grid-cols-2 gap-3 lg:grid-cols-1">
+                {gallery.map((src) => (
+                  <li key={src}>
+                    <button
+                      type="button"
+                      onClick={() => setActive(src)}
+                      className="relative aspect-square w-full overflow-hidden border border-[#eee] bg-[#f7f7f7] transition hover:opacity-90"
+                    >
+                      <Image
+                        src={src}
+                        alt={item.title}
+                        fill
+                        unoptimized
+                        className="object-cover"
+                        sizes="200px"
+                      />
+                    </button>
+                  </li>
+                ))}
+              </ul>
+            ) : null}
+          </div>
+        </div>
+      </section>
+
+      {active ? (
+        <div
+          className="fixed inset-0 z-[100] flex items-center justify-center bg-black/75 p-4"
+          role="dialog"
+          aria-modal="true"
+          aria-label={item.title}
+          onClick={() => setActive(null)}
+        >
+          <button
+            type="button"
+            className="absolute top-4 left-4 rounded bg-white/90 px-3 py-1.5 text-sm text-[#232323]"
+            onClick={() => setActive(null)}
+          >
+            بستن
+          </button>
+          <div
+            className="relative max-h-[90vh] w-full max-w-5xl"
+            onClick={(e) => e.stopPropagation()}
+          >
+            <Image
+              src={active}
+              alt={item.title}
+              width={1400}
+              height={900}
+              unoptimized
+              className="mx-auto h-auto max-h-[90vh] w-auto object-contain"
+              sizes="90vw"
+              priority
+            />
+          </div>
+        </div>
+      ) : null}
+    </>
+  );
+}

src/components/PortfolioGrid.tsx

@@ -0,0 +1,46 @@
+import Image from "next/image";
+import type { PortfolioItem } from "@/data/portfolios";
+import { resolveMediaUrl } from "@/lib/meshkee";
+
+export function PortfolioGrid({ items }: { items: PortfolioItem[] }) {
+  if (!items.length) {
+    return (
+      <p className="py-16 text-center text-[#777]">
+        در حال حاضر پروژه‌ای برای نمایش وجود ندارد.
+      </p>
+    );
+  }
+
+  return (
+    <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+      {items.map((item) => {
+        const image = resolveMediaUrl(item.image);
+        return (
+          <a
+            key={item.id}
+            href={`/portfolios/${item.slug}`}
+            className="portfolio-card group"
+          >
+            <div className="relative aspect-[4/3] overflow-hidden bg-[#f0f0f0]">
+              {image ? (
+                <Image
+                  src={image}
+                  alt={item.title}
+                  fill
+                  unoptimized
+                  className="object-cover transition duration-500 group-hover:scale-[1.04]"
+                  sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw"
+                />
+              ) : null}
+              <div className="portfolio-card-overlay" />
+              <div className="portfolio-card-text">
+                <h2>{item.title}</h2>
+                {item.titleEn ? <p>{item.titleEn}</p> : null}
+              </div>
+            </div>
+          </a>
+        );
+      })}
+    </div>
+  );
+}

src/components/Products.tsx

@@ -0,0 +1,78 @@
+"use client";
+
+import Image from "next/image";
+import { useRef } from "react";
+import { productCategories } from "@/data/home";
+
+export function Products() {
+  const scroller = useRef<HTMLDivElement>(null);
+
+  const scrollBy = (dir: number) => {
+    scroller.current?.scrollBy({ left: dir * -280, behavior: "smooth" });
+  };
+
+  return (
+    <section id="products" className="section section-gray">
+      <div className="container-page">
+        <div className="section-head">
+          <h2>محصولات رسام تجارت هواران</h2>
+          <p>HAVARAN Products</p>
+        </div>
+
+        <div className="relative">
+          <button
+            type="button"
+            aria-label="قبلی"
+            onClick={() => scrollBy(-1)}
+            className="absolute top-1/2 right-0 z-10 hidden h-10 w-10 -translate-y-1/2 items-center justify-center rounded-full bg-white text-[#666] shadow md:flex"
+          >
+            ›
+          </button>
+          <button
+            type="button"
+            aria-label="بعدی"
+            onClick={() => scrollBy(1)}
+            className="absolute top-1/2 left-0 z-10 hidden h-10 w-10 -translate-y-1/2 items-center justify-center rounded-full bg-white text-[#666] shadow md:flex"
+          >
+            ‹
+          </button>
+
+          <div
+            ref={scroller}
+            className="flex gap-4 overflow-x-auto px-1 pb-2 scrollbar-none"
+            style={{ scrollbarWidth: "none" }}
+          >
+            {productCategories.map((item) => (
+              <article
+                key={item.title}
+                className="card-shadow min-w-[220px] flex-1 basis-[220px] bg-white p-5 text-center sm:min-w-[230px]"
+              >
+                <a
+                  href={item.href}
+                  title={item.linkTitle}
+                  className="mb-4 flex h-[100px] items-center justify-center"
+                >
+                  <Image
+                    src={item.image}
+                    alt={item.title}
+                    width={100}
+                    height={100}
+                    unoptimized
+                    className="h-[100px] w-[100px] object-contain"
+                    style={{ width: 100, height: 100 }}
+                  />
+                </a>
+                <h3 className="mb-5 min-h-12 text-[15px] font-bold leading-7 text-[#232323]">
+                  <a href={item.href}>{item.title}</a>
+                </h3>
+                <a href={item.href} className="btn-more">
+                  بیشتر بدانید
+                </a>
+              </article>
+            ))}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/Services.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import Image from "next/image";
+import { useState } from "react";
+import { services } from "@/data/home";
+
+export function Services() {
+  const [active, setActive] = useState(services[0].id);
+  const current = services.find((s) => s.id === active) ?? services[0];
+
+  return (
+    <section id="services" className="section">
+      <div className="container-page">
+        <div className="section-head">
+          <h2>خدمات رسام تجارت هواران</h2>
+          <p>Havaran Services</p>
+        </div>
+
+        <div className="grid gap-6 lg:grid-cols-12">
+          <div className="lg:col-span-3">
+            <div className="flex flex-row gap-2 overflow-x-auto lg:flex-col lg:overflow-visible">
+              {services.map((item) => {
+                const isActive = item.id === active;
+                return (
+                  <button
+                    key={item.id}
+                    type="button"
+                    onClick={() => setActive(item.id)}
+                    className={`whitespace-nowrap border px-4 py-3 text-right text-sm font-bold transition lg:w-full ${
+                      isActive
+                        ? "border-accent-green bg-accent-green text-white"
+                        : "border-[#e5e5e5] bg-white text-[#333] hover:border-accent-green"
+                    }`}
+                  >
+                    {item.title}
+                  </button>
+                );
+              })}
+            </div>
+          </div>
+
+          <div className="grid overflow-hidden border border-[#eee] bg-white lg:col-span-9 md:grid-cols-2">
+            <div className="relative min-h-[280px] bg-[#f7f7f7]">
+              <Image
+                key={current.image}
+                src={current.image}
+                alt={current.title}
+                fill
+                className="object-cover"
+                sizes="(max-width: 768px) 100vw, 40vw"
+              />
+            </div>
+            <div className="flex flex-col justify-center p-6 sm:p-8">
+              <p className="mb-2 text-sm font-bold text-accent-green">
+                {current.titleEn}
+              </p>
+              <h3 className="mb-3 text-xl font-bold text-[#232323]">
+                {current.title}
+              </h3>
+              <p className="mb-5 leading-8 text-[#666]">{current.description}</p>
+              <a href="/products" className="btn-more self-start">
+                مشاهده محصولات
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/Solutions.tsx

@@ -0,0 +1,35 @@
+import Image from "next/image";
+import { solutions } from "@/data/home";
+
+export function Solutions() {
+  return (
+    <section id="solutions" className="section section-gray">
+      <div className="container-page">
+        <div className="mx-auto flex max-w-5xl flex-wrap justify-center gap-x-10 gap-y-10">
+          {solutions.map((item) => (
+            <a
+              key={item.title}
+              href={item.href}
+              className="flex w-[160px] flex-col items-center text-center sm:w-[170px]"
+            >
+              <div className="mb-4 flex h-[70px] items-center justify-center overflow-visible">
+                <Image
+                  src={item.image}
+                  alt={item.title}
+                  width={70}
+                  height={70}
+                  className="object-contain"
+                  style={{ width: 70, height: 70, transform: "scale(1.5)" }}
+                />
+              </div>
+              <h3 className="mb-1 text-[15px] font-bold text-[#232323]">
+                {item.title}
+              </h3>
+              <p className="text-xs text-[#999]">{item.titleEn}</p>
+            </a>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}

src/components/SpecialProducts.tsx

@@ -0,0 +1,88 @@
+"use client";
+
+import Image from "next/image";
+import { useRef } from "react";
+import { specialProducts } from "@/data/home";
+
+export function SpecialProducts() {
+  const scroller = useRef<HTMLDivElement>(null);
+
+  const scrollBy = (dir: number) => {
+    scroller.current?.scrollBy({ left: dir * -280, behavior: "smooth" });
+  };
+
+  return (
+    <section className="section">
+      <div className="container-page">
+        <div className="section-head">
+          <h2>محصولات ویژه</h2>
+          <p>Special Products</p>
+        </div>
+
+        <div className="relative">
+          <button
+            type="button"
+            aria-label="قبلی"
+            onClick={() => scrollBy(-1)}
+            className="absolute top-1/2 right-0 z-10 hidden h-10 w-10 -translate-y-1/2 items-center justify-center rounded-full bg-white text-[#666] shadow md:flex"
+          >
+            ›
+          </button>
+          <button
+            type="button"
+            aria-label="بعدی"
+            onClick={() => scrollBy(1)}
+            className="absolute top-1/2 left-0 z-10 hidden h-10 w-10 -translate-y-1/2 items-center justify-center rounded-full bg-white text-[#666] shadow md:flex"
+          >
+            ‹
+          </button>
+
+          <div
+            ref={scroller}
+            className="flex items-stretch gap-4 overflow-x-auto px-1 pb-2"
+            style={{ scrollbarWidth: "none" }}
+          >
+            {specialProducts.map((item) => (
+              <article
+                key={item.code}
+                className="card-shadow flex min-w-[220px] flex-1 basis-[220px] flex-col overflow-hidden bg-white sm:min-w-[230px]"
+              >
+                <div className="relative aspect-[4/3] shrink-0 bg-[#fafafa]">
+                  <Image
+                    src={item.image}
+                    alt={item.title}
+                    fill
+                    className="object-contain p-3"
+                    sizes="230px"
+                  />
+                </div>
+                <div className="flex flex-1 flex-col p-4">
+                  <h3 className="mb-1 line-clamp-2 h-12 text-sm font-bold leading-6 text-[#232323]">
+                    {item.title}
+                  </h3>
+                  <p className="mb-3 text-xs text-[#999]">{item.code}</p>
+                  <p className="mb-4 text-sm font-bold text-[#232323]">
+                    {item.price} <span className="font-medium">تومان</span>
+                  </p>
+                  <button type="button" className="btn-cart mt-auto">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none">
+                      <path
+                        d="M6 6h15l-1.5 9h-12z"
+                        stroke="currentColor"
+                        strokeWidth="1.6"
+                      />
+                      <circle cx="9" cy="20" r="1.3" fill="currentColor" />
+                      <circle cx="18" cy="20" r="1.3" fill="currentColor" />
+                      <path d="M6 6 5 3H2" stroke="currentColor" strokeWidth="1.6" />
+                    </svg>
+                    افزودن به سبد خرید
+                  </button>
+                </div>
+              </article>
+            ))}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}

src/data/ahu.ts

@@ -0,0 +1,71 @@
+export type ProductAccordion = { title: string; items: string[] };
+
+export const ahuIntro = {
+  title: "هواساز چیست؟",
+  titleEn: "هواسـاز (Air Handling Unit)",
+  text: [
+    "هواسازها نوعی از اجزای سیستم های تهویه مطبوع هستند که برای وارد کردن هوای تازه و مطبوع به داخل اتاق استفاده میشوند. هواساز به نوعی شُشهای خانه یا محل کار شما است که میتواند کیفیت هوای مورد نیاز شما را به قدری که نیاز است تامین کند.",
+    "استفاده از این تجهیزات در سیستم های تهویه برای مکانهای مختلف صنعتی، اداری، انباری، مسکونی و مناطق دیگر که به تبادل هوا و تداوم تأمین آن نیاز است مرسوم است. با استفاده از این سیستم تجربه سکونت راحت افراد در هر مکانی میگردد و تأثیری مفید بر سلامتی آنها خواهد داشت. به علاوه بر اساس درخواست شما میتواند به شما این امکان را بدهد که میزان رطوبت را تنظیم کنید (برای تولید رطوبت یا رطوبت زدایی)، درجه حرارت هوا را کنترل کنید (سرمایش یا گرمایش) و هوا را تصفیه نمایید (فیلتر کردن از گرد و غبار، دود و سایر آلاینده‌ها).",
+    "هواسازها به دو دسته هواساز ساختمانی و صنعتی تقسیم‌بندی میشوند.",
+    "از هواساز ساختمانی میتوان در اماکن مختلف مسکونی، اداری، تجاری، آموزشی و... استفاده نمود.",
+    "دستگاه هواساز صنعتی (Air Handling Unit) مخصوص تهویه هوای سوله صنعتی، تهویه هوای انبار، سالنهای بزرگ تولیدی، ورزشی و غیره ساخته میشود.",
+    "به صورت کلی هواساز ها به دو دسته اصلی، تقسیم بندی میشوند: الف) هواساز استاندارد ب) هواساز هایژنیک",
+    "هواساز استاندارد: هواساز استاندارد، با سیستم تهویه مطبوع استاندارد، یک سیستم تهویه مطبوع است که طبق استانداردها و مقررات فنی مشخصی طراحی، نصب و عمل میکند. این سیستمها برای تهویه، خنک کردن و گرم کردن هوا در محیطهای مختلف مورد استفاده قرار میگیرند.",
+    "هواساز هایژنیک: هواساز هایژنیک تجهیزاتی هستند که با استفاده از تکنولوژی هایژنیک و بیوتکنولوژی طراحی شده‌اند تا هوای محیط را پاکسازی کرده و آلودگی ها و آلاینده های مختلف را حذف نمایند.",
+  ],
+  componentsTitle: "هواسازها به صورت عادی از اجزای اصلی زیر تشکیل میشوند:",
+  components: [
+    "فَن برای جا به جایی هوا از یونیت بداخل اتاق مورد نظر",
+    "کویل سرد و گرم برای تنظیم درجه حرارت هوا",
+    "فیلتر و عایق برای تصفیه، تنظیم رطوبت و بهبود کیفیت هوا",
+  ],
+  image: "/images/pages/ahu/main.png",
+  imageAlt: "هواساز",
+  specs: [
+    "طراحی فنی بهینه و استاندارد براساس نیاز دقیق مشتری درعین حال حفظ زیبایی و کم‌صدا بودن دستگاه",
+    "قابلیت پوشش طیف وسیعی از کاربریهای مختلف اداری، تجاری، مسکونی و صنعتی",
+    "ظرفیت سرمایش ۱۵ تا ۳۸۱ کیلو وات",
+    "ظرفیت گرمایش ۳۱ تا ۶۹۳ کیلو وات",
+    "ظرفیت هوا دِهی ۳۲۰۰ تا ۶۸۰۰۰۰ متر مکعب بر ساعت",
+    "قابلیت هوا دِهی در سه نوع بالا زَن، روبرو زَن و پایین زَن",
+    "استفاده از ورق گالوانیزه با کیفیت درجه یک و عایق‌کاری تمام دیواره‌های بیرونی",
+  ],
+  specsImage: "/images/pages/ahu/specs.png",
+};
+
+export const ahuAdvantages = {
+  title: "مزایای هواساز هواران",
+  image: "/images/pages/ahu/advantages.jpg",
+  imageAlt: "مزایای هواساز هواران",
+  items: [
+    "کویل های فین تیوب با استفاده از گُلدفین و بلوفین مقاوم در برابر خوردگی و آسیبهای احتمالی همچنین استفاده از لوله های مسی 8/5 و 8/3 اینچ",
+    "امکان تهیه فَن سانتریفیوژ Forward یا Backward دارای بالانس استاتیکی و دینامیکی با ظرفیت های مختلف، با دبی مختلف، ایرانی یا خارجی، ضد جرقه اتکس ATEX، دارای اینوِرتور جهت تنظیم دُور و هوا دِهی",
+    "امکان نصب دریچه بازدید شیشه‌ای به روی بدنه درصورت تمایل مشتری",
+    "قابلیت نصب فیلتر براساس نیاز مشتری و رطوبت‌زَنی humidifier و رطوبت‌گیری dehumidifier فیلتر هپا، فیلتر آلومینیومی و...",
+    "بهره گیری از پروفیلهای Thermal Break بمنظور کاهش تلفات انرژی درصورت درخواست",
+    "رنگ بدنه پودری الکترواستاتیک و کوره‌ای به ضخامت 70 میکرون",
+  ],
+};
+
+export const ahuFaq: ProductAccordion[] = [
+  {
+    title: "هوا ساز یا Air Handling Unit چیست؟",
+    items: [
+      "هوا ساز ها یک نوع از اجزای سیستمهای تهویه مطبوع هستند که برای وارد کردن هوای تازه و مطبوع به داخل اتاق استفاده میشوند. هواساز به نوعی شُشهای خانه یا محل کار شماست که میتواند کیفیت هوای مورد نیازتان را به اندازه‌ای که نیاز دارید تامین کند.",
+    ],
+  },
+  {
+    title: "انواع هواساز کدام است؟",
+    items: ["الف) هواساز استاندارد", "ب) هواساز هایژنیک"],
+  },
+  {
+    title: "مزایای هواساز چیست؟",
+    items: [
+      "بهبود کیفیت هوا",
+      "سلامتی و رفاه بفردی",
+      "کاهش عوارض حساسیتی و آلرژی",
+      "پاکسازی هوا از میکروب‌ها و ویروس‌ها",
+      "تنظیم رطوبت هوا",
+    ],
+  },
+];

src/data/chiller.ts

@@ -0,0 +1,89 @@
+export type ProductAccordion = { title: string; items: string[] };
+
+export const chillerIntro = {
+  title: "چیلر چیست؟",
+  text: [
+    "چيلرهای شرکت هواران به دو دسته کلی هوا خنک و آب خنک تقسیم‌بندی میشوند که بر اساس نیاز شما مشتریان عزیز و یا بر اساس طراحی و پیشنهاد کارشناسان ما انتخاب می‌شود.",
+  ],
+};
+
+export const chillerBlocks = [
+  {
+    id: "air-cooled",
+    title: "چیلر هوا خنک",
+    titleEn: "Air Cooled Chiller",
+    intro: [
+      "چیلرهای هواخنک هواران در ظرفیت‌های 5 الی 580 تن تبرید با کیفیت و راندمان بالا و با رعایت استانداردهای جهانی در زمینه حرارت و انرژی، مقاوم بودن، ایمنی و تولید صدا، ساخته می‌شوند.",
+      "کاربرد چیلرهای هواخنک در مصارف مسکونی، صنعتی و یا تجاری، اداری خواهد بود. چیلر هوا خنک از یک واحد تهویه مرکزی تشکیل شده که آب را خنک می‌کند و سپس این آب خنک را از طریق یک سیستم لوله کشی به اطراف ساختمان می‌فرستد. در اطراف ساختمان، این آب خنک از طریق یک سیستم لوله کشی با پنکه ها و ردیفهای زیادی که به دستگاه های هواپیما نیز شبیه هستند، عبور میکند. اصول کار در چیلر هوا خنک تولید سرمایش بر اساس سیکل تراکمی-تبخیری است.",
+    ],
+    benefits: [
+      { img: "/images/pages/chiller/feature-1.png", label: "تامین آب سرد مرکزی" },
+      { img: "/images/pages/chiller/feature-4.png", label: "کارایی بالا" },
+      { img: "/images/pages/chiller/feature-3.png", label: "قابلیت نصب در محیط بیرون" },
+    ],
+    benefitsTitle: "مزایای چیلر هوا خنک هواران",
+    specs: [
+      "قابلیت طراحی بر اساس استفاده از کمپرسورهای حلزونی (Scroll)، مارپیچ (Screw) و رفت و برگشتی (Reciprocating)",
+      "استفاده از مبردهای مختلف نظیر R22, R134, R407c",
+      "قابلیت پوشش طیف وسیعی از کاربریهای مختلف اداری، تجاری، مسکونی و صنعتی",
+      "مبدل استفاده‌شده در اوپراتور از نوع مبدل پوسته و لوله (Shell & Tube) با استفاده از لوله‌های مسی شیاردار (Inner Grooved) که سبب انتقال حرارت بالاتر و افزایش راندمان است",
+      "استفاده از فین‌های شیاردار آلومینیومی و لوله‌های مسی برای کندانسور V-Type",
+      "استفاده از فن کندانسوری با راندمان بالا و با قابلیت کنترل دور با IP 55 بر اساس نیاز دستگاه",
+      "قابلیت استفاده از سیستم کاهنده صدا برای کمپرسور",
+      "امکان استفاده از تابلوی کنترلی مجهز به کنترل گر هوشمند PLC و یا استفاده از میکروپروسسرها",
+    ],
+    image: "/images/pages/chiller/air-cooled.png",
+    imageAlt: "چیلر هوا خنک",
+    isPng: true,
+  },
+  {
+    id: "water-cooled",
+    title: "چیلر آب خنک",
+    titleEn: "Water Cooled Chiller",
+    intro: [
+      "چیلرهای آب خنک هواران در ظرفیتهای 15 الی 1200 تن تبرید با کیفیت و راندمان بالا ساخته شده و برای مناطقی که دستیابی به آب هزینه گزافی ندارد و جزو مناطق مرطوب هم نیست انتخاب بسیار مناسبی هستند.",
+      "راندمان چیلرهای آب خنک در مقایسه با چیلرهای هوا خنک بالاتر است ولی نیاز به برج خنک کن و آب برای خنک کاری دارند. در این مجموعه چیلرها با رعایت استانداردهای موجود در زمینه حرارت و انرژی، مقاوم بودن، ایمنی و تولید صدا، ساخته می‌شوند.",
+      "کاربری چیلرهای آب خنک در مصارف مسکونی، صنعتی و یا تجاری، اداری خواهد بود.",
+      "بطور معمول، چیلر آب خنک دارای یک سیستم کنترل می‌باشد که دمای آب و جریان هوا را تنظیم میکند. این سیستم کنترل به صورت خودکار عمل میکند و با توجه به شرایط داخلی و خارجی، تنظیمات مناسب را برای حفظ دمای مطلوب و کارایی بهینه اعمال میکند.",
+      "استفاده از چیلر آب خنک در مقایسه با سیستمهای تهویه هوای دیگر، مزایایی مانند کارایی بالا، قدرت خنک‌کنندگی بیشتر و قابلیت پوشش دادن محیطهای بزرگ را داراست. علاوه بر این، این سیستم بدلیل استفاده از آب بعنوان خنک کننده، بهبود محیط زیست را نیز به همراه دارد، زیرا آب بعنوان یک منبع طبیعی و بازتولیدپذیر استفاده میشود.",
+    ],
+    benefits: [
+      { img: "/images/pages/chiller/feature-1.png", label: "تامین آب سرد مرکزی" },
+      { img: "/images/pages/chiller/feature-4.png", label: "ضریب عملکرد بالا" },
+      { img: "/images/pages/chiller/feature-3.png", label: "قابلیت نصب در موتور خانه" },
+    ],
+    benefitsTitle: "مزایای چیلر آب خنک هواران",
+    specs: [
+      "قابلیت طراحی بر اساس استفاده از کمپرسورهای حلزونی (Scroll)، مارپیچ (Screw) و رفت و برگشتی (Reciprocating)",
+      "استفاده از مبردهای مختلف نظیر R22, R134, R407c",
+      "ضریب عملکرد بالا جهت کاهش هزینه سربار مجموعه",
+      "قابلیت نصب در فضای سرپوشیده نظیر موتورخانه",
+      "توانایی تولید سرمایش زیر صفر برای مصارف صنعتی",
+      "توانایی اتصال به سیستم BMS",
+      "قابلیت استفاده از سیستم کاهنده صدا برای کمپرسور",
+      "امکان استفاده از تابلوی کنترلی مجهز به کنترل‌گر هوشمند PLC و یا استفاده از میکروپروسسرها",
+    ],
+    image: "/images/pages/chiller/water-cooled.jpg",
+    imageAlt: "چیلر آب خنک",
+    isPng: false,
+  },
+] as const;
+
+export const chillerFaq: ProductAccordion[] = [
+  {
+    title: "چیلر چیست؟",
+    items: [
+      "چیلر یک دستگاه تهویه مطبوع است که برای خنک کردن هوا یا مایعات بکار میرود. این دستگاه با استفاده از فرآیند تبخیر و تبرید، حرارت را از محیط جذب کرده و مایع یا هوا را سرد میکند. چیلرها بطور گسترده در سیستمهای تهویه مطبوع ساختمانها، صنایع و تجهیزات الکتریکی برای حفظ دما و خنک کردن محیط‌ها استفاده میشوند.",
+    ],
+  },
+  {
+    title: "انواع چیلر کدام است؟",
+    items: ["1) هوا خنک", "2) آب خنک"],
+  },
+  {
+    title: "قیمت چیلر تراکمی هوا خنک چه قدر با آب خنک تفاوت دارد؟",
+    items: [
+      "قیمت چیلر هوا خنک حدودا ۵ تا ۲۵ درصد (بستگی به تناژ دستگاه دارد) از آب خنک بیشتر است و دلیل این این تفاوت این است که کندانسور هوا خنک هزینه تمام شده بیشتری نسبت به کندانسور آب خنک دارد اما قبل از خرید باید این را هم مد نظر داشته باشید که یک برج خنک کننده و سختی گیر آب هم برای چیلرهای آب خنک باید خریداری کنید و مسائل و مشکلات این چیلرها را هم در نظر داشته باشید",
+    ],
+  },
+];

src/data/company.ts

@@ -0,0 +1,63 @@
+export const aboutPage = {
+  title: "درباره ما",
+  titleEn: "About Us",
+  companyTitle: "دربـــــاره شـــــرکـــــت",
+  companyTitleEn: "About Company",
+  paragraphs: [
+    "شرکت رسام تجارت هواران با تکیه بر دانش نو و بروز گروهی از فارغ التحصیلان مکانیک سیالات دانشگاه های برتر کشور و با توجه به سابقه ده ساله فعالیت مدیران خود در حوزه تهویه مطبوع و تهویه صنعتی شروع به کار نمود.",
+    "توجه به توانایی و تخصص در حوزه طراحی و تولید تجهیزاتی نظیر چیلر، فن، هواساز، فن کویل و غیره و همچنین توان و تجربه در امور بازرگانی اعضای مجموعه خود آماده همکاری و ارائه خدمات در این زمینه است.",
+    "محصولات این مجموعه با شناخت دقیق اقلیم کشورمان تولید و طراحی شده و دستگاه های تهویه مطبوع ساخته شده برای پروژه های مختلف با کاربری صنعتی، مسکونی، تجاری و یا اداری مورد استفاده قرار گرفته اند.",
+    "شایان ذکر است که تعهد، مسئوولیت پذیری و اتکا به دانش و تخصص در عمل و نه تنها در سخن از اصلی ترین رویکردهای این مجموعه است چرا که برداشتن حتی یک گام در مسیر درست امیدی است که ما در مسیر تحقق بخشیدن به آن وارد میدان شده ایم.",
+  ],
+  activitiesTitle: "اعم فعالیت های شرکت",
+  activitiesTitleEn: "Company Activities",
+  activities: [
+    "طراحی، مشاوره، تامین و تولید انواع چیلر آب-خنک (Water Cooled) و هوا–خنک (Air Cooled) با ظرفیت های مختلف برای کاربری مسکونی، تجاری و یا صنعتی",
+    "طراحی، مشاوره و ساخت انواع هواسازهای استاندارد برای کاربری مسکونی و صنعتی و یا هواساز هایژنیک برای اتاق های تمیز (Clean Room)",
+    "تولید و تامین انواع فن کویل سقفی، کانالی و زمینی و غیره",
+    "طراحی، تامین و تولید انواع فن آکسیال و سانتریفیوژ اگزاست و هوای تازه در انواع مختلف بین کانالی، کابینتی، دیواری، پشت بامی و سقفی",
+    "طراحی، تامین و اجرای سیستم‌های مدیریت دود (Smoke Management System) شامل سیستم‌های:",
+  ],
+  technicalTitle: "خدمات فنی",
+  technicalServices: [
+    "فشار مثبت راه‌پله و آسانسور (Staircase & Lift Shaft Pressurization)",
+    "تخلیه دود فضاهای کاربردی (Smoke Extraction & Smoke Control)",
+    "تخلیه و کنترل دود پارکینگ (Car Park Ventilation)",
+    "مشاوره و ارائه خدمات جهت اخذ تاییدیه آتش نشانی جهت سیستم مدیریت دود پارکینگ",
+  ],
+  slogan: "هواران، یک گام در مسیر درست",
+  image: "/images/about/about.jpg",
+};
+
+export const contactPage = {
+  title: "تماس باما",
+  titleEn: "Contact Us",
+  formTitle: "سوالی دارید، بپرسید",
+  formTitleEn: "Question",
+  submitLabel: "ارسال پیام",
+  visitTitle: "به دفتر ما مراجعه کنید",
+  emailTitle: "به ما ایمیل بزنید",
+  office: "دفتر مرکزی : جنت آباد مرکزی، برج اکسین، طبقه 5، واحد 19",
+  factory: "کارخانه : شهرک صنعتی صفادشت",
+  factoryAddress: "بلوار فروردین، پنجم شرقی",
+  email: "info@Havaran.com",
+  phones: ["(021) 4614 42 67", "(021) 4614 42 71"],
+  mapImage: "/images/pages/contact/icon.png",
+  mapEmbedUrl:
+    "https://www.google.com/maps?q=35.7615,51.3095&z=15&output=embed",
+};
+
+export const catalogPage = {
+  title: "دانلود",
+  titleEn: "Catalog",
+  heading: "کاتالوگ عمومی شرکت هواران",
+  text: [
+    "کاتالوگ زیر، اطلاعات کاملی درباره شرکت هواران، محصولات و فعالیت های آن در اختیار شما می گذارد.",
+    "از اینکه اینجا هستید، بسیار خوشحالیم.",
+    "برای دانلود، بر روی دکمه ی دانلود کلیک کنید.",
+  ],
+  cover: "/images/pages/catalog/cover.jpg",
+  downloadHref: "/files/HavaranCatalog.pdf",
+  downloadLabel: "دانلود",
+  fileName: "HavaranCatalog.pdf",
+};

src/data/documents.ts

@@ -0,0 +1,66 @@
+export type DocumentItem = {
+  id: string;
+  title: string;
+  image: string;
+};
+
+export const documentsCerts: DocumentItem[] = [
+  {
+    id: "ims",
+    title: "گواهینامه IMS (ISO 9001 / 14001 / 45001)",
+    image: "/images/pages/documents/certs/c4ujquAjFm.jpg",
+  },
+  {
+    id: "hse",
+    title: "گواهینامه HSE-MS",
+    image: "/images/pages/documents/certs/j3OkhLHV0U.jpg",
+  },
+  {
+    id: "iso45001",
+    title: "گواهینامه ISO 45001:2018",
+    image: "/images/pages/documents/certs/Jz8xhkNnhj.jpg",
+  },
+  {
+    id: "iso14001",
+    title: "گواهینامه ISO 14001:2015",
+    image: "/images/pages/documents/certs/4TYGdFwaCA.jpg",
+  },
+  {
+    id: "iso9001",
+    title: "گواهینامه ISO 9001:2015",
+    image: "/images/pages/documents/certs/vpjYhk2Geq.jpg",
+  },
+];
+
+export const documentsSatisfaction: DocumentItem[] = [
+  {
+    id: "ata",
+    title: "رضایتمندی آتا انرژی",
+    image: "/images/pages/documents/satisfaction/Qe8qGFY9m5.jpg",
+  },
+  {
+    id: "sat-2",
+    title: "رضایتمندی کارفرما",
+    image: "/images/pages/documents/satisfaction/pwzq67bsBs.jpg",
+  },
+  {
+    id: "reefel",
+    title: "رضایتمندی reefel HVAC (پروژه میدان سبلان)",
+    image: "/images/pages/documents/satisfaction/yx2nSrkiLs.jpg",
+  },
+  {
+    id: "sat-4",
+    title: "رضایتمندی کارفرما",
+    image: "/images/pages/documents/satisfaction/bE9Gkd8TWv.jpg",
+  },
+  {
+    id: "sat-5",
+    title: "رضایتمندی کارفرما",
+    image: "/images/pages/documents/satisfaction/JmG1jid8YC.jpg",
+  },
+  {
+    id: "sat-6",
+    title: "رضایتمندی کارفرما",
+    image: "/images/pages/documents/satisfaction/YQkQuBP2Dx.jpg",
+  },
+];

src/data/extracted/ahu.json

@@ -0,0 +1,54 @@
+{
+  "intro": [
+    "هواسازها نوعی از اجزای سیستم های تهویه مطبوع هستند که برای وارد کردن هوای تازه و مطبوع به داخل اتاق استفاده میشوند. هواساز به نوعی شُشهای خانه یا محل کار شما است که میتواند کیفیت هوای مورد نیاز شما را به قدری که نیاز است تامین کند.",
+    "استفاده از این تجهیزات در سیستم های تهویه برای مکانهای مختلف صنعتی، اداری، انباری، مسکونی و مناطق دیگر که به تبادل هوا و تداوم تأمین آن نیاز است مرسوم است. با استفاده از این سیستم تجربه سکونت راحت افراد در هر مکانی میگردد و تأثیری مفید بر سلامتی آنها خواهد داشت. به علاوه بر اساس درخواست شما میتواند به شما این امکان را بدهد که میزان رطوبت را تنظیم کنید (برای تولید رطوبت یا رطوبت زدایی)، درجه حرارت هوا را کنترل کنید (سرمایش یا گرمایش) و هوا را تصفیه نمایید (فیلتر کردن از گرد و غبار، دود و سایر آلاینده‌ها).",
+    "هواسازها به دو دسته هواساز ساختمانی و صنعتی تقسیم‌بندی میشوند.",
+    "از هواساز ساختمانی میتوان در اماکن مختلف مسکونی، اداری، تجاری، آموزشی و... استفاده نمود.",
+    "دستگاه هواساز صنعتی (Air Handling Unit) مخصوص تهویه هوای سوله صنعتی، تهویه هوای انبار، سالنهای بزرگ تولیدی، ورزشی و غیره ساخته میشود.",
+    "به صورت کلی هواساز ها به دو دسته اصلی، تقسیم بندی میشوند:",
+    "الف) هواساز استاندارد",
+    "ب) هواساز هایژنیک"
+  ],
+  "specs": [
+    "ظرفیت سرمایش ۱۵ تا ۳۸۱ کیلو وات",
+    "ظرفیت گرمایش ۳۱ تا ۶۹۳ کیلو وات",
+    "ظرفیت هوا دِهی ۳۲۰۰ تا ۶۸۰۰۰۰ متر مکعب بر ساعت"
+  ],
+  "advantages": [
+    "کویل های فین تیوب با استفاده از گُلدفین و بلوفین مقاوم در برابر خوردگی و آسیبهای احتمالی همچنین استفاده از لوله های مسی 8/5 و 8/3 اینچ",
+    "امکان تهیه فَن سانتریفیوژ Forward یا Backward دارای بالانس استاتیکی و دینامیکی با ظرفیت های مختلف با دبی مختلف ایرانی یا خارجی ضد جرقه اتکس ATEX دارای اینوِرتور جهت تنظیم دُور و هوا دِهی",
+    "امکان نصب دریچه بازدید شیشه‌ای به روی بدنه درصورت تمایل مشتری قابلیت نصب فیلتر براساس نیاز مشتری و رطوبت‌زَنی humidifier و رطوبت‌گیری dehumidifier فیلتر هپا، فیلتر آلومینیومی و...",
+    "بهره گیری از پروفیلهای Thermal Break بمنظور کاهش تلفات انرژی درصورت درخواست",
+    "رنگ بدنه پودری الکترواستاتیک و کوره‌ای به ضخامت 70 میکرون"
+  ],
+  "faq": [
+    {
+      "title": "هوا ساز یا Air Handling Unit چیست؟",
+      "items": [
+        "هوا ساز ها یک نوع از اجزای سیستمهای تهویه مطبوع هستند که برای وارد کردن هوای تازه و مطبوع به داخل اتاق استفاده میشوند. هواساز به نوعی شُشهای خانه یا محل کار شماست که میتواند کیفیت هوای مورد نیازتان را به اندازه‌ای که نیاز دارید تامین کند."
+      ]
+    },
+    {
+      "title": "انواع هواساز کدام است؟",
+      "items": [
+        "الف) هواساز استاندارد",
+        "ب) هواساز هایژنیک"
+      ]
+    },
+    {
+      "title": "مزایای هواساز چیست؟",
+      "items": [
+        "بهبود کیفیت هوا",
+        "سلامتی و رفاه بفردی",
+        "کاهش عوارض حساسیتی و آلرژی",
+        "پاکسازی هوا از میکروب‌ها و ویروس‌ها",
+        "تنظیم رطوبت هوا"
+      ]
+    }
+  ],
+  "images": {
+    "main": "/images/pages/ahu/main.png",
+    "specs": "/images/pages/ahu/specs.png",
+    "advantages": "/images/pages/ahu/advantages.jpg"
+  }
+}

src/data/extracted/chiller.json

@@ -0,0 +1,50 @@
+{
+  "intro": [],
+  "air": {
+    "title": "چیلر هوا خنک",
+    "text": [
+      "چیلرهای هواخنک هواران در ظرفیت‌های 5 الی 580 تن تبرید با کیفیت و راندمان بالا و با رعایت استانداردهای جهانی در زمینه حرارت و انرژی، مقاوم بودن، ایمنی و تولید صدا، ساخته می‌شوند.",
+      "کاربرد چیلرهای هواخنک در مصارف مسکونی، صنعتی و یا تجاری، اداری خواهد بود. چیلر هوا خنک از یک واحد تهویه مرکزی تشکیل شده که آب را خنک می‌کند و سپس این آب خنک را از طریق یک سیستم لوله کشی به اطراف ساختمان می‌فرستد. در اطراف ساختمان، این آب خنک از طریق یک سیستم لوله کشی با پنکه ها و ردیفهای زیادی که به دستگاه های هواپیما نیز شبیه هستند، عبور میکند. اصول کار در چیلر هوا خنک تولید سرمایش بر اساس سیکل تراکمی-تبخیری است."
+    ],
+    "specs": [
+      "حلزونی (Scroll)",
+      "مارپیچ (Screw)",
+      "رفت و برگشتی (Reciprocating)"
+    ],
+    "image": "/images/pages/chiller/air-cooled.png"
+  },
+  "water": {
+    "title": "چیلر آب خنک",
+    "text": [
+      "چیلرهای هواخنک هواران در ظرفیت‌های 5 الی 580 تن تبرید با کیفیت و راندمان بالا و با رعایت استانداردهای جهانی در زمینه حرارت و انرژی، مقاوم بودن، ایمنی و تولید صدا، ساخته می‌شوند.",
+      "کاربرد چیلرهای هواخنک در مصارف مسکونی، صنعتی و یا تجاری، اداری خواهد بود. چیلر هوا خنک از یک واحد تهویه مرکزی تشکیل شده که آب را خنک می‌کند و سپس این آب خنک را از طریق یک سیستم لوله کشی به اطراف ساختمان می‌فرستد. در اطراف ساختمان، این آب خنک از طریق یک سیستم لوله کشی با پنکه ها و ردیفهای زیادی که به دستگاه های هواپیما نیز شبیه هستند، عبور میکند. اصول کار در چیلر هوا خنک تولید سرمایش بر اساس سیکل تراکمی-تبخیری است."
+    ],
+    "specs": [
+      "حلزونی (Scroll)",
+      "مارپیچ (Screw)",
+      "رفت و برگشتی (Reciprocating)"
+    ],
+    "image": "/images/pages/chiller/water-cooled.jpg"
+  },
+  "faq": [
+    {
+      "title": "چیلر چیست؟",
+      "items": [
+        "چیلر یک دستگاه تهویه مطبوع است که برای خنک کردن هوا یا مایعات بکار میرود. این دستگاه با استفاده از فرآیند تبخیر و تبرید، حرارت را از محیط جذب کرده و مایع یا هوا را سرد میکند. چیلرها بطور گسترده در سیستمهای تهویه مطبوع ساختمانها، صنایع و تجهیزات الکتریکی برای حفظ دما و خنک کردن محیط‌ها استفاده میشوند."
+      ]
+    },
+    {
+      "title": "انواع چیلر کدام است؟",
+      "items": [
+        "1) هوا خنک",
+        "2) آب خنک"
+      ]
+    },
+    {
+      "title": "قیمت چیلر تراکمی هوا خنک چه قدر با آب خنک تفاوت دارد؟",
+      "items": [
+        "قیمت چیلر هوا خنک حدودا ۵ تا ۲۵ درصد (بستگی به تناژ دستگاه دارد) از آب خنک بیشتر است و دلیل این این تفاوت این است که کندانسور هوا خنک هزینه تمام شده بیشتری نسبت به کندانسور آب خنک دارد اما قبل از خرید باید این را هم مد نظر داشته باشید که یک برج خنک کننده و سختی گیر آب هم برای چیلرهای آب خنک باید خریداری کنید و مسائل و مشکلات این چیلرها را هم در نظر داشته باشید"
+      ]
+    }
+  ]
+}

src/data/extracted/fan.json

@@ -0,0 +1,73 @@
+{
+  "intro": [],
+  "axialIntro": [
+    "AxialFan",
+    "این محصولات دارای مصارف کاربردی بسیار وسیعی در صنعت، سیستم تهویه پارکینگ، ساختمان های مسکونی، آشپزخانه های صنعتی، سالن های تولیدی و بسیاری موارد دیگر است که سبب شده در شمار جایگاه پر تیراژ ترین فن های دنیا شناخته شوند. فن های محوری یا آکسیال در شرکت هواران بر دو نوع اصلی آکسیال بین کانالی و آکسیال دیواری، طراحی و ساخته می شود."
+  ],
+  "axialDuct": {
+    "title": "الف. آکسیـــــال کانالـــــی",
+    "titleEn": "Axial Duct Fan",
+    "text": [
+      "فن های آکسیال کانالی دارای موارد استفاده گوناگونی است با این طراحی علاوه بر تامین دبی هوای نسبتاً بالا می توان به افت فشار نیز تا محدوده بالایی غلبه نمود.",
+      "این نوع فن بخصوص برای تامین هوای تازه در سیستم تهویه پارکینگ مورد استفاده قرار می گیرند که در مجموعه هواران با در نظر گرفتن راندمان حداکثری و بهینه بر اساس اعلام نیاز مشتری ساخته می شوند.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و دارای انواع مختلفی است که ساخت موارد بالا در مجموعه هواران مطابق با استاندارد های روز صورت می پذیرد."
+    ],
+    "specs": [],
+    "image": "/images/pages/fan/axial-duct.png"
+  },
+  "axialWall": {
+    "title": "ب. آکسیـــــال دیـــــواری",
+    "titleEn": "Axial Wall Mounted Fan",
+    "text": [
+      "فن های دیواری دارای تنوع بسیار گوناگونی است که در مجموعه هواران با در نظر گرفتن راندمان و شرایط مختلف نیازمندی مشتری طراحی می شوند.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و همچنین اتصال موتور به فن دارای انواع مختلفی است که موارد ذکر شده در مجموعه هواران مطابق با استاندارد های روز در این زمینه ساخته میشوند.در بسیاری از صنایع که در آن هوا دارای فشار بالایی نیست از هواکش آکسیال دیواری برای خنک سازی و نیز باز کردن نفس موتور های کارخانه نیز استفاده می شود."
+    ],
+    "specs": [],
+    "image": "/images/pages/fan/axial-wall.png"
+  },
+  "centrifugalIntro": [
+    "Centrifugal Fan",
+    "فن های سانتریفیوژ شرکت هواران بر اساس ضوابط استاندارد روز دنیا و با راندمان بالا تولید می شوند. عموماً این دسته از فن ها برای تامین افت فشار بالا و با کاربری بعنوان دمنده یا مکنده ساخته می شوند.",
+    "که در سه دسته بکوارد، فوروارد و پلاگ فن تقسیم بندی میگردند."
+  ],
+  "backward": {
+    "title": "الف. بکـــــوارد فن",
+    "text": [
+      "فن بکوراد از زیر مجموعه فن های سانتریفیوژ است و از پرکاربرد ترین فن های این نوع می باشد. فن بکوراد دارای تولید صدای بسیار پایین و راندمان بالایی است و بدلیل شکل پره ها بیشتر برای تخلیه هوا از آن استفاده می شود.",
+      "همچنین بدلیل فاصله زیاد پره ها از هم برای کاربری در هوای آلوده و (برای مثال جابجایی هوای آغشته به بخارات روغن در آشپزخانه) انتخاب مناسبی است.",
+      "برای دور فن در این نوع دستگاه ها محدودیتی وجود ندارد و با استفاده از بکارگیری پولی و تسمه می توان به گستره بزرگ تری از جابجایی هوا دست پیدا کرد.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و همچنین اتصال موتور به فن دارای انواع مختلفی است که موارد ذکر شده.در مجموعه هواران مطابق با استاندارد های روز در این زمینه ساخته می شوند."
+    ],
+    "specs": [],
+    "image": "/images/pages/fan/backward.png"
+  },
+  "forward": {
+    "title": "ب. فـــــوروارد فن",
+    "text": [
+      "فن فوروارد از زیر مجموعه فن های سانتریفیوژ است و توانایی انتقال جریان هوای بالا با سرعت پایین را دارد و بدلیل شکل پره ها بیشتر برای دهش هوا از آن استفاده می شود.",
+      "بدلیل فاصله کم پره ها از هم برای کاربری در آلودگی کم انتخاب مناسبی است. برای دور فن در این نوع دستگاه ها محدودیتی وجود ندارد و با استفاده از بکارگیری پولی و تسمه می توان به گستره بزرگ تری از جابجایی هوا دست پیدا کرد.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، موارد مورد استفاده در ساخت پروانه و بدنه فن و همچنین اتصال موتور به فن دارای انواع مختلفی است که موارد ذکر شده در مجموعه هواران مطابق با استاندارد های روز در این زمینه ساخته می شوند."
+    ],
+    "specs": [],
+    "image": "/images/pages/fan/forward.png"
+  },
+  "plug": {
+    "title": "ج. پلاگ فن",
+    "text": [
+      "فن های آکسیال کانالی دارای موارد استفاده گوناگونی است با این طراحی علاوه بر تامین دبی هوای نسبتاً بالا می توان به افت فشار نیز تا محدوده بالایی غلبه نمود.",
+      "این نوع فن بخصوص برای تامین هوای تازه در سیستم تهویه پارکینگ مورد استفاده قرار می گیرند که در مجموعه هواران با در نظر گرفتن راندمان حداکثری و بهینه بر اساس اعلام نیاز مشتری ساخته می شوند.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و دارای انواع مختلفی است که ساخت موارد بالا در مجموعه هواران مطابق با استاندارد های روز صورت می پذیرد."
+    ],
+    "specs": [],
+    "image": "/images/pages/fan/plug.jpg"
+  },
+  "faq": [
+    {
+      "title": "انواع فن های هواران کدام است؟",
+      "items": [
+        ".فـــــن آکسیـــــال : به دو دسته کانالی و دیواری تقسیم می شود",
+        ".فـــــن ســـــانتریفیوژ: به سه دسته بکواردفن،فوروارد فن و پلاگ فن تقسیم میشود"
+      ]
+    }
+  ]
+}

src/data/extracted/fancoil.json

@@ -0,0 +1,65 @@
+{
+  "intro": [],
+  "models": [
+    {
+      "slug": "ceiling",
+      "title": "فن کویل سقفی توکـار",
+      "text": [
+        "فَن کویلهای سقفیِ توکار هواران در رنج ظرفیت 200 الی 1200 فوت مکعب بردقیقه برپایه نیاز ساختمانهای امروزی طراحی و ساخته شده‌اند. فَن کویل سقفیِ توکار، یک سیستم تهویه مطبوع است که در ساختمانها برای سرمایش و گرمایش هوا استفاده میشود. این سیستم شامل یک واحد فن است که در سقف ساختمان نصب میشود. عملکرد اصلی فن‌کویل سقفی توکار بر اساس یک سیستم تبادل حرارت با آب است. در داخل واحد فن کویل، یک پکیج هوایی قرار دارد که شامل یک فن برای جابجایی هوا، یک کویل سرد کننده (کویل تبرید) و یک کویل گرم کننده است. این کویلها با استفاده از آب سرد یا آب گرم، هوا را سرد یا گرم می‌کنند.",
+        "دو نوع فن کویل از نظر دو لوله‌ای یا چهار لوله‌ای:",
+        "فن کویل سقفی توکار دولوله‌ای",
+        "فن کویل کاستی چهارلوله‌ای"
+      ],
+      "specs": [],
+      "image": "/images/pages/fancoil/Jt2uTJnoom.png"
+    },
+    {
+      "slug": "ducted",
+      "title": "فن کویل کانالـــــی",
+      "text": [
+        "فن کویلهای کانالیِ هواران در رنج ظرفیت 600 الی 2000 فوت مکعب بردقیقه برپایه نیاز ساختمانهای امروزی طراحی و ساخته شده‌اند. سیستم کانالی شامل یک شبکه از لوله ها و کانال‌های هواست که در دیواره‌ها ، سقف و کف ساختمان نصب میشود. این کانال‌ها هوای خنک و گرم را به سراسر ساختمان منتقل میکنند. هوای تازه از طریق سیستم تهویه مطبوع به ساختمان وارد میشود و هوای آلوده و دود را از داخل ساختمان خارج میکند."
+      ],
+      "specs": [],
+      "image": "/images/pages/fancoil/HDlbJ02t1d.png"
+    },
+    {
+      "slug": "floor",
+      "title": "فن کویل زمینی",
+      "text": [
+        "فن کویل های زمینیِ هواران در رنج ظرفیت 200 الی 1200 فوت مکعب بر دقیقه بر اساسِ نیاز ساختمانهای امروزی ساخته و طراحی شده‌اند."
+      ],
+      "specs": [],
+      "image": "/images/pages/fancoil/F4AuvDLBB2.png"
+    },
+    {
+      "slug": "cassette",
+      "title": "فن کویل کاستی",
+      "text": [],
+      "specs": [],
+      "image": "/images/pages/fancoil/KORewFcBQF.png"
+    }
+  ],
+  "faq": [
+    {
+      "title": "فن کویل چیست؟",
+      "items": [
+        "فن کویل یک سیستم سرمایشی و گرمایشی برای ساختمان است. مکانیزم آن از فن و کویل تشکیل شده که آب گرم در زمستان و آب سرد در تابستان در کویلهای مسی و یا آلومینیومی آن جریان دارد. سرما و گرمای این آب به کمک یک فَن که جریان هوا را از لا به لای کویلها عبور می‌دهد به محیط می‌رسد. این گرما و سرمای انتقال‌یافته به ساختمان بدلیل جا به جایی دما بوسیله آب‌و‌هوا حالت مطبوعی داشته و با تبادل گرما و سرما دمای اتاق را به میزان دلخواه .می‌رساند"
+      ]
+    },
+    {
+      "title": "انواع فن کویل را نام ببرید؟",
+      "items": [
+        ".فن کویل به چهار دسته: فن کویل سقفیِ توکـار، فن کویلِ کانالـــــی، فن کویلِ زمینی، فن کویلِ کاستی تقسیم میشود"
+      ]
+    },
+    {
+      "title": "مزایای فن کویل چیست؟",
+      "items": [
+        "قابلیت استفاده ساده و راحت",
+        "سرمایش و گرمایش به صورت همزمان",
+        "اشغال کمتر فضا",
+        "مصرف بهینه انرژی"
+      ]
+    }
+  ]
+}

src/data/extracted/portfolios-full.json

@@ -0,0 +1,235 @@
+[
+  {
+    "id": "496",
+    "slug": "496",
+    "title": "شهرک مسکونی شهید خرازی",
+    "titleEn": "Kharazi Residential Complex",
+    "titleQuery": "شهرک-مسکونی-شهید-خرازی",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/conversions/1-thumbnail.jpg",
+    "alt": "شهرک مسکونی شهید خرازی",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/2270259155fbc14b580cfb2f9d169ba9/3.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/29213857555c0eb55e4443f2a90ce4c5/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/1.jpeg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "495",
+    "slug": "495",
+    "title": "برج تجارت قزوین",
+    "titleEn": "Qazvin Trade Tower",
+    "titleQuery": "برج-تجارت-قزوین",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+    "alt": "برج تجارت قزوین",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6b77087604c8e3dd04ab36039f15f1f2/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/34a699c964a740fca3e768f3c9ceb5ef/_%D8%AA%D8%AC%D8%A7%D8%B1%D8%AA_%D9%82%D8%B2%D9%88%DB%8C%D9%86.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "494",
+    "slug": "494",
+    "title": "گروه سرمایه گذاری رس آ",
+    "titleEn": "Resa Investment Group",
+    "titleQuery": "گروه-سرمایه-گذاری-رس-آ",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/conversions/Picture1-thumbnail.jpg",
+    "alt": "گروه سرمایه گذاری رس آ",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/conversions/Picture1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/Picture1.png"
+    ],
+    "description": ""
+  },
+  {
+    "id": "424",
+    "slug": "424",
+    "title": "شرکت مبلمان اداری لیوتاب",
+    "titleEn": "Livetab Office Furniture Company",
+    "titleQuery": "شرکت-مبلمان-اداری-لیوتاب",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/conversions/ei_1625553777295-thumbnail.jpg",
+    "alt": "شرکت مبلمان اداری لیوتاب",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/conversions/ei_1625553777295-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/c7b3204ec9bfea0a9f9dc23b77f3b5e7/image-(1).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/27848a3b8b38339b73bc30ff9deff7a2/image-(3).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/266c522980acb4ee64aef0912948be48/image-(4).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b236c744e94e72c48bb073c1e1fe4417/image-(5).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/89c0fc798cddf41a971384b4ae47abd1/image.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/ei_1625553777295.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "274",
+    "slug": "274",
+    "title": "مجتمع مسکونی لبخند 2",
+    "titleEn": "Labkhand 2 Residential Complex",
+    "titleQuery": "مجتمع-مسکونی-لبخند-2",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/conversions/1-thumbnail.jpg",
+    "alt": "مجتمع مسکونی لبخند 2",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/9df29dfc87cdbdecd4150b24fc63c52c/3.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/e6dc5789517d0ecd1b071903c4810eaa/2.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "276",
+    "slug": "276",
+    "title": "مجتمع مسکونی شفق فردیس",
+    "titleEn": "Fardis Shafagh Residential Complex",
+    "titleQuery": "مجتمع-مسکونی-شفق-فردیس",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/conversions/1-thumbnail.jpg",
+    "alt": "مجتمع مسکونی شفق فردیس",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/14f97b191b6fa0838c21882579b1e65a/2.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "282",
+    "slug": "282",
+    "title": "مجتمع تجاری پرنسا",
+    "titleEn": "Pransa Commercial Complex",
+    "titleQuery": "مجتمع-تجاری-پرنسا",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+    "alt": "مجتمع تجاری پرنسا",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/effbb64ff6c9b38c6fcb05185cd22fc3/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/dcd452092643b695257a74108459b8f3/4.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "281",
+    "slug": "281",
+    "title": "بیمارستان پیامبران",
+    "titleEn": "Payambaran Hospital",
+    "titleQuery": "بیمارستان-پیامبران",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg",
+    "alt": "بیمارستان پیامبران",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b9e702b9182246d9ad08bef0c2229f6b/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/27e34e1093ba7e24075b9f5b25dcf5a7/4.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "295",
+    "slug": "295",
+    "title": "آرشیت دارو طب",
+    "titleEn": "Arshit Darou Teb",
+    "titleQuery": "آرشیت-دارو-طب",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg",
+    "alt": "آرشیت دارو طب",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/1.png"
+    ],
+    "description": ""
+  },
+  {
+    "id": "283",
+    "slug": "283",
+    "title": "فروشگاه رفاه اسلامشهر",
+    "titleEn": "Refah Shopping Center",
+    "titleQuery": "فروشگاه-رفاه-اسلامشهر",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg",
+    "alt": "فروشگاه رفاه اسلامشهر",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/effa3b908aaa9f8744b980829a6bfd15/3.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/e35adc826b021f91f72f183d1bb24773/2.png",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0df5627695c1aaf2a2be5c738a80f0c3/4.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/29430ba87f428a5f10b3a531b0761f15/5.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "493",
+    "slug": "493",
+    "title": "مجتمع مسکونی سپند",
+    "titleEn": "Sepand Residential Building",
+    "titleQuery": "مجتمع-مسکونی-سپند",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg",
+    "alt": "مجتمع مسکونی سپند",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "492",
+    "slug": "492",
+    "title": "مسکونی آیت الله کاشانی",
+    "titleEn": "Kashani Residential Building",
+    "titleQuery": "مسکونی-آیت-الله-کاشانی",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/conversions/1-thumbnail.jpg",
+    "alt": "مسکونی آیت الله کاشانی",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "491",
+    "slug": "491",
+    "title": "مجتمع مسکونی سید خندان",
+    "titleEn": "Seyedkhandan Residential Building",
+    "titleQuery": "مجتمع-مسکونی-سید-خندان",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/conversions/1-thumbnail.jpg",
+    "alt": "مجتمع مسکونی سید خندان",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/616485de8e020be6a556a6fc22c74cf9/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "490",
+    "slug": "490",
+    "title": "ساختمان مسکونی خیابان ولنجک",
+    "titleEn": "Velenjak Street Residential Building",
+    "titleQuery": "ساختمان-مسکونی-خیابان-ولنجک",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/conversions/1-thumbnail.jpg",
+    "alt": "ساختمان مسکونی خیابان ولنجک",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f12491d99a85c8ea8cd2109b292f47e/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "489",
+    "slug": "489",
+    "title": "ساختمان مسکونی خیابان دماوند",
+    "titleEn": "Damavand Street Residential Building",
+    "titleQuery": "ساختمان-مسکونی-خیابان-دماوند",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/conversions/a-thumbnail.jpg",
+    "alt": "ساختمان مسکونی خیابان دماوند",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/conversions/a-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b9378fe1dc23747e1ca3099da4fcc221/b.png",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/a.jpg"
+    ],
+    "description": ""
+  }
+]

src/data/extracted/portfolios.json

@@ -0,0 +1,187 @@
+[
+  {
+    "id": 496,
+    "slug": "496",
+    "title": "شهرک مسکونی شهید خرازی",
+    "titleEn": "",
+    "titleQuery": "شهرک-مسکونی-شهید-خرازی",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 495,
+    "slug": "495",
+    "title": "شهرک مسکونی شهید خرازی",
+    "titleEn": "",
+    "titleQuery": "برج-تجارت-قزوین",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/conversions/Picture1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 494,
+    "slug": "494",
+    "title": "برج تجارت قزوین",
+    "titleEn": "",
+    "titleQuery": "گروه-سرمایه-گذاری-رس-آ",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/conversions/Picture1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/conversions/ei_1625553777295-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 424,
+    "slug": "424",
+    "title": "گروه سرمایه گذاری رس آ",
+    "titleEn": "",
+    "titleQuery": "شرکت-مبلمان-اداری-لیوتاب",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/conversions/ei_1625553777295-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/conversions/ei_1625553777295-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 274,
+    "slug": "274",
+    "title": "شرکت مبلمان اداری لیوتاب",
+    "titleEn": "",
+    "titleQuery": "مجتمع-مسکونی-لبخند-2",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 276,
+    "slug": "276",
+    "title": "مجتمع مسکونی لبخند 2",
+    "titleEn": "",
+    "titleQuery": "مجتمع-مسکونی-شفق-فردیس",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 282,
+    "slug": "282",
+    "title": "مجتمع مسکونی شفق فردیس",
+    "titleEn": "",
+    "titleQuery": "مجتمع-تجاری-پرنسا",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 281,
+    "slug": "281",
+    "title": "مجتمع تجاری پرنسا",
+    "titleEn": "",
+    "titleQuery": "بیمارستان-پیامبران",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 295,
+    "slug": "295",
+    "title": "بیمارستان پیامبران",
+    "titleEn": "",
+    "titleQuery": "آرشیت-دارو-طب",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 283,
+    "slug": "283",
+    "title": "آرشیت دارو طب",
+    "titleEn": "",
+    "titleQuery": "فروشگاه-رفاه-اسلامشهر",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 493,
+    "slug": "493",
+    "title": "فروشگاه رفاه اسلامشهر",
+    "titleEn": "",
+    "titleQuery": "مجتمع-مسکونی-سپند",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 492,
+    "slug": "492",
+    "title": "مجتمع مسکونی سپند",
+    "titleEn": "",
+    "titleQuery": "مسکونی-آیت-الله-کاشانی",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 491,
+    "slug": "491",
+    "title": "مسکونی آیت الله کاشانی",
+    "titleEn": "",
+    "titleQuery": "مجتمع-مسکونی-سید-خندان",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/conversions/1-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 490,
+    "slug": "490",
+    "title": "مجتمع مسکونی سید خندان",
+    "titleEn": "",
+    "titleQuery": "ساختمان-مسکونی-خیابان-ولنجک",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/conversions/1-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/conversions/1-thumbnail.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/conversions/a-thumbnail.jpg"
+    ]
+  },
+  {
+    "id": 489,
+    "slug": "489",
+    "title": "ساختمان مسکونی خیابان ولنجک",
+    "titleEn": "",
+    "titleQuery": "ساختمان-مسکونی-خیابان-دماوند",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/conversions/a-thumbnail.jpg",
+    "images": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/conversions/a-thumbnail.jpg"
+    ]
+  }
+]

src/data/extracted/smoke.json

@@ -0,0 +1,76 @@
+{
+  "sections": [
+    {
+      "id": "jetfan",
+      "title": "سیستم کنترل دود پارکینگ بر مبنای جت فن",
+      "text": [
+        "سیستم جت‌فن، بر پایه جانمایی جت‌فن‌ها به جای کانال‌ها در سراسر پارکینگ قرار می‌گیرند. به صورتی‌که جت‌فن‌های نصب شده در سقف پارکینگ جریان هوا و دود را از سمت فن‌های دمنده هوای تازه به سمت منطقه وجود فن‌های تخلیه دود هدایت کرده و در این مسیر جریان دود و هوا را به صورت منحنی از بالا به پایین جابجا می‌کنند و همین امر سبب افزایش دید فرار برای خودروها و عابرین می‌شود و از ایجاد نواحی مرده (Dead Spots) در کلیه نقاط پارکینگ جلوگیری می‌کند.",
+        "در سال‌های اخیر و با پیشرفت فن‌آوری سیستم جت‌فن به عنوان استاندارد جدیدی برای تهویه نرمال و تخلیه دود پارکینگ شناخته شده است. در واقع این سیستم جایگزین نوآورانه و خلاقانه‌تری نسبت به سیستم کانال می‌باشد."
+      ]
+    },
+    {
+      "id": "equipment",
+      "title": "تجهیزات سیستم کنترل دود پارکینگ",
+      "text": [
+        "فن‌های تخلیه دود مقاوم در برابر حریق",
+        "فن‌های تامین هوای تازه",
+        "تحمل افت فشار خارجی تا 50 پاسکال",
+        "جت‌فن‌های آکسیال یا سانتریفیوژ مقاوم در برابر حریق",
+        "دمپرهای دود موتوری",
+        "سنسورهای دود",
+        "پرده‌های دود بند",
+        "سیستم قدرت و کنترل"
+      ]
+    },
+    {
+      "id": "standards",
+      "title": "استانداردها",
+      "text": [
+        "تمام جت‌فن‌ها و فن‌های تخلیه دود دارای کلاس حرارتی F300 و F400 مطابق با EN 12101-3 می‌باشند.",
+        "همچنین کلیه مراحل طراحی تا راه‌اندازی که توسط ما ارائه می‌شوند کاملا مطابق با استانداردهای زیر ارائه می‌شود.",
+        "قابلیت سفارش گذاری بصورت مکش هوا از زیر یا از پشت دستگاه"
+      ]
+    },
+    {
+      "id": "pressureParts",
+      "title": "اجزای سیستم‌های فشار مثبت راه‌پله و آسانسور",
+      "text": [
+        "• فن‌های تامین هوای تازه",
+        "• دمپرهای دود موتوری",
+        "• بالانس دمپرهای تنظیم فشار",
+        "• دمپرهای دستی حجمی",
+        "• سنسورهای اختلاف فشار",
+        "• سیستم قدرت و کنترل"
+      ]
+    },
+    {
+      "id": "protection",
+      "title": "سیستم حفاظت از نفوذ دود",
+      "text": [
+        "کلیه مراحل طراحی تا راه‌اندازی که توسط ما ارائه می‌شوند کاملا مطابق با استانداردهای زیر ارائه می‌شود.",
+        "قابلیت سفارش گذاری بصورت مکش هوا از زیر یا از پشت دستگاه",
+        "شرکت رسام تجارت هواران به عنوان یکی از معدود شرکت‌های فعال در زمینه سیستم‌های مدیریت دود، امکان اجرای انواع پروژه‌های فشار مثبت راه‌پله و آسانسور به صورت EPC را دارا می‌باشد.",
+        "کارفرمایان ما تنها نقشه‌های معماری پروژه را در اختیار ما قرار می‌دهند ودر ادامه شرکت رسام تجارت هواران در تمامی مراحل طراحی، تامین، اجرا و راه‌اندازی سیستم کنترل دود در کنار شماست.",
+        "همچنین این قابلیت در مجموعه ما وجود دارد که به واسطه متخصصان زبده خود نگهداری سیستم‌های فشار مثبت را به عهده گیرد.",
+        "شرکت رسام تجارت هواران افتخار همکاری در زمینه ارائه راهکارهای جامع سیستم‌های فشار مثبت راه‌پله و آسانسور با شرکای جهانی خود را در موارد زیر داراست.",
+        "فن‌های تامین هوای تازه:",
+        "• کمپانی BLAUBERG آلمان",
+        "• برند Havaran ایران",
+        "دمپرهای دود:"
+      ]
+    }
+  ],
+  "images": {
+    "hero": "/images/pages/smoke/hero.png",
+    "parking": "/images/pages/smoke/1.jpg",
+    "pressure": "/images/pages/smoke/2.png",
+    "jet": "/images/pages/smoke/jet.png",
+    "cfd": "/images/pages/smoke/cfd.jpg",
+    "extract": "/images/pages/smoke/extract.jpg",
+    "positive1": "/images/pages/smoke/positive-1.jpg",
+    "positive2": "/images/pages/smoke/positive-2.jpg",
+    "composite": "/images/pages/smoke/composite.png",
+    "corridor": "/images/pages/smoke/corridor.jpg",
+    "atrium": "/images/pages/smoke/atrium.png"
+  }
+}

src/data/extracted/tunnel.json

@@ -0,0 +1,24 @@
+{
+  "intro": [
+    "فن های تونلی و جت فن‌های شرکت رسام تجارت هواران با تأمین هوای تازه در تونل‌های درحال ساخت عملکرد خود را در هنگام ساخت تونل نشان می دهند و پس از ساخت، سیستم تهویه ما کیفیت هوا را در داخل تونل ها کنترل می کند و در صورت آتش سوزی، گازهای دودزا و گرما را مسیرهای فرار از دور نگه می دارد.",
+    "متن ستیت"
+  ],
+  "supply": [
+    "ما طیف گسترده ای از محصولات را تامین می کنیم تا بسته مناسبی برای راه حل های تهویه به شما ارائه دهیم. نمونه کارهای ما شامل فن‌های آکسیال برگشت پذیر و جت فن های تونلی با کلاس F250، F300 و F400 برند DLK Ventilatoren کشور آلمان، صدا خفه کن ، دمپر تونل ، اینورتر ، کانال داکتینگ و انعطاف پذیر ( نسخه ATEX در صورت نیاز)، دمپر آتش و سیستم فشار برای مسیرهای فرار است. همچنین تمام محصولات ما دارای گواهینامه صحت عملکرد از مراجع و آزمایشگاه های معتبری همچون TUV، BSI، APPLUS و ... می باشند.",
+    "متن ستیت"
+  ],
+  "service": [
+    "ما در رسام تجارت هواران به انتخاب محصولات با کیفیت خود افتخار می کنیم. علاوه بر تست های آزمایشگاهی مقدماتی و راه اندازی در محل ، خدمات ما شامل تجزیه و تحلیل CFD و نظارت بر سیستم تهویه در حین کار است."
+  ],
+  "metro": [
+    "حمل و نقل زیرزمینی و سیستم های ریلی روز به روز بیشتر می شوند زیرا امکان حمل و نقل سریع تعداد زیادی از مسافران و بارها را فراهم می کنند. شبکه قطارهای سریع السیر و همچنین خطوط ریلی استاندارد به منظور کاهش تأثیرات زیست محیطی عموما به تونل های زیرزمینی منتقل می شوند.",
+    "هر دو این کاربری ها به تهویه نیازمند اند. در متروها هجوم تعداد زیادی از مردم و تردد قطارها باعث کاهش اکسیژن و افزایش گرما و آلاینده ها می شود. از این رو تهویه مکانیکی مناسب برای دستیابی به تبادل هوای لازم و فراهم کردن شرایط راحت به مسافران سیستم های قطار زیرزمینی مورد نیاز است. سیستم های تهویه هدف دوم و حتی مهم تری نیز دارند و آن تضمین ایمنی در موارد اضطراری آتش سوزی می باشد. به منظور ایجاد یک محیط ایمن برای فرار، استفاده از تهویه مکانیکی هم در تونل ها و هم در ایستگاه ها ضروری می باشد زیرا در این شرایط، کنترل انتشار دود و ایجاد مناطق امن و محیط شفاف برای مسافران و نیروهای خدمات بسیار مهم است."
+  ],
+  "road": [],
+  "modes": [],
+  "images": {
+    "hero": "/images/pages/tunnel/hero.jpg",
+    "metro": "/images/pages/tunnel/metro.png",
+    "schematic": "/images/pages/tunnel/schematic.png"
+  }
+}

src/data/f300.ts

@@ -0,0 +1,311 @@
+export type F300Accordion = { title: string; items: string[] };
+
+export type F300Block = {
+  id: string;
+  title: string;
+  intro: string[];
+  image: string;
+  imageAlt: string;
+  isPng: boolean;
+  accordion?: F300Accordion[];
+};
+
+export const f300Intro = {
+  title: "محصولات F300",
+  text: [
+    "در پارکینگهای بسته که امکان تهویه طبیعی میسر نیست، تهویه مکانیکی ضرورت می‌یابد. درهمین راستا سازمان آتش نشانی اقدام به تدوین ضوابطی تحت عنوان “ضوابط ملاک عمل سامانه های تهویه، تخلیه و کنترل دود” نموده است که طبق بند 2-2 آن، کلیه ساختمانهایی که تعداد زیرزمینهای آنها 3طبقه و بیشتر باشد و یا مساحت ناخالص هرطبقه از زیرزمینهای آنها بیش از 500 متر مربع باشد، ملزم به اجرای شرایط این دستورالعمل می‌باشند.",
+    "تهویه مکانیکی پارکینگ به 2 روش کانال کِشی و استفاده از جِت فَن میتواند انجام گیرد که امروزه استفاده از جِت فَن در اغلب پروژه‌ها بخاطر مزایای زیر رایج است.",
+  ],
+  benefits: [
+    "حذف کانال در فضای پارکینگ",
+    "امکان کاهش ارتفاع پارکینگ",
+    "صرفه‌جویی در انرژی",
+    "حذف نقاط کور تهویه‌نشده در سیستم کانال‌کِشی",
+    "کنترل هوشمند",
+    "کاهش هزینه‌ها در مدت زمانِ کوتاه (زمان بازگشت سرمایه)",
+  ],
+  image: "/images/pages/f300/hero.jpg",
+};
+
+export const f300Blocks: F300Block[] = [
+  {
+    id: "axial-jet",
+    title: "محصولات F300 – جت فن آکسیال (Axial/Impulse Jet Fan)",
+    intro: [
+      "جِت فَن یک نوع فن است که به کمک آن هوای تازه تزریق شده بداخل پارکنیگ بصورت کامل به تمامی نقاط و زوایای پارکینگ رسیده و جریانی هارمونیک را بوجود می‌آورد تا درنهایت هوای آلوده به مونوکسید کربن بوسیله فَنهای تخلیه دود که بنام فَنهای تخلیه نامیده میشوند به خارج از پارکینگ هدایت و تخلیه شوند.",
+      "جت فَنهای آکسیال یکطرفه بصورت تَک دُور یا دو دور مناسب برای هوای معمولی (تا ۵۵ درجه سانتیگراد) و یا مناسب برای محیطهای داغ تا ۳۰۰ درجه سانتیگراد برای دو ساعت.",
+      "جِت فَنهای آکسیال دوطرفه بصورت تک دور یا دو دور مناسب برای هوای معمولی (تا ۵۵ درجه سانتیگراد) و یا مناسب برای محیطهای داغ تا ۳۰۰ درجه سانتیگراد برای ۲ ساعت.",
+      "جت فنهای آکسیال بصورت مَکش از پشت و پرتاب از جلو می‌باشد این فنها دارای ۲ صداگیر بصورت استاندارد در عقب و جلو می‌باشد.",
+      "جت فنهای آکسیال به نامهای داکت فَنها، فَنهای بین لوله‌ای و فنهای بین کانالی شناخته میشوند.",
+    ],
+    image: "/images/pages/f300/axial-jet.png",
+    imageAlt: "جت فن آکسیال",
+    isPng: true,
+    accordion: [
+      {
+        title: "کاربرد",
+        items: [
+          "جِت فَنهای آکسیال سِری BLAUBERG Axis-Jet با هدف کلیِ تهویه پارکینگهای زیرزمینی، پارکینگهای بسته و نیمه‌باز و تهویه تونلها بعنوان بخشی از سیستم تخلیه دود طراحی شده اند.",
+          "این جت فَنها جهت ایجاد جریان هوا با سرعت و فشار بالا طراحی شده اند.",
+        ],
+      },
+      {
+        title: "ساختار",
+        items: [
+          "جت فَنهای BLUABERG Axis-Jet ساخته شده از فولاد با پوشش پُلیمر و دارای طراحی لوله‌ای",
+          "جت فَن‌ها دارای عایق صوتی از پشم سنگ (Silencer) در دو سر جِت فن",
+          "بدنه دارای دمپر داخلی جهتِ حذف ارتعاشات موتور و پروانه",
+          "مجهز به تیغه های هدایت جریانِ هوا جهت توزیع یک‌نواخت جریان هوا. (این مهم راندمان آیرودینامیکی جِت فَن را بصورت محسوس افزایش می‌دهد)",
+        ],
+      },
+      {
+        title: "مدل ها",
+        items: [
+          "یک‌جهته و یک‌سرعته (تیپ U)",
+          "یک‌جهته دوسرعته ( تیپ U2)",
+          "دوجهته تک‌سرعته (تیپ R)",
+          "دوجهته دوسرعته (تیپ R2)",
+          "قابلیت سفارش تمام مدلهای فوق با استانداردهای F300 و F400",
+          "دارای گواهینامه BSI تا قطر 630 میلیمتر و تراست 332 نیوتن",
+        ],
+      },
+      {
+        title: "موتور (Engine)",
+        items: [
+          "موتور از نوع 3 فاز آسنکرون و نصب در داخل مَحفظه فن",
+          "دارای درجه حفاظت IP55",
+          "طراحی خاص موتور جهتِ تضمینِ عملکرد جِت فَن در زمان تخلیۀ دود در دوحالت یک‌جَهته و دوجَهته",
+          "طراحیِ موتور جهت بهینه ترین عملکرد با ولتاژ 400 V و فرکانس 50 Hz",
+        ],
+      },
+      {
+        title: "ایمپلر",
+        items: [
+          "ایمپلر ساخته‌شده از آلومینیوم ریختگی بصورت استاتیکی و دینامیکی بالانس شده است.",
+          "دارای ایمپلر دوجَهته در مدلهای دوجهته که عملکرد معکوس را بصورت صددرصد تضمین میکند.",
+        ],
+      },
+      {
+        title: "نصب",
+        items: [
+          "جت فَنهای BLAUBERG Axis-Jet برای نصب افقی در زیر سقف طراحی شده و با استفاده از تیغه های توزیعِ هوا به بهترین شکل جریان هوا را هدایت میکند.",
+        ],
+      },
+    ],
+  },
+  {
+    id: "centrifugal-jet",
+    title: "محصولات F300 – جت فَن سانتریفیوژ (Centrifugal/Induction Jet Fan)",
+    intro: [
+      "جت‌فَن یک نوع فن است که به کمک آن هوای تازه تزریق‌شده بداخل پارکنیگ بصورت کامل به تمامی نقاط و زوایای پارکینگ رسیده و جریانی هارمونیک را بوجود می‌آورد تا در نهایت هوای آلوده به مونوکسید کربن بوسیله فنهای تخلیه دود که بنام فنهای تخلیه نامیده میشوند به خارج از پارکینگ هدایت و تخلیه شود.",
+      "جت فنهای سانتریفیوژ بصورت تَک‌دُور و دو دُور مناسب برای هوای معمولی (تا ۵۵ درجه سانتیگراد) و یا مناسب برای محیطهای داغ تا ۳۰۰ درجه سانتیگراد برای دو ساعت.",
+      "جت فنهای سانتریفیوژ بصورت مَکش از پایین و پرتاب از جلو می‌باشد. این فنها بدلیل صدای پایین تولید شده و احتیاج به صداگیر ندارند.",
+    ],
+    image: "/images/pages/f300/centrifugal-jet.png",
+    imageAlt: "جت فن سانتریفیوژ",
+    isPng: true,
+    accordion: [
+      {
+        title: "کاربرد",
+        items: [
+          "جت فنهای سانتریفیوژ سری BLAUBERG Centro-Jet با هدف کلی تهویه پارکینگهای زیرزمینی، پارکینگهای بسته و نیمه‌باز و تهویه تونلها بعنوان بخشی از سیستم تخلیه دود طراحی شده.",
+          "این جت فنها جهت ایجاد جریان هوا با سرعت و فشار بالا طراحی شده‌اند.",
+        ],
+      },
+      {
+        title: "ساختار",
+        items: [
+          "جت فنهای BLUABERG Centro-Jet ساخته‌شده از فولاد با پوشش پلیمر و دارای طراحی لوله‌ای",
+          "جت فنها دارای عایق صوتی از پشم سنگ (Silencer) در دو سر جِت فن",
+          "بدنه دارای دمپر داخلی جهت حذف ارتعاشات موتور و پروانه",
+          "مجهز به تیغه های هدایت جریان هوا جهت توزیع یک‌نواخت جریان هوا. (این مهم راندمان آیرودینامیکی جت فن را بصورت محسوس افزایش می‌دهد.)",
+        ],
+      },
+      {
+        title: "مدل ها",
+        items: [
+          "یک جهته و یک سرعته (تیپ U)",
+          "یک جهته دو سرعته (تیپ U2)",
+          "قابلیت سفارش تمام مدلهای فوق با استانداردهای F300 و F400",
+          "دارای گواهینامه BSI در ظرفیتهای 50، 75 و 100 نیوتن",
+        ],
+      },
+      {
+        title: "موتور",
+        items: [
+          "موتور از نوع سه فاز آسنکرون و نصب در داخل محفظه فن",
+          "دارای درجه حفاظت IP55",
+          "طراحی موتور جهت بهینه‌ترین عملکرد با ولتاژ 400 V و فرکانس 50 Hz",
+        ],
+      },
+      {
+        title: "ایمپلر",
+        items: [
+          "ایمپلر ساخته شده از آلومینیوم ریختگی بصورت استاتیکی و دینامیکی بالانس شده است",
+        ],
+      },
+      {
+        title: "نصب",
+        items: [
+          "جت فنهای BLAUBERG Centro-Jet برای نصب افقی در زیر سقف طراحی شده و با استفاده از تیغه های توزیع هوا به بهترین شکل جریان هوا را هدایت میکند.",
+        ],
+      },
+    ],
+  },
+  {
+    id: "fresh-air",
+    title: "محصولات F300 – فن تامین هوای تازه (Axial Fresh Air Fan)",
+    intro: [
+      "غالبا در این سیستم از فنهای آکسیال فشار متوسط (تا ۱۰۰۰ پاسکال) استفاده میشود. این نوع فنها هوای تازه را برای هر طبقه از پارکینگ تامین می‌نمایند. محل جاگذاری فنها غالباً در هر طبقه و یا در ابتدای شفت ورود هوای تازه پارکینگ می‌باشد. بسته به نوع طراحی فنها میتوانند تَک دور و دو دور یا همراه با اینوِرتر باشد، از آنجا که این نوع فنها فقط با هوای تازه در تماس میباشند نیاز به مقاومت در برابر حرارت نداشته و حداکثر تا دمای ۵۵ درجه سانتیگراد را تحمل میکنند.",
+    ],
+    image: "/images/pages/f300/fresh-air.png",
+    imageAlt: "فن تامین هوای تازه",
+    isPng: true,
+    accordion: [
+      {
+        title: "کاربرد",
+        items: [
+          "فنهای BLAUBERG Axis-P بعنوان بخشی از سیستم مدیریت دود جهت تامین هوای تازه پارکینگ و یا تامین فشار مثبت در سیستمهای فشار مثبت راه پله، لابیهای فشار مثبت و یا سیستم فشار مثبت آسانسور به کار میرود. این فنها در سیستم مدیریت دود برای جلوگیری از نفوذ دود به سایر فضاها، محافظت از انسانها در فضاهای امن و یا ایجاد مسیری عاری از دود برای آتش نشانان مورد استفاده قرار میگیرد.",
+          "فنهای BLAUBERG Axis-P برای تهویه عمومی و تهویه صنعتی نیز راهکاری بسیار مناسب است.",
+        ],
+      },
+      {
+        title: "ساختار",
+        items: [
+          "فنهای BLUABERG Axis-P ساخته‌شده از فولاد و فلنچ های نورد شده جهت دستتیابی به حداکثر مقاومت مکانیکی است. در ساخت این فن حداقل فاصله بین ایمپلر و بدنه جهت دستیابی به حداکثر راندمان وجود دارد و جهت تعمیر و نگهداری از دریچه بازدید مناسب استفاده شده است.",
+          "تمامی بدنه توسط پوشش مناسب جهت جلوگیری از خوردگی پوشش دهی شده.",
+          "توانایی ایجاد جریان هوا تا دبی 113،000 متر مکعب بر ساعت",
+        ],
+      },
+      {
+        title: "مدل ها",
+        items: [
+          "یک سرعته (تیپ U)",
+          "دو سرعته ( تیپ U2)",
+          "قابلیت سفارش از قطر 350 تا 1250 میلیمتر",
+        ],
+      },
+      {
+        title: "موتور",
+        items: [
+          "موتور از نوع سه فاز آسنکرون در انواع 2، 4، 6 و 8 پل",
+          "موتور با راندمان IE3",
+          "دارای درجه حفاظت IP55",
+          "طراحی موتور جهت بهینه‌ترین عملکرد با ولتاژ 400 V و فرکانس 50 Hz",
+        ],
+      },
+      {
+        title: "ایمپلر",
+        items: [
+          "بر مبنای نرخ جریان هوای درخواستی فنهای BLAUBERG Axis-P به 6 یا 8 پره با زاویه حمله 20 تا 50 درجه که قابلیت تغییر زاویه حمله بین 2.5 تا 5 درجه را دارد مجهز شود. این قابلیت تغییر زاویه حمله امکان تغییر ظرفیت فن را جهت دستیابی به نقطه کار دلخواه فراهم میکند.",
+          "ساختار خاص ایمپلر فنهای BLAUBERG Axis-P قابلیت دستیابی به بالاترین راندمان فن درعین حال کمترین صدای ممکن را مهیا میکند.",
+          "ایمپلر استفاده شده از دو نوع پلی آمید یا آلومینیوم ریختگی است.",
+        ],
+      },
+      {
+        title: "نصب",
+        items: [
+          "فنهای BLAUBERG Axis-P قابلیت نصب در هر سطح صاف و یا نصب عمودی در داخل شفت را دارا میباشد.",
+        ],
+      },
+    ],
+  },
+  {
+    id: "smoke-extract",
+    title: "محصولات F300 – فن تخلیه دود (Axial Smoke Extraction Fan)",
+    intro: [
+      "فنهای تخلیه هوای پارکینگ از نوع فنهای آکسیال فشار متوسط (تا ۱۰۰۰ پاسکال) انتخاب میشوند. این فنها هوای آلوده همراه با CO را از هرطبقه از پارکینگ مَکش و از طریق شفت اختصاص‌یافته به تخلیه هوای پارکینگ به خارج از ساختمان منتقل میکنند. لازم بذکر است که شفت تخلیه هوای پارکینگ باید کاملاً ایزوله‌شده بوده به نحوی که هوای تخلیه‌شده امکان ورود بداخل ساختمان را نداشته باشد. این موضوع به علت وقوع آتش سوزی احتمالی در داخل پارکینگ در نظر گرفته میشود. به همین علت نیز این فنها می‌بایست قابلیت تخلیه هوا تا دمای ۳۰۰، ۴۰۰ یا ۶۰۰ درجه سانتیگراد برای مدت دو ساعت را داشته باشند، بسته به نوع طراحی فنها میتوانند تَک‌دُور و یا دو دور یا همراه با اینوِرتِر انتخاب شوند.",
+    ],
+    image: "/images/pages/f300/smoke-extract.png",
+    imageAlt: "فن تخلیه دود",
+    isPng: true,
+    accordion: [
+      {
+        title: "کاربرد",
+        items: [
+          "فنهای BLAUBERG Axis-FP بعنوان بخشی از سیستم مدیریت دود جهت تخلیه دود در مواقع حریق و یا تهویه معمولی در دیگر مواقع مورد استفاده قرار میگیرد.",
+          "فنهای BLAUBERG Axis-FP دارای رنج مقاومت در برابر حرارت 300 یا 400 درجه سانتیگراد به مدت 2 ساعت و قابلیت عملکرد در دمای 60- تا 50+ بصورت مداوم هستند.",
+        ],
+      },
+      {
+        title: "ساختار",
+        items: [
+          "فنهای BLUABERG Axis-FP شامل بدنه، ایمپلر و موتور هستند و ساخته‌شده از فولاد و فلنچ های نورد شده جهت دستتیابی به حداکثر مقاومت مکانیکی میباشد. در ساخت این فن حداقل فاصله بین ایمپلر و بدنه جهت دستیابی به حداکثر راندمان وجود دارد و جهت تعمیر و نگهداری از دریچه بازدید مناسب استفاده شده است.",
+          "تمامی بدنه توسط پوشش مناسب جهت جلوگیری از خوردگی پوشش‌دهی شده.",
+          "توانایی ایجاد جریان هوا تا دبی 114،000 متر مکعب بر ساعت",
+        ],
+      },
+      {
+        title: "مدل ها",
+        items: [
+          "یک سرعته (تیپ U)",
+          "دو سرعته ( تیپ U2)",
+          "قابلیت سفارش از قطر 350 تا 1250 میلیمتر",
+        ],
+      },
+      {
+        title: "موتور",
+        items: [
+          "موتور از نوع سه فاز آسنکرون در انواع 2، 4، 6 و 8 پل",
+          "موتور با راندمان IE3",
+          "دارای درجه حفاظت IP55",
+          "طراحی موتور جهت بهینه‌ترین عملکرد با ولتاژ 400 V و فرکانس 50 Hz",
+        ],
+      },
+      {
+        title: "ایمپلر",
+        items: [
+          "بر مبنای نرخ جریانهای درخواستی فنهای BLAUBERG Axis-FP به 4، 6، 8، 10 و یا 12 پره با زاویه حمله 20 تا 50 درجه که قابلیت تغییر زاویه حمله بین 2.5 تا 5 درجه را دارد مجهز شود. این قابلیت تغییر زاویه حمله امکان تغییر ظرفیت فَن را جهت دستیابی به نقطه کار دلخواه فراهم میکند.",
+          "ساختار خاص ایمپلر فَنهای BLAUBERG Axis-FP قابلیت دستیابی به بالاترین راندمان فَن در عین حال کمترین صدای ممکن را مهیا میکند.",
+          "ایمپلر این فنها بصورت دینامیکی و استاتیکی بالانس شده، دارای وزن کم بوده که این مهم زمانِ راه‌اندازیِ فن را بصورت قابل توجهی کاهش میدهد.",
+          "ایمپلر استفاده‌شده از نوع آلومینیوم ریختگی میباشد.",
+        ],
+      },
+    ],
+  },
+  {
+    id: "co-detection",
+    title: "محصولات F300 – سیستم تشخیص مونوکسید کربن",
+    intro: [
+      "سیستم تشخیص دود شامل تعدادی از سنسور های مونوکسید کربن می‌باشد که به همراه سایر اجزا و قطعات سیستم تشخیص دود و همچنین در کنار تابلو برق، طراحی سیستم تهویه پارکینگ را هوشمند میسازد. وجود سیستم تشخیص دود به ما این امکان را میدهد تا از ظرفیت تهویه پارکینگ به میزان مورد نیاز استفاده نماییم. عدمِ وجود سیستم تشخیص دود بمعنی عدمِ کارکرد سیستم تهویه پارکینگ نیست بلکه امکان هوشمند بودن سیستم تهویه پارکنیگ را از بین میبرد.",
+      "سنسور و ترنسمیتر دود برند SENSE",
+      "تغذیه: 24VDC",
+      "بازه اندازه گیری: (PPM) 50, 100, 300, 1000",
+      "خروجی: 0-10 VDC, 0-5VDC, 4-20 mA",
+      "دارای قابلیت سفارش همراه با LCD، Modbus RS485 و رله",
+      "نصب سریع و آسان",
+      "کاربرد: اندازه‌گیری سطح CO در پارکینگها و فضاهای کاربردی",
+      "دقت عملکرد: حداقل %3",
+      "گستره وسیعی از تجهیزات جانبی، دارای انواع دیواری و کانالی",
+    ],
+    image: "/images/pages/f300/co-detection.png",
+    imageAlt: "سیستم تشخیص مونوکسید کربن",
+    isPng: true,
+  },
+  {
+    id: "control-panel",
+    title: "محصولات F300 – تابلو برق و کنترل (MCC & PLC CONTROL PANEL)",
+    intro: [
+      "تابلو برقها در حقیقت مغز این سیستم بوده و براساس طراحی سیستم تهویه پارکینگ طراحی و ساخته میشوند. تابلو برقها با اتصال جِت فَنها، فَنهای تخلیه و تامین هوا و سیستم تشخیص دود به یکدیگر از یک طرف و در کل با امکان اتصال به سیستم BMS میتواند امکان نظارت بر نحوه کارکرد هر چه بهتر سیستم تهویه پارکینگ را برای کاربر فراهم کند.",
+      "تابلو سیستمِ تخلیه دودِ پارکینگ از چند زیرسیستم متفاوت تشکیل شده.",
+      "سیستم PLC که در حقیقت مغز و شاکله سیستم برق و کنترل می‌باشد و تمامی فرماندهی به محصولات مکانیکال از طریق PLC انجام میشود. در سیستم کنترل شرکت هواران از PLCهای سری Modicon برند اشنایدر استفاده می‌شود",
+      "سیستم فرمان که شامل درایو ها و کنتاکتورها و رله ها بوده که ساختمان این سیستم وابسته به مختصات و مشخصات پروژه می‌باشد. در این خصوص کارشناسان شرکت هواران با برگزاری جلسات فنی با کارفرمای محترم نسبت به ارائه بهترین راهکار اقدام خواهد کرد و تجهیزات مورد استفاده در تابلو را مطابق با نیاز کارفرما از برند های زیمنس، اشنایدر، هیمل، آگر و دیگر برند های اورجینال بازار پیشنهاد خواهند داد.",
+    ],
+    image: "/images/pages/f300/control-panel.jpg",
+    imageAlt: "تابلو برق و کنترل",
+    isPng: false,
+  },
+  {
+    id: "cfd",
+    title: "محصولات F300 – دینامیک سیالات محاسباتی (CFD)",
+    intro: [
+      "نمایشِ سیستم تخلیه دود توسط مدلسازی CFD انجام میگردد. مدلسازی دود تکنیکی برای شبیه‌سازی رفتار دود در آتش سوزی می‌باشد.",
+      "در برخی از انواع ساختمان مثل یک مرکز خرید یا ساختمانی با یک آتریوم، مدلسازی دود ممکن است بعنوان بخشی از فرآیند طراحی استاندارد لازم باشد. در انواع دیگر، مدلسازی دود ممکن است بعنوان بخشی از توجیه مهندسی آتش برای یک ساختمان استفاده شود (مثلاً توجیه فواصل تردد بیش از الزامات مقرراتی).",
+      "مدلسازی دود CFD رویکردی بسیار متفاوت است. اساس این تکنیک اینست که فضایی که مدل میشود، داخل برنامه کامپیوتری ساخته میشود، که در آن فضا به تعداد زیادی سلولهای منفرد تقسیم میشوند (بطور نمونه صدها هزار). سپس برنامه کامپیوتری قوانین بنیادی فیزیک و جریان سیال را برای آنالیز جریان هوا و دود میان هر سلول، برای کل دوره آتش سوزی به کار میبرد.",
+    ],
+    image: "/images/pages/f300/cfd.jpg",
+    imageAlt: "دینامیک سیالات محاسباتی",
+    isPng: false,
+  },
+];
+

src/data/fancoil.ts

@@ -0,0 +1,113 @@
+export type ProductAccordion = { title: string; items: string[] };
+
+export const fancoilIntro = {
+  title: "فـن کویـل",
+  titleEn: "Fan Coil",
+  text: [
+    "فن کویلهای شرکت هواران با در نظر گرفتن عملکرد بهینه و افزایش راندمان با تکیه بر کاهش آلودگی صوتی که فاکتور بسیار مهمی در آرامش ساکنان ساختمان میباشد، در چهار مدل زیر ارائه میشوند.",
+  ],
+};
+
+export const fancoilBlocks = [
+  {
+    id: "ceiling",
+    title: "فن کویل سقفی توکـار",
+    intro: [
+      "فَن کویلهای سقفیِ توکار هواران در رنج ظرفیت 200 الی 1200 فوت مکعب بردقیقه برپایه نیاز ساختمانهای امروزی طراحی و ساخته شده‌اند. فَن کویل سقفیِ توکار، یک سیستم تهویه مطبوع است که در ساختمانها برای سرمایش و گرمایش هوا استفاده میشود. این سیستم شامل یک واحد فن است که در سقف ساختمان نصب میشود. عملکرد اصلی فن‌کویل سقفی توکار بر اساس یک سیستم تبادل حرارت با آب است. در داخل واحد فن کویل، یک پکیج هوایی قرار دارد که شامل یک فن برای جابجایی هوا، یک کویل سرد کننده (کویل تبرید) و یک کویل گرم کننده است. این کویلها با استفاده از آب سرد یا آب گرم، هوا را سرد یا گرم می‌کنند.",
+      "دو نوع فن کویل از نظر دو لوله‌ای یا چهار لوله‌ای: فن کویل سقفی توکار دولوله‌ای و فن کویل کاستی چهارلوله‌ای.",
+    ],
+    specs: [
+      "استفاده از کویل با فین آلومینیومی هیدروفیلیک (بلوفین) و لوله مسی با راندمان بالا و طراحی دقیق برپایه اصول انتقال حرارت و مبدل Fin & Tube",
+      "استفاده از فن سانتریفیوژ با بالانس استاتیکی و دینامیکی و الکتروموتور سه سرعته با کمصدا ترین حالت ممکن",
+      "تحمل افت فشار خارجی تا 30 پاسکال",
+      "استفاده از فیلتر آلومینیومی و قابل شستشو با دسترسی آسان",
+      "ساخت مقاوم و با استحکام بالا جهت افزایش طول عمر دستگاه",
+      "سینی تخلیه (Drain) با ابعاد بزرگ برای پوشش دادن فضای زیر فن کویل و شیرآلات متصل",
+      "قابلیت سفارش به صورت Coated با رنگ بدنه الکترواستاتیک کوره‌ای",
+    ],
+    image: "/images/pages/fancoil/Jt2uTJnoom.png",
+    imageAlt: "فن کویل سقفی توکار",
+    isPng: true,
+  },
+  {
+    id: "duct",
+    title: "فن کویل کانالـــــی",
+    intro: [
+      "فن کویلهای کانالیِ هواران در رنج ظرفیت 600 الی 2000 فوت مکعب بردقیقه برپایه نیاز ساختمانهای امروزی طراحی و ساخته شده‌اند. سیستم کانالی شامل یک شبکه از لوله ها و کانال‌های هواست که در دیواره‌ها ، سقف و کف ساختمان نصب میشود. این کانال‌ها هوای خنک و گرم را به سراسر ساختمان منتقل میکنند. هوای تازه از طریق سیستم تهویه مطبوع به ساختمان وارد میشود و هوای آلوده و دود را از داخل ساختمان خارج میکند.",
+    ],
+    specs: [
+      "استفاده از کویل چهار ردیفه با فین آلومینیومی هیدروفیلیک (بلوفین) و لوله مسی با راندمان بالا و طراحی دقیق براساس اصول انتقال حرارت و مبدل Fin & Tube",
+      "استفاده از فن سانتریفیوژ فلزی با بالانس استاتیکی و دینامیکی و الکتروموتور سه سرعته با کم صداترین حالت ممکن",
+      "تحمل افت فشار خارجی تا 50 پاسکال",
+      "استفاده از فیلتر آلومینیومی و قابل شستشو با دسترسی آسان",
+      "ساخت مقاوم و با استحکام بالا جهت افزایش طول عمر دستگاه",
+      "سینی تخلیه (Drain) با ابعاد بزرگ برای پوشش دادن فضای زیر فن کویل و شیرآلات متصل",
+      "قابلیت اتصال کانال از هر دو طرف",
+      "قابلیت سفارش گذاری بصورت مکش هوا از زیر یا از پشت دستگاه",
+    ],
+    image: "/images/pages/fancoil/HDlbJ02t1d.png",
+    imageAlt: "فن کویل کانالی",
+    isPng: true,
+  },
+  {
+    id: "floor",
+    title: "فن کویل زمینی",
+    intro: [
+      "فن کویل های زمینیِ هواران در رنج ظرفیت 200 الی 1200 فوت مکعب بر دقیقه بر اساسِ نیاز ساختمانهای امروزی ساخته و طراحی شده‌اند.",
+    ],
+    specs: [
+      "استفاده از کویل سه یا چهار ردیفه با فین آلومینیومی هیدروفیلیک (بلوفین) و لوله مسی با راندمان بالا و طراحی دقیق بر اساس اصول انتقال حرارت و مبدل Fin & Tube",
+      "استفاده از فن سانتریفیوژ فلزی با بالانس استاتیکی و دینامیکی و الکتروموتور سه سرعته با کم صداترین حالت ممکن",
+      "تحمل افت فشار خارجی تا 30 پاسکال",
+      "ساخت مقاوم و با استحکام بالا جهت افزایش طول عمر دستگاه",
+      "استفاده از فیلتر آلومینیومی و قابل شستشو با دسترسی آسان",
+    ],
+    image: "/images/pages/fancoil/F4AuvDLBB2.png",
+    imageAlt: "فن کویل زمینی",
+    isPng: true,
+  },
+  {
+    id: "cassette",
+    title: "فن کویل کاستی",
+    intro: [
+      "فن کویل کاستی هواران برای سرمایش و گرمایش فضا با نصب سقفی، کنترل آسان دما و جریان هوا از طریق ریموت کنترل طراحی و ساخته می‌شود.",
+    ],
+    specs: [
+      "استفاده از کویل سه ردیفه با فین آلومینیومی هیدروفیلیک (بلوفین) و طراحی دقیق بر اساس اصول انتقال حرارت و مبدل Fin & Tube",
+      "استفاده از فن سانتریفیوژ با بالانس استاتیکی و دینامیکی و الکتروموتور سه سرعته با کم صداترین حالت ممکن",
+      "تحمل افت فشار خارجی تا 30 پاسکال",
+      "استفاده از فیلتر آلومینیومی و قابل شستشو با دسترسی آسان",
+      "ساخت مقاوم و با استحکام بالا جهت افزایش طول عمر دستگاه",
+      "استفاده از عایق حرارتی فوم با تراکم بالا",
+      "قابلیت اتصال کانال از هر دو طرف",
+      "مجهز به ریموت کنترل جهت تنظیم درجه حرارت، دور موتور و دریچه‌های خروجی هوا",
+    ],
+    image: "/images/pages/fancoil/KORewFcBQF.png",
+    imageAlt: "فن کویل کاستی",
+    isPng: true,
+  },
+] as const;
+
+export const fancoilFaq: ProductAccordion[] = [
+  {
+    title: "فن کویل چیست؟",
+    items: [
+      "فن کویل یک سیستم سرمایشی و گرمایشی برای ساختمان است. مکانیزم آن از فن و کویل تشکیل شده که آب گرم در زمستان و آب سرد در تابستان در کویلهای مسی و یا آلومینیومی آن جریان دارد. سرما و گرمای این آب به کمک یک فَن که جریان هوا را از لا به لای کویلها عبور می‌دهد به محیط می‌رسد. این گرما و سرمای انتقال‌یافته به ساختمان بدلیل جا به جایی دما بوسیله آب‌و‌هوا حالت مطبوعی داشته و با تبادل گرما و سرما دمای اتاق را به میزان دلخواه می‌رساند.",
+    ],
+  },
+  {
+    title: "انواع فن کویل را نام ببرید؟",
+    items: [
+      "فن کویل به چهار دسته: فن کویل سقفیِ توکـار، فن کویلِ کانالـــــی، فن کویلِ زمینی، فن کویلِ کاستی تقسیم میشود",
+    ],
+  },
+  {
+    title: "مزایای فن کویل چیست؟",
+    items: [
+      "قابلیت استفاده ساده و راحت",
+      "سرمایش و گرمایش به صورت همزمان",
+      "اشغال کمتر فضا",
+      "مصرف بهینه انرژی",
+    ],
+  },
+];

src/data/havaranFan.ts

@@ -0,0 +1,149 @@
+export type ProductAccordion = { title: string; items: string[] };
+
+export const havaranFanAxial = {
+  title: "فـــــن آکسیـــــال",
+  titleEn: "Axial Fan",
+  intro: [
+    "این محصولات دارای مصارف کاربردی بسیار وسیعی در صنعت، سیستم تهویه پارکینگ، ساختمان های مسکونی، آشپزخانه های صنعتی، سالن های تولیدی و بسیاری موارد دیگر است که سبب شده در شمار جایگاه پر تیراژ ترین فن های دنیا شناخته شوند. فن های محوری یا آکسیال در شرکت هواران بر دو نوع اصلی آکسیال بین کانالی و آکسیال دیواری، طراحی و ساخته می شود.",
+  ],
+};
+
+export const havaranFanCentrifugal = {
+  title: "فـــــن ســـــانتریفیوژ",
+  titleEn: "Centrifugal Fan",
+  intro: [
+    "فن های سانتریفیوژ شرکت هواران بر اساس ضوابط استاندارد روز دنیا و با راندمان بالا تولید می شوند. عموماً این دسته از فن ها برای تامین افت فشار بالا و با کاربری بعنوان دمنده یا مکنده ساخته می شوند.",
+    "که در سه دسته بکوارد، فوروارد و پلاگ فن تقسیم بندی میگردند.",
+  ],
+};
+
+export const havaranFanBlocks = [
+  {
+    id: "axial-duct",
+    group: "axial" as const,
+    title: "الف. آکسیـــــال کانالـــــی",
+    titleEn: "Axial Duct Fan",
+    intro: [
+      "فن های آکسیال کانالی دارای موارد استفاده گوناگونی است با این طراحی علاوه بر تامین دبی هوای نسبتاً بالا می توان به افت فشار نیز تا محدوده بالایی غلبه نمود.",
+      "این نوع فن بخصوص برای تامین هوای تازه در سیستم تهویه پارکینگ مورد استفاده قرار می گیرند که در مجموعه هواران با در نظر گرفتن راندمان حداکثری و بهینه بر اساس اعلام نیاز مشتری ساخته می شوند.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و دارای انواع مختلفی است که ساخت موارد بالا در مجموعه هواران مطابق با استاندارد های روز صورت می پذیرد.",
+    ],
+    specs: [
+      "قابلیت ساخت ابعاد پروانه از قطر 15 الی 110 سانتیمتر",
+      "قابلیت پوشش طیف وسیعی از کاربری های مختلف اداری، تجاری، مسکونی و صنعتی",
+      "قابلیت ساخت بدنه با انواع ورق فولاد بر اساس نیاز مشتری",
+      "سرعت چرخش فن بر اساس سرعت چرخش موتور: 900 ، 1400 ، 2900 دور بر دقیقه",
+      "محدوده تولید صدا 55 الی 100 دسی بل",
+      "قابلیت تحمل افت فشار تا 350 پاسکال",
+      "توانایی جابجایی هوا از 150 تا 40000 فوت مکعب بر دقیقه",
+    ],
+    image: "/images/pages/fan/axial-duct.png",
+    imageAlt: "فن آکسیال کانالی",
+    isPng: true,
+  },
+  {
+    id: "axial-wall",
+    group: "axial" as const,
+    title: "ب. آکسیـــــال دیـــــواری",
+    titleEn: "Axial Wall Mounted Fan",
+    intro: [
+      "فن های دیواری دارای تنوع بسیار گوناگونی است که در مجموعه هواران با در نظر گرفتن راندمان و شرایط مختلف نیازمندی مشتری طراحی می شوند.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و همچنین اتصال موتور به فن دارای انواع مختلفی است که موارد ذکر شده در مجموعه هواران مطابق با استاندارد های روز در این زمینه ساخته میشوند.در بسیاری از صنایع که در آن هوا دارای فشار بالایی نیست از هواکش آکسیال دیواری برای خنک سازی و نیز باز کردن نفس موتور های کارخانه نیز استفاده می شود.",
+    ],
+    specs: [
+      "قابلیت ساخت ابعاد پروانه از 15 الی 100 سانتیمتر",
+      "قابلیت پوشش طیف وسیعی از کاربری های مختلف اداری، تجاری، مسکونی و صنعتی",
+      "جنس پروانه استفاده شده عموماً از آلومینیوم ریختگی می باشد که در صورت سفارش از جنس استنلس استیل ، فولاد ST 37 CK 45 – و ورق های ضد سایش ساخته می شود.",
+      "قابلیت ساخت بدنه با انواع فولاد و یا گالوانیزه بر اساس نیاز مشتری",
+      "قابلیت اتصال موتور به پروانه بصورت مستقیم یا تسمه-پولی",
+      "سرعت چرخش فن بر اساس سرعت چرخش موتور: 900 ، 1400 ، 2900 دور بر دقیقه",
+      "محدوده تولید صدا 55 الی 100 دسی بل",
+      "توانایی جابجایی هوا از 150 تا 50000 فوت مکعب بر دقیقه",
+    ],
+    image: "/images/pages/fan/axial-wall.png",
+    imageAlt: "فن آکسیال دیواری",
+    isPng: true,
+  },
+  {
+    id: "backward",
+    group: "centrifugal" as const,
+    title: "الف. بکـــــوارد فن",
+    titleEn: "Backward Fan",
+    intro: [
+      "فن بکوراد از زیر مجموعه فن های سانتریفیوژ است و از پرکاربرد ترین فن های این نوع می باشد. فن بکوراد دارای تولید صدای بسیار پایین و راندمان بالایی است و بدلیل شکل پره ها بیشتر برای تخلیه هوا از آن استفاده می شود.",
+      "همچنین بدلیل فاصله زیاد پره ها از هم برای کاربری در هوای آلوده و (برای مثال جابجایی هوای آغشته به بخارات روغن در آشپزخانه) انتخاب مناسبی است.",
+      "برای دور فن در این نوع دستگاه ها محدودیتی وجود ندارد و با استفاده از بکارگیری پولی و تسمه می توان به گستره بزرگ تری از جابجایی هوا دست پیدا کرد.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و همچنین اتصال موتور به فن دارای انواع مختلفی است که موارد ذکر شده در مجموعه هواران مطابق با استاندارد های روز در این زمینه ساخته می شوند.",
+    ],
+    specs: [
+      "قابلیت ساخت ابعاد پروانه از 25 الی 150 سانتیمتر",
+      "قابلیت پوشش طیف وسیعی از کاربری های مختلف اداری، تجاری، مسکونی و صنعتی",
+      "جنس پروانه استفاده شده عموماً از جنس استنلس استیل، فولاد ST 37 CK 45 – و ورق های ضد سایش",
+      "امکان طراحی با یک (Single inlet) یا دو ورودی (Double inlet)",
+      "شفت استفاده شده از جنس استنلس استیل ۳۰۴ ، دارای تسمه B نخ دار کره ای و یاتاقانUCP یا SN می باشد.",
+      "قابلیت نصب انواع فیلترها و انواع دمپرها در مکش و دهانه خروجی فن",
+      "قابلیت ساخت بدنه با انواع فولاد و یا گالوانیزه بر اساس نیاز مشتری",
+      "قابلیت اتصال موتور به پروانه بصورت مستقیم (Direct) یا تسمه-پولی",
+    ],
+    image: "/images/pages/fan/backward.png",
+    imageAlt: "بکوارد فن",
+    isPng: true,
+  },
+  {
+    id: "forward",
+    group: "centrifugal" as const,
+    title: "ب. فـــــوروارد فن",
+    titleEn: "Forward Fan",
+    intro: [
+      "فن فوروارد از زیر مجموعه فن های سانتریفیوژ است و توانایی انتقال جریان هوای بالا با سرعت پایین را دارد و بدلیل شکل پره ها بیشتر برای دهش هوا از آن استفاده می شود.",
+      "بدلیل فاصله کم پره ها از هم برای کاربری در آلودگی کم انتخاب مناسبی است. برای دور فن در این نوع دستگاه ها محدودیتی وجود ندارد و با استفاده از بکارگیری پولی و تسمه می توان به گستره بزرگ تری از جابجایی هوا دست پیدا کرد.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، موارد مورد استفاده در ساخت پروانه و بدنه فن و همچنین اتصال موتور به فن دارای انواع مختلفی است که موارد ذکر شده در مجموعه هواران مطابق با استاندارد های روز در این زمینه ساخته می شوند.",
+    ],
+    specs: [
+      "قابلیت ساخت ابعاد پروانه از 25 الی 100 سانتیمتر",
+      "قابلیت استفاده بعنوان مکنده و دمنده",
+      "جنس پروانه استفاده شده عموماً از جنس استنلس استیل، فولاد ST 37 CK 45 – و ورق های ضد سایش",
+      "شفت استفاده شده از جنس استنلس استیل ۳۰۴، دارای تسمه B نخ دار کره ای و یاتاقانUCP یا SN می باشد.",
+      "قابلیت نصب انواع فیلترها و انواع دمپرها در مکش و دهانه خروجی فن",
+      "قابلیت ساخت بدنه با انواع فولاد و یا گالوانیزه بر اساس نیاز مشتری",
+      "قابلیت اتصال موتور به پروانه بصورت مستقیم یا تسمه-پولی",
+      "سرعت چرخش فن با استفاده از پولی-تسمه بصورت پیوسته نامحدود",
+    ],
+    image: "/images/pages/fan/forward.png",
+    imageAlt: "فوروارد فن",
+    isPng: true,
+  },
+  {
+    id: "plug",
+    group: "centrifugal" as const,
+    title: "ج. پلاگ فن",
+    titleEn: "Plug Fan",
+    intro: [
+      "پلاگ فن از زیرمجموعه فن‌های سانتریفیوژ است که برای تامین دبی هوای نسبتاً بالا و غلبه بر افت فشار در کاربری‌های صنعتی و مسکونی طراحی و ساخته می‌شود.",
+      "از لحاظ ابعاد پروانه فن، نوع موتور، مواد مورد استفاده در ساخت پروانه و بدنه فن و همچنین اتصال موتور به فن دارای انواع مختلفی است که در مجموعه هواران مطابق با استانداردهای روز ساخته می‌شود.",
+    ],
+    specs: [
+      "قابلیت ساخت ابعاد پروانه از 25 الی 100 سانتیمتر",
+      "قابلیت پوشش طیف وسیعی از کاربری های مختلف صنعتی و مسکونی",
+      "جنس پروانه استفاده شده عموماً از آلومینیوم ریختگی می باشد که در صورت سفارش از جنس استنلس استیل ، فولاد ST 37 CK 45 – و ورق های ضد سایش ساخته می شود.",
+      "قابلیت ساخت بدنه با انواع فولاد و یا گالوانیزه بر اساس نیاز مشتری",
+      "قابلیت اتصال موتور به پروانه بصورت مستقیم یا تسمه-پولی",
+      "سرعت چرخش فن از 400 تا 2900 دور بر دقیقه",
+      "محدوده تولید صدا 55 الی 95 دسی بل",
+      "قابلیت تحمل افت فشار تا 400 پاسکال",
+    ],
+    image: "/images/pages/fan/plug.jpg",
+    imageAlt: "پلاگ فن",
+    isPng: false,
+  },
+] as const;
+
+export const havaranFanFaq: ProductAccordion[] = [
+  {
+    title: "انواع فن های هواران کدام است؟",
+    items: [
+      "فـــــن آکسیـــــال : به دو دسته کانالی و دیواری تقسیم می شود",
+      "فـــــن ســـــانتریفیوژ: به سه دسته بکواردفن،فوروارد فن و پلاگ فن تقسیم میشود",
+    ],
+  },
+];

src/data/home.ts

@@ -0,0 +1,305 @@
+export const site = {
+  name: "رسام تجارت هواران",
+  nameEn: "HAVARAN",
+  description:
+    "شرکت رسام تجارت هواران در حوزه طراحی و تولید تجهیزاتی نظیر چیلر، فن، هواساز، فن کویل و غیره و همچنین توان و تجربه در امور بازرگانی اعضای مجموعه خود آماده همکاری و ارائه خدمات در این زمینه است.",
+  email: "info@Havaran.com",
+  office: "دفتر مرکزی : جنت آباد مرکزی، برج اکسین، طبقه 5، واحد 19",
+  factory: "کارخانه : شهرک صنعتی صفادشت",
+  factoryAddress: "بلوار فروردین، پنجم شرقی",
+  phones: ["(021) 4614 42 67", "(021) 4614 42 71"],
+};
+
+export const navItems = [
+  { label: "صفحه اصلی", href: "/" },
+  {
+    label: "محصولات",
+    href: "/products",
+    children: [
+      { label: "فن تخلیه دود F300", href: "/products/f300" },
+      { label: "فن هواران", href: "/products/havaran-fan" },
+      { label: "چیلر", href: "/products/chiller" },
+      { label: "فن کویل", href: "/products/fancoil" },
+      { label: "هواساز", href: "/products/air-conditioner" },
+    ],
+  },
+  {
+    label: "راهکارها",
+    href: "/solutions",
+    children: [
+      {
+        label: "مدیریت دود ساختمان",
+        href: "/solutions/building-smoke-management",
+      },
+      { label: "تهویه فضاهای مختلف", href: "/solutions/ventilation-spaces" },
+      { label: "تهویه مطبوع", href: "/solutions/hvac" },
+      { label: "تونل و مترو", href: "/solutions/tunnels-and-subways" },
+      {
+        label: "تاسیسات ساختمانی",
+        href: "/solutions/building-installations",
+      },
+    ],
+  },
+  { label: "مدیا", href: "#" },
+  { label: "مدارک", href: "/documents" },
+  { label: "پروژه ها", href: "/portfolios" },
+  { label: "مقالات", href: "/articles" },
+  { label: "کاتالوگ", href: "/catalog" },
+  { label: "درباره ما", href: "/about" },
+  { label: "تماس با ما", href: "/contact" },
+];
+
+export const heroSideBanners = [
+  {
+    title: "حامی طبیعت",
+    image: "/images/hero/nature.jpg",
+    href: "#",
+  },
+  {
+    title: "هواران نماینده بلابرگ آلمان",
+    image: "/images/hero/blauberg.jpg",
+    href: "#",
+  },
+];
+
+export const heroSlides = [
+  {
+    title: "خرید انواع چیلر",
+    image: "/images/hero/chiller.jpg",
+  },
+  {
+    title: "خرید انواع هواساز",
+    image: "/images/hero/ahu-1.jpg",
+  },
+  {
+    title: "خرید انواع فن کویل",
+    image: "/images/hero/ahu-2.jpg",
+  },
+  {
+    title: "خرید انواع فن تخلیه دود",
+    image: "/images/hero/jetfan.jpg",
+  },
+  {
+    title: "خرید انواع چیلر",
+    image: "/images/hero/chiller.jpg",
+  },
+  {
+    title: "خرید انواع هواساز",
+    image: "/images/hero/ahu-1.jpg",
+  },
+];
+
+export const partners = [
+  {
+    name: "ECM",
+    country: "ترکیه",
+    image: "/images/partners/ecm.png",
+    href: "#",
+  },
+  {
+    name: "Damandeh",
+    country: "ایران",
+    image: "/images/partners/damandeh.png",
+    href: "#",
+  },
+  {
+    name: "Blauberg",
+    country: "آلمان",
+    image: "/images/partners/blauberg.png",
+    href: "#",
+  },
+];
+
+export const productCategories = [
+  {
+    title: "(Chiller) چیلر",
+    linkTitle: "خرید انواع چیلر",
+    image: "/images/products/chiller.png",
+    href: "/products/chiller",
+  },
+  {
+    title: "(Havaran Fan)فن هـواران",
+    linkTitle: "خرید انواع فن های هـواران",
+    image: "/images/products/havaran-fan.png",
+    href: "/products/havaran-fan",
+  },
+  {
+    title: "F300 فن تخلیه دود",
+    linkTitle: "خرید انواع فن تخلیه دود",
+    image: "/images/products/f300.png",
+    href: "/products/f300",
+  },
+  {
+    title: "(Air Handling Unit)هواساز",
+    linkTitle: "هواساز",
+    image: "/images/products/ahu.png",
+    href: "/products/air-conditioner",
+  },
+  {
+    title: "(Fan Coil) فن کویل",
+    linkTitle: "خرید انواع فن کویل",
+    image: "/images/products/fancoil.png",
+    href: "/products/fancoil",
+  },
+];
+
+export const specialProducts = [
+  {
+    title: "فن های پشت بامی برند Casals سری CTH3",
+    code: "CTH3",
+    price: "60,000,000",
+    image: "/images/special/cth3.jpg",
+  },
+  {
+    title: "فن های سانتریفیوژ فوروارد برند Casals سری MDE",
+    code: "MDE",
+    price: "8,600,000",
+    image: "/images/special/mde.jpg",
+  },
+  {
+    title: "کابینت فن های سانتریفیوژ فوروارد برند Casals سری BOX BD",
+    code: "box bd",
+    price: "26,200,000",
+    image: "/images/special/box-bd.jpg",
+  },
+  {
+    title: "فن های پشت بامی برند Casals سری BT ROOF 2 SB",
+    code: "bt roof2 sb",
+    price: "24,000,000",
+    image: "/images/special/bt-roof2-sb.jpg",
+  },
+  {
+    title: "داکت فن های برند Casals سری BT2",
+    code: "bt2",
+    price: "8,500,000",
+    image: "/images/special/bt2.jpg",
+  },
+];
+
+export const solutions = [
+  {
+    title: "تهویه مطبوع",
+    titleEn: "Air conditioning",
+    image: "/images/solutions/info-hvac.png",
+    href: "/solutions/hvac",
+  },
+  {
+    title: "تهویه فضاهای مختلف",
+    titleEn: "Ventilation",
+    image: "/images/solutions/info-spaces.png",
+    href: "/solutions/ventilation-spaces",
+  },
+  {
+    title: "مدیریت دود ساختمان",
+    titleEn: "Building Smoke Management",
+    image: "/images/solutions/info-smoke.png",
+    href: "/solutions/building-smoke-management",
+  },
+  {
+    title: "تاسیسات ساختمانی",
+    titleEn: "Building Installations",
+    image: "/images/solutions/info-building.png",
+    href: "/solutions/building-installations",
+  },
+  {
+    title: "تونل و مترو",
+    titleEn: "Tunnels And Subways",
+    image: "/images/solutions/info-tunnel.png",
+    href: "/solutions/tunnels-and-subways",
+  },
+];
+
+export const services = [
+  {
+    id: "fire-fan",
+    title: "فن مقاوم به حریق",
+    titleEn: "F300 Fan",
+    image: "/images/services/fire-fan.png",
+    description:
+      "این فن ها به عنوان سیستم تخلیه دود در مواقع آتش سوزی و یا تهویه معمولی مورد استفاده قرار می‌گیرد. عملکرد فن به نحوی است که هوای آلوده همراه با گازهای سمی را به خارج از ساختمان هدایت می کند.",
+  },
+  {
+    id: "iranian-fan",
+    title: "فن ایرانی",
+    titleEn: "Havaran Fan",
+    image: "/images/services/iranian-fan.png",
+    description:
+      "این نوع فن بخصوص برای تامین هوای تازه در سیستم تهویه پارکینگ مورد استفاده قرار می گیرند که در مجموعه هواران با در نظر گرفتن راندمان حداکثری و بهینه بر اساس اعلام نیاز مشتری ساخته می شوند.",
+  },
+  {
+    id: "ahu",
+    title: "هواساز",
+    titleEn: "Air Handling Unit",
+    image: "/images/services/ahu.png",
+    description:
+      "هواساز یکی از دستگاه های پرکاربرد در صنعت تهویه میباشد که عمل تهویه تابستانی و زمستانی و تامین هوای تازه را از طریق گردش هوای سرد و گرم در فضا ها از طریق کانال کشی انجام میدهد.",
+  },
+  {
+    id: "fancoil",
+    title: "فن کویل",
+    titleEn: "Fan Coil",
+    image: "/images/services/fancoil.png",
+    description:
+      "فن کویل های شرکت هواران با در نظر گرفتن عملکرد بهینه و افزیش راندمان با تکیه بر کاهش آلودگی صوتی در چهار مدل ارائه می شوند.",
+  },
+  {
+    id: "chiller",
+    title: "چیلر",
+    titleEn: "Chiller",
+    image: "/images/services/chiller.png",
+    description:
+      "چیلرهای هواخنک هواران با کیفیت و راندمان بالا و با رعایت استانداردهای موجود در زمینه حرارت و انرژی، مقاوم بودن، ایمنی و تولید صدا، تولید می شوند.",
+  },
+];
+
+export const about = {
+  title: "رسام تجارت هواران",
+  image: "/images/about/about.jpg",
+  paragraphs: [
+    "شرکت رسام تجارت هواران از سال 1398 توسط گروهی از مهندسان کارآفرین شروع به فعالیت نموده است. این شرکت با شناخت مناسب از نیازمندی‌های بازار داخلی و استفاده از فناوری به روزترین شرکت‌های بین المللی در هر یک از زمینه های تخصصی خود و به لطف تجارب مدیران خود در بسیاری از پروژه‌های ملی و بزرگ کشور در صنایع نفت و گاز، حمل و نقل، مجتمع‌های بزرگ تجاری و اداری، سازمان ها و نهادهای دولتی موفق به پاسخگویی به بخش عمده‌ای از نیازهای کشور در زمینه‌های فعالیتی خود می‌باشد.",
+    "این شرکت توانسته است با اخذ نمایندگی و همکاری نزدیک با برندهای معتبری همچون Pollrich DLK آلمان، BLAUBERG آلمان، ECM ترکیه، SENSE ترکیه، GRUNER آلمان و تولیدات با کیفیت خود در زمینه تجهیزات سیستم‌های مدیریت دود و همچنین با به کارگیری طیف وسیعی از مجرب‌ترین کارشناسان و مهندسین کشور و پشتیبانی شرکت‌های فوق‌الذکر، راهکارهای منحصر بفردی در هر یک از زمینه‌های کاری خود ارائه نماید.",
+  ],
+};
+
+export const clients = [
+  { name: "شرکت بومسان صنعت", image: "/images/clients/boomsan.jpg" },
+  { name: "شرکت آتا انرژی آفاق", image: "/images/clients/ata.jpg" },
+  { name: "شرکت سروش کارا انرژی", image: "/images/clients/soroush.jpg" },
+  { name: "شرکت ریفل", image: "/images/clients/rifle.jpg" },
+  { name: "شرکت نوتاش صنعت آریان", image: "/images/clients/notash.jpg" },
+  { name: "گروه نیکان", image: "/images/clients/nikan.jpg" },
+];
+
+export const footerLinks = {
+  products: [
+    { label: "فن تخلیه دود F300", href: "/products/f300" },
+    { label: "فن هواران", href: "/products/havaran-fan" },
+    { label: "چیلر", href: "/products/chiller" },
+    { label: "فن کویل", href: "/products/fancoil" },
+    { label: "هواساز", href: "/products/air-conditioner" },
+  ],
+  solutions: [
+    {
+      label: "مدیریت دود ساختمان",
+      href: "/solutions/building-smoke-management",
+    },
+    { label: "تهویه فضاهای مختلف", href: "/solutions/ventilation-spaces" },
+    { label: "تهویه مطبوع", href: "/solutions/hvac" },
+    { label: "تونل و مترو", href: "/solutions/tunnels-and-subways" },
+    {
+      label: "تاسیسات ساختمانی",
+      href: "/solutions/building-installations",
+    },
+  ],
+  pages: [
+    { label: "صفحه اصلی", href: "/" },
+    { label: "دانشنامه", href: "/articles" },
+    { label: "پروژه ها", href: "/portfolios" },
+    { label: "درباره ما", href: "/about" },
+    { label: "تماس با ما", href: "/contact" },
+    { label: "کاتالوگ", href: "/catalog" },
+    { label: "راهنمای خرید", href: "#" },
+    { label: "سوالات متداول", href: "#" },
+    { label: "قوانین سایت", href: "#" },
+  ],
+};

src/data/pages.ts

@@ -0,0 +1,132 @@
+export type ProductItem = {
+  slug: string;
+  title: string;
+  titleEn: string;
+  href: string;
+  image: string;
+  cover: string;
+  short: string;
+  description: string;
+};
+
+export const productsList: ProductItem[] = [
+  {
+    slug: "f300",
+    title: "فن تخلیه دود F300",
+    titleEn: "F300",
+    href: "/products/f300",
+    image: "/images/products/f300.png",
+    cover: "/images/pages/f300/hero.jpg",
+    short: "خرید انواع فن تخلیه دود",
+    description:
+      "در پارکینگهای بسته که امکان تهویه طبیعی میسر نیست، تهویه مکانیکی ضرورت می‌یابد. سیستم تخلیه دود F300 برای کنترل دود و گازهای سمی در مواقع آتش‌سوزی و تهویه روزمره استفاده می‌شود.",
+  },
+  {
+    slug: "havaran-fan",
+    title: "فن هواران",
+    titleEn: "Havaran Fan",
+    href: "/products/havaran-fan",
+    image: "/images/products/havaran-fan.png",
+    cover: "/images/services/iranian-fan.png",
+    short: "خرید انواع فن های هـواران",
+    description:
+      "فن‌های آکسیال و سانتریفیوژ هواران با راندمان حداکثری و بر اساس اعلام نیاز مشتری برای تهویه پارکینگ، ساختمان و صنایع طراحی و ساخته می‌شوند.",
+  },
+  {
+    slug: "chiller",
+    title: "چیلر",
+    titleEn: "Chiller",
+    href: "/products/chiller",
+    image: "/images/products/chiller.png",
+    cover: "/images/pages/chiller/air-cooled.png",
+    short: "خرید انواع چیلر",
+    description:
+      "چیلرهای هواخنک هواران در ظرفیت‌های ۵ الی ۵۸۰ تن تبرید با کیفیت و راندمان بالا و رعایت استانداردهای جهانی تولید می‌شوند.",
+  },
+  {
+    slug: "fancoil",
+    title: "فن کویل",
+    titleEn: "Fan Coil",
+    href: "/products/fancoil",
+    image: "/images/products/fancoil.png",
+    cover: "/images/services/fancoil.png",
+    short: "خرید انواع فن کویل",
+    description:
+      "فن کویل‌های شرکت هواران با عملکرد بهینه، افزایش راندمان و کاهش آلودگی صوتی در چهار مدل سقفی توکار، کانالی، زمینی و کاستی ارائه می‌شوند.",
+  },
+  {
+    slug: "air-conditioner",
+    title: "هواساز",
+    titleEn: "Air Handling Unit",
+    href: "/products/air-conditioner",
+    image: "/images/products/ahu.png",
+    cover: "/images/services/ahu.png",
+    short: "خرید انواع هواساز",
+    description:
+      "هواسازها برای وارد کردن هوای تازه و مطبوع به داخل فضا استفاده می‌شوند و امکان تنظیم دما، رطوبت و تصفیه هوا را فراهم می‌کنند.",
+  },
+];
+
+export type SolutionItem = {
+  slug: string;
+  title: string;
+  titleEn: string;
+  href: string;
+  image: string;
+  cover: string;
+  description: string;
+  updating?: boolean;
+};
+
+export const solutionsList: SolutionItem[] = [
+  {
+    slug: "building-smoke-management",
+    title: "مدیریت دود ساختمان",
+    titleEn: "Building Smoke Management",
+    href: "/solutions/building-smoke-management",
+    image: "/images/solutions/info-smoke.png",
+    cover: "/images/pages/smoke/hero.png",
+    description:
+      "طراحی، تامین و اجرای سیستم‌های کنترل دود پارکینگ، فشار مثبت راه‌پله و آسانسور و تخلیه دود فضاهای کاربردی.",
+  },
+  {
+    slug: "ventilation-spaces",
+    title: "تهویه فضاهای مختلف",
+    titleEn: "Ventilation",
+    href: "/solutions/ventilation-spaces",
+    image: "/images/solutions/info-spaces.png",
+    cover: "/images/pages/shared/updating.png",
+    description: "راهکارهای تهویه برای فضاهای گوناگون ساختمانی و صنعتی.",
+    updating: true,
+  },
+  {
+    slug: "hvac",
+    title: "تهویه مطبوع",
+    titleEn: "Air Conditioning",
+    href: "/solutions/hvac",
+    image: "/images/solutions/info-hvac.png",
+    cover: "/images/pages/shared/updating.png",
+    description: "سیستم‌های تهویه مطبوع برای فضاهای مسکونی، اداری و تجاری.",
+    updating: true,
+  },
+  {
+    slug: "tunnels-and-subways",
+    title: "تونل و مترو",
+    titleEn: "Tunnels And Subways",
+    href: "/solutions/tunnels-and-subways",
+    image: "/images/solutions/info-tunnel.png",
+    cover: "/images/pages/f300/axial-jet.png",
+    description:
+      "فن‌های تونلی و جت‌فن‌ها برای تامین هوای تازه، کنترل کیفیت هوا و مدیریت دود در تونل‌ها و مترو.",
+  },
+  {
+    slug: "building-installations",
+    title: "تاسیسات ساختمانی",
+    titleEn: "Building Installations",
+    href: "/solutions/building-installations",
+    image: "/images/solutions/info-building.png",
+    cover: "/images/pages/shared/updating.png",
+    description: "خدمات و تجهیزات تاسیسات ساختمانی.",
+    updating: true,
+  },
+];

src/data/portfolios.ts

@@ -0,0 +1,221 @@
+export type PortfolioItem = {
+  id: string;
+  slug: string;
+  title: string;
+  titleEn: string;
+  image: string;
+  coverImage: string;
+  gallery: string[];
+  description: string;
+};
+
+/** Static fallback when Meshkee tenant API is unavailable for havaran.com */
+export const portfoliosFallback: PortfolioItem[] = [
+  {
+    "id": "496",
+    "slug": "496",
+    "title": "شهرک مسکونی شهید خرازی",
+    "titleEn": "Kharazi Residential Complex",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/2270259155fbc14b580cfb2f9d169ba9/3.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/29213857555c0eb55e4443f2a90ce4c5/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/781eb45c38a1022eecd2f67ebbbe5b7a/1.jpeg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "495",
+    "slug": "495",
+    "title": "برج تجارت قزوین",
+    "titleEn": "Qazvin Trade Tower",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6b77087604c8e3dd04ab36039f15f1f2/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/34a699c964a740fca3e768f3c9ceb5ef/_%D8%AA%D8%AC%D8%A7%D8%B1%D8%AA_%D9%82%D8%B2%D9%88%DB%8C%D9%86.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/26326c27fd911fe0465d106453d1c654/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "494",
+    "slug": "494",
+    "title": "گروه سرمایه گذاری رس آ",
+    "titleEn": "Resa Investment Group",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/conversions/Picture1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/conversions/Picture1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/82fffb5ca846e1c38f4704caafeea045/Picture1.png"
+    ],
+    "description": ""
+  },
+  {
+    "id": "424",
+    "slug": "424",
+    "title": "شرکت مبلمان اداری لیوتاب",
+    "titleEn": "Livetab Office Furniture Company",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/conversions/ei_1625553777295-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/conversions/ei_1625553777295-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/c7b3204ec9bfea0a9f9dc23b77f3b5e7/image-(1).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/27848a3b8b38339b73bc30ff9deff7a2/image-(3).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/266c522980acb4ee64aef0912948be48/image-(4).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b236c744e94e72c48bb073c1e1fe4417/image-(5).jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/89c0fc798cddf41a971384b4ae47abd1/image.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/497e696f0076a1639552cda77ca799e9/ei_1625553777295.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "274",
+    "slug": "274",
+    "title": "مجتمع مسکونی لبخند 2",
+    "titleEn": "Labkhand 2 Residential Complex",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/36ab35b3020f5896ae18fc41567b76a1/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/9df29dfc87cdbdecd4150b24fc63c52c/3.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/e6dc5789517d0ecd1b071903c4810eaa/2.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "276",
+    "slug": "276",
+    "title": "مجتمع مسکونی شفق فردیس",
+    "titleEn": "Fardis Shafagh Residential Complex",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f034ade6c58fc442a66e4b2b71abbf8/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/14f97b191b6fa0838c21882579b1e65a/2.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "282",
+    "slug": "282",
+    "title": "مجتمع تجاری پرنسا",
+    "titleEn": "Pransa Commercial Complex",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0f7a529e4a851625fee72161a84b4ca1/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/effbb64ff6c9b38c6fcb05185cd22fc3/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/dcd452092643b695257a74108459b8f3/4.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "281",
+    "slug": "281",
+    "title": "بیمارستان پیامبران",
+    "titleEn": "Payambaran Hospital",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0ff9d78576b6c07d814ae5daab2e8d28/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b9e702b9182246d9ad08bef0c2229f6b/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/27e34e1093ba7e24075b9f5b25dcf5a7/4.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "295",
+    "slug": "295",
+    "title": "آرشیت دارو طب",
+    "titleEn": "Arshit Darou Teb",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/f3498e568e0bb45515779d6bd47e20f4/1.png"
+    ],
+    "description": ""
+  },
+  {
+    "id": "283",
+    "slug": "283",
+    "title": "فروشگاه رفاه اسلامشهر",
+    "titleEn": "Refah Shopping Center",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/93aaa29263d4040a9099001cc887d333/1.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/effa3b908aaa9f8744b980829a6bfd15/3.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/e35adc826b021f91f72f183d1bb24773/2.png",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/0df5627695c1aaf2a2be5c738a80f0c3/4.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/29430ba87f428a5f10b3a531b0761f15/5.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "493",
+    "slug": "493",
+    "title": "مجتمع مسکونی سپند",
+    "titleEn": "Sepand Residential Building",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/6f10ed0e8dd065c754dbda8ab53fcdbe/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "492",
+    "slug": "492",
+    "title": "مسکونی آیت الله کاشانی",
+    "titleEn": "Kashani Residential Building",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/d20063f557da16964373d7c63b0a0be2/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "491",
+    "slug": "491",
+    "title": "مجتمع مسکونی سید خندان",
+    "titleEn": "Seyedkhandan Residential Building",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/616485de8e020be6a556a6fc22c74cf9/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/28d0176d7f64a91d96a0228f774e39e4/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "490",
+    "slug": "490",
+    "title": "ساختمان مسکونی خیابان ولنجک",
+    "titleEn": "Velenjak Street Residential Building",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/conversions/1-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/conversions/1-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/1f12491d99a85c8ea8cd2109b292f47e/2.jpg",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b051b38568faa7197f0e810f72b9579d/1.jpg"
+    ],
+    "description": ""
+  },
+  {
+    "id": "489",
+    "slug": "489",
+    "title": "ساختمان مسکونی خیابان دماوند",
+    "titleEn": "Damavand Street Residential Building",
+    "image": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/conversions/a-thumbnail.jpg",
+    "coverImage": "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/conversions/a-thumbnail.jpg",
+    "gallery": [
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/b9378fe1dc23747e1ca3099da4fcc221/b.png",
+      "https://meshkee-storage.sas.amin.parminstorage.ir/rasam_tejarat_havaran_2473/197ee4b226df7ed486295b221842c7b3/a.jpg"
+    ],
+    "description": ""
+  }
+];
+
+export function getPortfolioBySlug(slug: string): PortfolioItem | undefined {
+  return portfoliosFallback.find((p) => p.slug === slug || p.id === slug);
+}

src/data/smoke.ts

@@ -0,0 +1,323 @@
+export type SmokeListGroup = {
+  title: string;
+  items: string[];
+};
+
+export type SmokeBlock = {
+  id: string;
+  title: string;
+  titleEn?: string;
+  intro: string[];
+  lists?: string[];
+  groups?: SmokeListGroup[];
+  image?: string;
+  imageAlt?: string;
+  isPng?: boolean;
+};
+
+export const smokeIntro = {
+  title: "پایه و اساس سیستم کنترل دود پارکینگ",
+  titleEn: "The basics of the parking smoke control system",
+  text: [
+    "در پارکینگ‌های بسته که امکان تهویه طبیعی میسر نیست، تهویه مکانیکی ضرورت پیدا می کند. در همین راستا سازمان آتش نشانی اقدام به تدوین ضوابطی تحت عنوان \"ضوابط و ملاک عمل سامانه‌های تهویه، تخلیه و کنترل دود\" نموده است که طبق بند 2-2 آن، کلیه ساختمان‌هایی که تعداد زیرزمین‌های آنها سه طبقه و یا بیشتر باشد یا مساحت ناخالص هر طبقه از زیرزمین های آنها بیش از 500 متر مربع باشد، ملزم به اجرای شرایط این دستورالعمل می باشند. (زیرزمین های بسته با مساحت کمتر از 500 متر میتوانند با دو فن معمولی مورد تهویه قرار گیرند)",
+    "تهویه مکانیکی پارکینگ به دو روش کانال‌کشی و استفاده از جت فن می تواند انجام گیرد.",
+    "بر مبنای استاندارد BS 7346-7 فن‌های تامین هوا و تخلیه دود باید توانایی حداقل 10 ACH در زمان حریق در زون حریق را داشته باشد و در زمان غیر حریق فن‌های تخلیه هوا می‌بایست توانایی جابجایی حداقل 6 ACH را داشته باشند.",
+  ],
+  image: "/images/pages/smoke/hero.png",
+  videoUrl: "https://www.aparat.com/video/video/embed/videohash/8i4hQ/vt/frame",
+};
+
+export const smokeBlocks: SmokeBlock[] = [
+  {
+    id: "jet-fan-system",
+    title: "سیستم کنترل دود پارکینگ بر مبنای جت فن",
+    titleEn: "Parking smoke control system based on jet fan",
+    intro: [
+      "سیستم جت‌فن، بر پایه جانمایی جت‌فن‌ها به جای کانال‌ها در سراسر پارکینگ قرار می‌گیرند. به صورتی‌که جت‌فن‌های نصب شده در سقف پارکینگ جریان هوا و دود را از سمت فن‌های دمنده هوای تازه به سمت منطقه وجود فن‌های تخلیه دود هدایت کرده و در این مسیر جریان دود و هوا را به صورت منحنی از بالا به پایین جابجا می‌کنند و همین امر سبب افزایش دید فرار برای خودروها و عابرین می‌شود و از ایجاد نواحی مرده (Dead Spots) در کلیه نقاط پارکینگ جلوگیری می‌کند.",
+      "در سال‌های اخیر و با پیشرفت فن‌آوری سیستم جت‌فن به عنوان استاندارد جدیدی برای تهویه نرمال و تخلیه دود پارکینگ شناخته شده است. در واقع این سیستم جایگزین نوآورانه و خلاقانه‌تری نسبت به سیستم کانال می‌باشد.",
+    ],
+    image: "/images/pages/smoke/1.jpg",
+    imageAlt: "سیستم کنترل دود پارکینگ بر مبنای جت فن",
+    isPng: false,
+  },
+  {
+    id: "equipment",
+    title: "تجهیزات سیستم کنترل دود پارکینگ",
+    intro: [],
+    lists: [
+      "فن‌های تخلیه دود مقاوم در برابر حریق",
+      "فن‌های تامین هوای تازه",
+      "تحمل افت فشار خارجی تا 50 پاسکال",
+      "جت‌فن‌های آکسیال یا سانتریفیوژ مقاوم در برابر حریق",
+      "دمپرهای دود موتوری",
+      "سنسورهای دود",
+      "پرده‌های دود بند",
+      "سیستم قدرت و کنترل",
+    ],
+    image: "/images/pages/smoke/2.png",
+    imageAlt: "تجهیزات سیستم کنترل دود",
+    isPng: true,
+  },
+  {
+    id: "all-needs",
+    title: "پاسخی به تمام نیازها",
+    intro: [
+      "استفاده از سیستم‌های هوشمند کنترل دود پارکینگ بر پایه جت‌فن ضمن پاسخگویی به تمام نیازهای تهویه پارکینگ چه در حالت تهویه نرمال و چه در حالت تخلیه دود حاصل از آتش‌سوزی، در بسیاری موارد از مزایایی برخوردار است که سیستم بر پایه کانال نمی‌تواند این موارد را فراهم کند.",
+      "استفاده از انواع مختلف جت‌فن، به شما این اجازه را می‌دهد که انعطاف‌پذیری قابل قبولی در سیستم جهت پاسخ به نیازتان در برابر سیستم کانال‌کشی در اختیار داشته باشید.",
+    ],
+    image: "/images/pages/smoke/1.jpg",
+    imageAlt: "جت فن سیستم کنترل دود",
+    isPng: false,
+  },
+  {
+    id: "services-parking",
+    title: "خدمات ما",
+    intro: [
+      "شرکت رسام تجارت هواران به عنوان یکی از معدود شرکت‌های فعال در زمینه سیستم‌های مدیریت دود، امکان اجرای انواع پروژه‌های کنترل دود پارکینگ را به صورت EPC را دارا می‌باشد.",
+      "کارفرمایان ما تنها نقشه‌های معماری پارکینگ‌های پروژه را در اختیار ما قرار می‌دهند و در ادامه شرکت رسام تجارت هواران در تمامی مراحل طراحی، تامین، اجرا و راه‌اندازی سیستم کنترل دود در کنار شماست.",
+      "همچنین این قابلیت در مجموعه ما وجود دارد که به واسطه متخصصان زبده خود نگهداری سیستم‌های کنترل دود پارکینگ را به عهده گیرد.",
+      "شرکت رسام تجارت هواران افتخار همکاری در زمینه ارائه راهکارهای جامع سیستم‌های کنترل دود پارکینگ با شرکای جهانی خود را در موارد زیر داراست.",
+    ],
+    groups: [
+      {
+        title: "فن‌های تامین هوای تازه، جت فن‌ها و فن‌های تخلیه دود:",
+        items: ["کمپانی BLAUBERG آلمان", "برند Havaran ایران"],
+      },
+      {
+        title: "دمپرهای دود:",
+        items: ["کمپانی LUFBERG چک/ GRUNER آلمان"],
+      },
+      {
+        title: "پرده‌های دودبند:",
+        items: ["کمپانی COOPERS انگلیس"],
+      },
+      {
+        title: "سنسورهای دود:",
+        items: ["کمپانی SENSE ترکیه"],
+      },
+    ],
+    image: "/images/pages/smoke/jet.png",
+    imageAlt: "خدمات سیستم کنترل دود پارکینگ",
+    isPng: true,
+  },
+  {
+    id: "standards",
+    title: "استانداردها",
+    intro: [
+      "تمام جت‌فن‌ها و فن‌های تخلیه دود دارای کلاس حرارتی F300 و F400 مطابق با EN 12101-3 می‌باشند.",
+      "همچنین کلیه مراحل طراحی تا راه‌اندازی که توسط ما ارائه می‌شوند کاملا مطابق با استانداردهای زیر ارائه می‌شود.",
+    ],
+    lists: [
+      "NFPA 88A: Standard for Parking Structures",
+      "NFPA 92: Standard for Smoke Control Systems",
+      "NFPA 101: Life Safety Codes",
+      "BS EN 7346-7: Components for Smoke and Heat Control System",
+      "قوانین و ضوابط سازمان آتش نشانی",
+    ],
+    image: "/images/pages/smoke/jet.png",
+    imageAlt: "استانداردهای سیستم کنترل دود",
+    isPng: true,
+  },
+  {
+    id: "cfd",
+    title: "محاسبات CFD برای بهترین طراحی",
+    intro: [
+      "ما با کمک CFD و شبیه‌سازی جریان دود، در بهینه‌ترین طراحی سیستم کنترل دود پارکینگ در کنار شما خواهیم بود.",
+      "با کمک CFD، مطابق با استانداردهای جهانی و ضوابط سازمان آتش‌نشانی برای داشتن یک سیستم کنترل دود ایده‌آل که شامل محاسبه تعداد و جانمایی جت‌فن‌های مورد نیاز می‌باشد، برای هر پروژه‌ای قابل محاسبه است.",
+    ],
+    image: "/images/pages/smoke/cfd.jpg",
+    imageAlt: "محاسبات CFD",
+    isPng: false,
+  },
+  {
+    id: "pressure-differential",
+    title: "سیستم‌های ایجاد اختلاف فشار",
+    intro: [
+      "راهکاری برای ایجاد فضاهای عاری از دود و راه‌های فرار",
+      "سیستم‌های ایجاد اختلاف فشار برای محافظت از راه‌های فرار و شفت‌های آتش‌نشانی طراحی می‌شوند. این مهم با محدودسازی منتشر شدن دود از یک فضا داخل ساختمان به فضاهای دیگر از طریق نشتی‌های موجود در مسیرها و درهای باز به دست می‌آید.",
+    ],
+    image: "/images/pages/smoke/extract.jpg",
+    imageAlt: "سیستم‌های ایجاد اختلاف فشار",
+    isPng: false,
+  },
+  {
+    id: "positive-components",
+    title: "اجزای سیستم‌های فشار مثبت راه‌پله و آسانسور",
+    intro: [],
+    lists: [
+      "فن‌های تامین هوای تازه",
+      "دمپرهای دود موتوری",
+      "بالانس دمپرهای تنظیم فشار",
+      "دمپرهای دستی حجمی",
+      "سنسورهای اختلاف فشار",
+      "سیستم قدرت و کنترل",
+    ],
+    image: "/images/pages/smoke/positive-1.jpg",
+    imageAlt: "اجزای سیستم فشار مثبت",
+    isPng: false,
+  },
+  {
+    id: "critical-pressure",
+    title: "فشار بحرانی",
+    intro: [
+      "اگر درها به سمت فضای محافظت شده بسته باشد، یک سیستم ایجاد اختلاف فشار امکان ایجاد شرایط قابل تحمل در داخل فضای محافظت شده به وسیله ایجاد فشاری بالاتر (به صورت نسبی) در داخل فضای محافظت شده را دارد.",
+      "اگر اختلاف فشار کم باشد، امکان نفوذ دود به فضای محافظت شده وجود دارد و اگر این اختلاف فشار خیلی زیاد باشد ممکن است باعث شود که برای بازکردن درهای فرار نیروی زیادی نیاز باشد.",
+      "جریان هوای بحرانی",
+      "در شرایط درب باز، سیستم ایجاد اختلاف فشار می‌بایست برای ایجاد حداقل سرعت هوا از میان فضای باز درها به جهت جلوگیری از نفوذ دود از این فضاها به فضای محافظت شده طراحی شود.",
+      "برای دستیابی به این سرعت هوا، فن تامین هوای تازه می‌بایست مقدار دقیقی هوا را که مناسب تامین سرعت هوا برای تمام درهای باز است را به فضای محافظت شده تزریق کند.",
+      "سیستم ایجاد اختلاف فشار در ساختمان‌ها عموما برای محافظت از فضاهای ذیل به کار می‌رود:",
+    ],
+    lists: [
+      "سیستم فشار مثبت راه‌پله (Staircase Pressurization System)",
+      "سیستم فشار مثبت آسانسور (Lift Shaft Pressurization System)",
+    ],
+    groups: [
+      {
+        title: "استفاده از این سیستم‌ها برای دستیابی به اهداف زیر به کار می‌رود:",
+        items: [
+          "عدم نفوذ دود به راه‌پله‌ها و شفت‌های آسانسور و ایجاد راه فرار امن از این طریق",
+          "ایجاد مسیر ایمن برای گذر پرسنل سازمان آتش‌نشانی از طریق راه‌پله و آسانسور",
+          "محافظت از افراد موجود در راه‌پله و آسانسور",
+          "عدم گسترش دود از طریق راه‌پله و آسانسور به طبقات دیگر",
+        ],
+      },
+    ],
+    image: "/images/pages/smoke/positive-2.jpg",
+    imageAlt: "فشار بحرانی و سیستم فشار مثبت",
+    isPng: false,
+  },
+  {
+    id: "smoke-penetration",
+    title: "سیستم حفاظت از نفوذ دود",
+    titleEn: "Smoke Penetration Protection System",
+    intro: [
+      "کلیه مراحل طراحی تا راه‌اندازی که توسط ما ارائه می‌شوند کاملا مطابق با استانداردهای زیر ارائه می‌شود.",
+    ],
+    lists: [
+      "NFPA 101: Life Safety Code",
+      "NFPA 92: Standard for Smoke Control Systems",
+      "BS EN 12101-6: Specification for Pressure Differential Systems",
+      "BS 5588-4: Code of Practice for Smoke Control Using Pressure Differentials",
+      "قوانین و ضوابط سازمان آتش نشانی",
+    ],
+    image: "/images/pages/smoke/composite.png",
+    imageAlt: "سیستم حفاظت از نفوذ دود",
+    isPng: true,
+  },
+  {
+    id: "services-pressure",
+    title: "خدمات ما — فشار مثبت راه‌پله و آسانسور",
+    intro: [
+      "شرکت رسام تجارت هواران به عنوان یکی از معدود شرکت‌های فعال در زمینه سیستم‌های مدیریت دود، امکان اجرای انواع پروژه‌های فشار مثبت راه‌پله و آسانسور به صورت EPC را دارا می‌باشد.",
+      "کارفرمایان ما تنها نقشه‌های معماری پروژه را در اختیار ما قرار می‌دهند ودر ادامه شرکت رسام تجارت هواران در تمامی مراحل طراحی، تامین، اجرا و راه‌اندازی سیستم کنترل دود در کنار شماست.",
+      "همچنین این قابلیت در مجموعه ما وجود دارد که به واسطه متخصصان زبده خود نگهداری سیستم‌های فشار مثبت را به عهده گیرد.",
+      "شرکت رسام تجارت هواران افتخار همکاری در زمینه ارائه راهکارهای جامع سیستم‌های فشار مثبت راه‌پله و آسانسور با شرکای جهانی خود را در موارد زیر داراست.",
+    ],
+    groups: [
+      {
+        title: "فن‌های تامین هوای تازه:",
+        items: ["کمپانی BLAUBERG آلمان", "برند Havaran ایران"],
+      },
+      {
+        title: "دمپرهای دود:",
+        items: ["کمپانی LUFBERG چک/GRUNER آلمان"],
+      },
+      {
+        title: "سنسورهای اختلاف فشار:",
+        items: ["کمپانی SENSE ترکیه"],
+      },
+    ],
+    image: "/images/pages/smoke/composite.png",
+    imageAlt: "خدمات سیستم فشار مثبت",
+    isPng: true,
+  },
+  {
+    id: "life-safety",
+    title: "راهکارهایی برای حفاظت از جان",
+    intro: [
+      "پایه و اساس سیستم تخلیه و کنترل دود",
+      "کریدورها به وسیله سیستم تخلیه دود مکانیکی سرویس‌دهی می‌شوند. هدف سیستم تخلیه دود در کریدورها، پاکسازی و حذف دود در طول تخلیه افراد حین آتش‌سوزی یا حین عملکرد آتش‌نشان‌ها می‌باشد. این سیستم همچنین به خنک‌سازی سازه و عدم تغییر شکل سازه کمک می‌کند.",
+      "علاوه بر حجم دود تخلیه شده، می‌بایست هوای تازه نیز به محیط تحت حریق تزریق شده و حجم این هوا می‌بایست بر مبنای حجم دود تخلیه شده باشد.",
+      "سیستم تخلیه دود کریدور",
+      "سیستم تخلیه و کنترل دود شامل تجهیزات، راهکارها و نکات طراحی است که برای فضاهای دارای کاربری مشخص مانند اداری، تجاری، آتریوم، انبار و به طور کل فضاهایی که دائما در معرض تردد و استفاده هستند تعریف می‌شود تا از انباشت و گسترش دود در این فضاها جلوگیری شود.",
+      "سیستم تخلیه دود پویا (DYNAMIC)",
+      "یک سیستم تخلیه دود مکانیکی که توانایی کامل حذف دود و محصولات ناشی از احتراق را از فضای تحت طراحی تخلیه دود را داشته و همچنین در این شیوه تزریق هوای تازه باعث ایجاد یک فضای کاملا بدون دود در زیر لایه دود که در بالای سطح قرار می‌گیرد می‌شود.",
+      "سیستم تخلیه دود ایستا (STATIC)",
+      "سیستم مهار و تخلیه دود",
+      "یک سیستم تخلیه دود بر مبنای تهویه طبیعی که در آن از مخازن دود، کانال‌های موضعی، بازشوهای دائمی یا پنجره‌های بازشوهای اتوماتیک و پنل‌ها و لوورهایی که به وسیله دتکتورهای دود عمل می‌کنند، برای تخلیه دود از فضای تحت طراحی استفاده می‌شود.",
+    ],
+    lists: [
+      "سیستم تخلیه دودی برای آتریوم‌ها، انبارهای بزرگ و کارخانه‌ها",
+      "استفاده از پرده‌های دود ثابت یا اتوماتیک جهت ایجاد زون‌های دود مجزا با کمک دیگر سیستم‌های کنترل حریق مانند سیستم اعلان حریق یا اسپرینکلر",
+      "استفاده از بازشوهای اتوماتیک برای تهویه طبیعی یا فن‌های تخلیه دود برای تهویه مکانیکی",
+      "تخلیه سریع دود از منطقه آتش سوزی",
+      "ایجاد راه فرار ایمن در کلیه فضاها",
+      "عدم انباشت دود در منطقه آتش سوزی",
+      "انتقال لایه دود به فضاهای با ارتفاع بالا جهت تخلیه طبیعی یا مکش توسط فن‌های دود",
+    ],
+    image: "/images/pages/smoke/corridor.jpg",
+    imageAlt: "راهکارهایی برای حفاظت از جان",
+    isPng: false,
+  },
+  {
+    id: "services-extraction",
+    title: "خدمات ما — مهار و تخلیه دود فضاهای کاربردی",
+    intro: [
+      "شرکت رسام تجارت هواران به عنوان یکی از معدود شرکت‌های فعال در زمینه سیستم‌های مدیریت دود، امکان اجرای انواع پروژه‌های مهار و تخلیه دود فضاهای کاربردی را به صورت EPC دارا می‌باشد.",
+      "کارفرمایان ما تنها نقشه‌های معماری پروژه را در اختیار ما قرار می‌دهند و در ادامه شرکت رسام تجارت هواران در تمامی مراحل طراحی، تامین، اجرا و راه‌اندازی سیستم کنترل دود در کنار شماست.",
+      "همچنین این قابلیت در مجموعه ما وجود دارد که به واسطه متخصصان زبده خود نگهداری سیستم‌های مهار و تخلیه دود را به عهده گیرد.",
+      "شرکت رسام تجارت هواران افتخار همکاری در زمینه ارائه راهکارهای جامع سیستم‌های کنترل دود پارکینگ با شرکای جهانی خود را در موارد زیر داراست.",
+    ],
+    groups: [
+      {
+        title: "فن‌های تامین هوای تازه و فن‌های تخلیه دود:",
+        items: ["کمپانی BLAUBERG آلمان", "برند Havaran ایران"],
+      },
+      {
+        title: "دمپرهای دود:",
+        items: ["کمپانی LUFBERG چک/GRUNER آلمان"],
+      },
+      {
+        title: "پرده‌های دودبند:",
+        items: ["کمپانی COOPERS انگلیس"],
+      },
+      {
+        title: "سنسورهای دود:",
+        items: ["کمپانی SENSE ترکیه"],
+      },
+    ],
+    image: "/images/pages/smoke/atrium.png",
+    imageAlt: "خدمات مهار و تخلیه دود",
+    isPng: true,
+  },
+  {
+    id: "extraction-standards",
+    title: "استانداردها — کنترل و تخلیه دود",
+    intro: [
+      "کلیه مراحل طراحی تا راه‌اندازی که توسط ما ارائه می‌شوند کاملا مطابق با استانداردهای زیر ارائه می‌شود.",
+    ],
+    lists: [
+      "NFPA 204: Standards for Smoke and Heat Ventilation",
+      "NFPA 92: Standard for Smoke Control Systems",
+      "BS EN 7346-4: Components for Smoke and Heat Control System",
+      "قوانین و ضوابط سازمان آتش نشانی",
+    ],
+    groups: [
+      {
+        title: "اجزای سیستم‌های کنترل و تخلیه دود",
+        items: [
+          "فن‌های تخلیه دود (Smoke Extraction Fan)",
+          "پرده‌های دود ثابت یا اتوماتیک (Fixed/Automatic Smoke Curtain)",
+          "پرده‌های آتش اتوماتیک (Automatic Fire Curtains/Shutters)",
+          "لوورهای موتوردار (Motorized Louver)",
+          "دریچه‌های مکش دود (Inlet Grill)",
+          "فن‌های هوای تازه (Makeup Air Fan)",
+          "سیستم کنترل (Control System)",
+        ],
+      },
+    ],
+    image: "/images/pages/smoke/atrium.png",
+    imageAlt: "استانداردها و اجزای تخلیه دود",
+    isPng: true,
+  },
+];

src/data/tunnel.ts

@@ -0,0 +1,81 @@
+export type TunnelBlock = {
+  id: string;
+  title: string;
+  titleEn?: string;
+  intro: string[];
+  lists?: string[];
+  image?: string;
+  imageAlt?: string;
+  isPng?: boolean;
+};
+
+export const tunnelIntro = {
+  title: "راهکار های تهویه تونل و مترو",
+  text: [
+    "فن های تونلی و جت فن‌های شرکت رسام تجارت هواران با تأمین هوای تازه در تونل‌های درحال ساخت عملکرد خود را در هنگام ساخت تونل نشان می دهند و پس از ساخت، سیستم تهویه ما کیفیت هوا را در داخل تونل ها کنترل می کند و در صورت آتش سوزی، گازهای دودزا و گرما را مسیرهای فرار از دور نگه می دارد.",
+  ],
+  image: "/images/pages/tunnel/hero.jpg",
+};
+
+export const tunnelBlocks: TunnelBlock[] = [
+  {
+    id: "supply",
+    title: "سیستم تأمین کننده",
+    intro: [
+      "ما طیف گسترده ای از محصولات را تامین می کنیم تا بسته مناسبی برای راه حل های تهویه به شما ارائه دهیم. نمونه کارهای ما شامل فن‌های آکسیال برگشت پذیر و جت فن های تونلی با کلاس F250، F300 و F400 برند DLK Ventilatoren کشور آلمان، صدا خفه کن ، دمپر تونل ، اینورتر ، کانال داکتینگ و انعطاف پذیر ( نسخه ATEX در صورت نیاز)، دمپر آتش و سیستم فشار برای مسیرهای فرار است. همچنین تمام محصولات ما دارای گواهینامه صحت عملکرد از مراجع و آزمایشگاه های معتبری همچون TUV، BSI، APPLUS و ... می باشند.",
+    ],
+    image: "/images/pages/tunnel/schematic.png",
+    imageAlt: "سیستم تأمین کننده تهویه تونل",
+    isPng: true,
+  },
+  {
+    id: "service",
+    title: "سرویس",
+    intro: [
+      "ما در رسام تجارت هواران به انتخاب محصولات با کیفیت خود افتخار می کنیم. علاوه بر تست های آزمایشگاهی مقدماتی و راه اندازی در محل ، خدمات ما شامل تجزیه و تحلیل CFD و نظارت بر سیستم تهویه در حین کار است.",
+    ],
+  },
+  {
+    id: "metro",
+    title: "تهویه مترو و خطوط ریلی",
+    intro: [
+      "حمل و نقل زیرزمینی و سیستم های ریلی روز به روز بیشتر می شوند زیرا امکان حمل و نقل سریع تعداد زیادی از مسافران و بارها را فراهم می کنند. شبکه قطارهای سریع السیر و همچنین خطوط ریلی استاندارد به منظور کاهش تأثیرات زیست محیطی عموما به تونل های زیرزمینی منتقل می شوند.",
+      "هر دو این کاربری ها به تهویه نیازمند اند. در متروها هجوم تعداد زیادی از مردم و تردد قطارها باعث کاهش اکسیژن و افزایش گرما و آلاینده ها می شود. از این رو تهویه مکانیکی مناسب برای دستیابی به تبادل هوای لازم و فراهم کردن شرایط راحت به مسافران سیستم های قطار زیرزمینی مورد نیاز است. سیستم های تهویه هدف دوم و حتی مهم تری نیز دارند و آن تضمین ایمنی در موارد اضطراری آتش سوزی می باشد. به منظور ایجاد یک محیط ایمن برای فرار، استفاده از تهویه مکانیکی هم در تونل ها و هم در ایستگاه ها ضروری می باشد زیرا در این شرایط، کنترل انتشار دود و ایجاد مناطق امن و محیط شفاف برای مسافران و نیروهای خدمات بسیار مهم است.",
+    ],
+    image: "/images/pages/tunnel/metro.png",
+    imageAlt: "تهویه مترو و خطوط ریلی",
+    isPng: true,
+  },
+  {
+    id: "road-tunnels",
+    title: "تهویه تونل های جاده ای",
+    titleEn: "Ventilation of Road Tunnels",
+    intro: [
+      "در تونل های جاده ای برای کاهش میزان انتشار آلاینده ها از وسایل نقلیه - مانند مونوکسیدکربن (CO) ، اکسیدهای نیتروژن (NOx) و دوده (ذرات ریز) – و استقرار هوای قابل قبول برای کاربران ، به تهویه نیاز است.",
+      "از آن رو که کنترل اثرات آتش سوزی در تونل ها مهم است، سیستم تهویه نیاز به طراحی و محاسبات صحیح دارد تا سرعت و جهت کافی برای کنترل انتشار دود و گرما را در حین آتش سوزی فراهم کند.",
+      "سیستم های تهویه بسته به عناصر کلیدی مختلف مانند: طول ، جهت ترافیک ، شیب ، سرعت جریان ، اندازه آتش و سناریو و غیره می توانند پیکربندی شوند.",
+      "شرکت هواران با همکاری با برند DLK آلمان، تخصص فنی را برای طراحی سیستم های تهویه فراهم می کند و از نصب ، راه اندازی و بهره برداری از سیستم های تحویل شده پشتیبانی می کند.",
+      "سیستم های تهویه تونل های جاده ای اغلب توسط اینورتر کنترل می شوند و از دیتکتورها یا آشکارسازهای مونوکسیدکربن و اکسید نیتروژن برای اطمینان از تهویه مناسب تونل در تمام شرایط ترافیکی استفاده می کنند.",
+      "در صورت آتش سوزی ، همین سیستم باید بتواند به عنوان سیستم تخلیه دود عمل کند و به افراد داخل تونل اجازه تخلیه دهد و شرایط ورود خدمات اضطراری برای رسیدن به منبع آتش و مقابله با آن را فراهم می دهد.",
+      "ما می توانیم خدمات طراحی سیستم و محصولات متناسب را برای موارد زیر فراهم نماییم:",
+    ],
+    lists: ["تهویه عرضی تونل", "تهویه نیمه عرضی تونل", "تهویه طولی"],
+    image: "/images/pages/tunnel/schematic.png",
+    imageAlt: "تهویه تونل های جاده ای",
+    isPng: true,
+  },
+  {
+    id: "longitudinal",
+    title: "سیستم‌های تهویه طولی و ترکیبی",
+    intro: [
+      "هر یک از سیستم های تهویه تونل از جت فن های تونل ، فن های محوری بزرگ یا ترکیبی از این دو برای تأمین، تهویه و کنترل آلودگی و تهویه دود در صورت آتش سوزی تونل استفاده می کنند.",
+      "از تهویه طولی در صورتی استفاده می شود که کمترین هزینه نصب و راه اندازی مد نظر باشد. متداول ترین روش، استفاده از جت فن است که در آن سرعت تخلیه نسبتاً زیاد باعث جریان هوا از طریق تونل می شود. در این حالت جت ها انرژی را به جریان هوای تونل منتقل می کنند و باعث افزایش فشار استاتیکی می شوند که مانند هر سیستم دیگری باعث جریان هوا می شود.",
+      "فن های آکسیال بزرگ برای سیستم های عرضی و نیمه عرضی استفاده می شوند که هوا از طریق مجاری مشخص تأمین یا استخراج می شود. در این سیستم به طور معمول از چندین فن به طور موازی استفاده می شود تا حجم جریان را فراهم کند. غالباً فن ها با VFD كنترل می شوند تا مراحل اضافی در تهویه، هزینه عملیاتی كمتر در مقادیر كم جریان و سطح سر و صدای كم برای كار شبانه فراهم شود. معمولا تمام فن ها برگشت پذیر هستند تا به صورت ساپلای نیز بتوانند بکار گرفته شوند. برای پاکسازی دود از یک سمت آتش ، ممکن است از فن های برگشت پذیر همراه با سیستم کانال برای ایجاد جریان طولی در امتداد تونل استفاده شود.",
+      "همچنین ممکن است مواردی وجود داشته باشد که یک سیستم طولی با استفاده از جت فن علاوه بر یک سیستم عرضی توجیه داشته باشد زیرا هزینه کار با این سیستم تهویه پایین بسیار کمتر است. برای جلوگیری از آلودگی در دهانه های تونل ، ممکن است از فن های بزرگ برای گرفتن جریان هوای تونل و تخلیه آن در سطح بالا استفاده شود.",
+      "همچنین با افزایش وسایل نقلیه الکتریکی و افزایش میزان حمل و نقل بار (بارهای قابل اشتعال) ، باید به نیاز طولانی مدت تهویه آتش در تونل توجه ویژه ای داشت.",
+    ],
+    image: "/images/pages/tunnel/hero.jpg",
+    imageAlt: "سیستم تهویه طولی تونل",
+    isPng: false,
+  },
+];