- Started working on the about page;

- Updated the translation;
- Changed the language switch from flags to text

src/templates/About.tsx

@@ -0,0 +1,29 @@
+/* eslint-disable @next/next/no-img-element */
+import Footer from "@/components/Footer";
+import Navbar from "@/components/Navbar";
+import Tag from "@/components/Tag";
+import translation from "@/translation/about.json";
+
+interface Props {
+	language: "en" | "ar";
+}
+
+export default function About({language}: Props) {
+	return (
+		<main className="h-screen w-full bg-white text-mti-black flex flex-col">
+			<Navbar currentPage="/about" language={language} />
+
+			<section className="w-full bg-mti-purple-light h-96 flex items-center justify-center overflow-hidden">
+				<img src="/about-banner.jpg" alt="IELTS Packages - Together we prepare for the future" className="bg-cover" />
+			</section>
+
+			<section className="w-full bg-white">
+				<div className="w-full grid grid-rows-4 md:grid-rows-1 md:grid-cols-4 gap-8 p-8 md:p-20 container mx-auto">
+					<Tag>{translation.encoach_benefits.tag[language]}</Tag>
+				</div>
+			</section>
+
+			<Footer language={language} />
+		</main>
+	);
+}