Improve mobile name layout

components/home-page.tsx

@@ -16,6 +16,11 @@ export function HomePage({ language }: { language: Language }) {
   const dir = getDirection(language);
   const t = portfolioContent[language];
   const founderName = language === "ar" ? sharedProfile.founderNameAr : sharedProfile.founderNameEn;
+  const founderNameParts = founderName.trim().split(/\s+/);
+  const mobileFounderNameLines =
+    founderNameParts.length > 2
+      ? [`${founderNameParts[0]} ${founderNameParts[1]}`, founderNameParts.slice(2).join(" ")]
+      : [founderName];
   const address = language === "ar" ? sharedProfile.addressAr : sharedProfile.address;
   const heroImageAlt =
     language === "ar"
@@ -63,7 +68,12 @@ export function HomePage({ language }: { language: Language }) {
                     language === "en" ? "type-hero-title-latin" : ""
                   }`}
                 >
-                  {founderName}
+                  <span className="hidden sm:inline">{founderName}</span>
+                  <span className="hero-title-mobile-lines sm:hidden">
+                    {mobileFounderNameLines.map((line) => (
+                      <span key={line}>{line}</span>
+                    ))}
+                  </span>
                 </h1>
 
                 <div className="mt-8 max-w-2xl space-y-4">