feat: redesign site pages and connect contact API

src/components/news/NewsArticleDetail.tsx

@@ -47,13 +47,13 @@ export function NewsArticleDetail({
       />
 
       {navItems.length > 1 && (
-        <nav aria-label="بخش‌های صفحه" className="border-b border-line bg-paper">
-          <ul className="no-scrollbar mx-auto flex max-w-[1400px] items-center gap-8 overflow-x-auto px-6 lg:px-12">
+        <nav aria-label="بخش‌های صفحه" className="border-b border-line bg-[#f1efec]">
+          <ul className="no-scrollbar mx-auto flex max-w-[1400px] items-center justify-center gap-10 overflow-x-auto px-6 lg:px-12">
             {navItems.map((navItem) => (
               <li key={navItem.id}>
                 <a
                   href={`#${navItem.id}`}
-                  className="block scroll-mt-24 py-5 text-sm whitespace-nowrap text-muted transition-colors duration-300 hover:text-gold"
+                  className="block scroll-mt-24 border-b-2 border-transparent py-5 text-sm font-bold whitespace-nowrap text-ink transition-colors duration-300 hover:border-gold hover:text-gold"
                 >
                   {navItem.label}
                 </a>
@@ -63,7 +63,7 @@ export function NewsArticleDetail({
         </nav>
       )}
 
-      <section id="overview" className="scroll-mt-20 bg-paper py-16 lg:py-24">
+      <section id="overview" className="scroll-mt-20 bg-paper py-24 lg:py-36">
         <div className="mx-auto max-w-[1400px] px-6 lg:px-12">
           <Reveal>
             <SectionLabel fa={sectionLabel} en={sectionLabelEn} className="mb-14" />
@@ -71,14 +71,14 @@ export function NewsArticleDetail({
 
           {item.bodyHtml && (
             <Reveal delay={90}>
-              <div className="cms-body" dangerouslySetInnerHTML={{ __html: item.bodyHtml }} />
+              <div className="cms-body cms-body--editorial" dangerouslySetInnerHTML={{ __html: item.bodyHtml }} />
             </Reveal>
           )}
         </div>
       </section>
 
       {hasGallery && (
-        <section id="gallery" className="scroll-mt-20 bg-sand py-16 lg:py-24">
+        <section id="gallery" className="scroll-mt-20 bg-[#f1efec] py-24 lg:py-32">
           <div className="mx-auto max-w-[1400px] px-6 lg:px-12">
             <Reveal>
               <SectionLabel fa="گالری تصاویر" en="GALLERY" className="mb-14" />