add images and redesign hompeage into sections, fix the dark color

homepage/src/app/[locale]/layout.tsx

@@ -27,8 +27,8 @@ export async function generateMetadata({ params }: { params: Promise<{ locale: s
   const { locale } = await params;
   return {
     icons: {
-      icon: '/rentaldrivego.jpeg',
-      apple: '/rentaldrivego.jpeg',
+      icon: '/rentaldrivego.png',
+      apple: '/rentaldrivego.png',
     },
   };
 }

homepage/src/components/app-shell/BrandLink.tsx

@@ -15,12 +15,13 @@ export function BrandLink({ locale, label }: { locale: Locale; label: string })
       aria-current={routeIdFromPathname(pathname) === 'home' ? 'page' : undefined}
     >
       <Image
-        src="/rentaldrivego.jpeg"
+        src="/rentaldrivego.png"
         alt=""
         width={36}
         height={36}
         className={styles.mark}
         priority
+        unoptimized
       />
       <span className={styles.brandName}>RentalDriveGo</span>
     </a>

homepage/src/components/auth/AuthShell.tsx

@@ -29,11 +29,12 @@ export function AuthShell({ locale, title, subtitle, children }: AuthShellProps)
         <div style={{ marginBottom: '2rem', textAlign: 'center' }}>
           <a href={localizedPath('home', locale)}>
             <Image
-              src="/rentaldrivego.jpeg"
+              src="/rentaldrivego.png"
               alt="RentalDriveGo"
               width={96}
               height={96}
               priority
+              unoptimized
               style={{
                 borderRadius: '1.5rem',
                 border: '1px solid var(--color-border)',