Apply website QA: light theme, clearer contact form, office emails

- Add a light theme with a header toggle; the choice is remembered and applied before paint
- Make the globe, product visuals and footer logo follow the theme
- Give the message field a full outline, strengthen the captcha box border and keep autofilled fields readable
- Accept website addresses without https://
- List the info email under every office
- Keep the phone header on one row: languages move into the menu below 480px

src/app/[lang]/layout.tsx

@@ -5,6 +5,7 @@ import "../globals.css";
 import SiteHeader from "@/components/site-header";
 import SiteFooter from "@/components/site-footer";
 import Analytics, { AnalyticsNoScript } from "@/components/analytics";
+import { themeScript } from "@/components/theme-toggle";
 import { dirOf, locales, localize, ogLocale } from "@/i18n/config";
 import { mainNav } from "@/i18n/nav";
 import { getUI } from "@/i18n/server";
@@ -51,7 +52,7 @@ export async function generateMetadata(): Promise<Metadata> {
 
 export const viewport: Viewport = {
   themeColor: "#000000",
-  colorScheme: "dark",
+  colorScheme: "dark light",
 };
 
 export default async function RootLayout({ children }: LayoutProps<"/[lang]">) {
@@ -63,6 +64,8 @@ export default async function RootLayout({ children }: LayoutProps<"/[lang]">) {
     closeMenu: t.nav.closeMenu,
     language: t.nav.language,
     logoHome: t.logoHome,
+    lightTheme: t.nav.lightTheme,
+    darkTheme: t.nav.darkTheme,
   };
 
   return (
@@ -71,7 +74,12 @@ export default async function RootLayout({ children }: LayoutProps<"/[lang]">) {
       dir={dirOf(locale)}
       className={`${inter.variable} ${arabic.variable}`}
       data-scroll-behavior="smooth"
+      // The theme script sets data-theme before React hydrates.
+      suppressHydrationWarning
     >
+      <head>
+        <script dangerouslySetInnerHTML={{ __html: themeScript }} />
+      </head>
       <body>
         <AnalyticsNoScript />
         <a href="#main" className="skip-link">