diff --git a/apps/www/app/_hooks/use-show-consent-banner.ts b/apps/www/app/_hooks/use-show-consent-banner.ts
deleted file mode 100644
index 737106606a..0000000000
--- a/apps/www/app/_hooks/use-show-consent-banner.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { useEffect, useState } from 'react';
-import { hasConsent } from '~/_utils/consent.client';
-
-export function useShowConsentBanner() {
-  const [showBanner, setShowBanner] = useState(false);
-
-  useEffect(() => {
-    // Check if user already has consent
-    const checkConsent = async () => {
-      if (!(await hasConsent())) {
-        setShowBanner(true);
-      }
-    };
-
-    checkConsent();
-
-    // Listen for consent changes (in case user updates consent in another tab)
-    const handleStorageChange = async () => {
-      if (!(await hasConsent())) {
-        setShowBanner(true);
-      }
-    };
-
-    window.cookieStore?.addEventListener('change', handleStorageChange);
-    return () =>
-      window.cookieStore?.removeEventListener('change', handleStorageChange);
-  }, []);
-
-  const hideBanner = () => setShowBanner(false);
-
-  return { showBanner, hideBanner };
-}
diff --git a/apps/www/app/layouts/root/layout.tsx b/apps/www/app/layouts/root/layout.tsx
index dbff89347f..067a1ce4ab 100644
--- a/apps/www/app/layouts/root/layout.tsx
+++ b/apps/www/app/layouts/root/layout.tsx
@@ -11,18 +11,15 @@ import { Figma } from '~/_components/logos/figma';
 import { Github } from '~/_components/logos/github';
 import { Slack } from '~/_components/logos/slack';
 import { SearchDialog } from '~/_components/search-dialog';
-import { useShowConsentBanner } from '~/_hooks/use-show-consent-banner';
-import i18n from '~/i18n';
+import { hasConsent } from '~/_utils/consent.client';
 import type { Route as RootRoute } from './../../+types/root';
 import type { Route } from './+types/layout';
 
-export const loader = ({ params }: Route.LoaderArgs) => {
-  if (!i18n.supportedLngs.includes(params.lang || '')) {
-    throw new Response('Not Found', {
-      status: 404,
-    });
-  }
+export const clientLoader = async () => {
+  const showConsentBanner = !(await hasConsent());
+  return { showConsentBanner };
 };
+clientLoader.hydrate = true as const;
 
 const rightLinks: FooterLinkListItemProps[] = [
   {
@@ -49,7 +46,7 @@ const rightLinks: FooterLinkListItemProps[] = [
   },
 ];
 
-export default function RootLayout() {
+export default function RootLayout({ loaderData }: Route.ComponentProps) {
   const { t } = useTranslation();
   const { lang, centerLinks, menu } = useRouteLoaderData('root') as Omit<
     RootRoute.ComponentProps['loaderData'],
@@ -61,7 +58,6 @@ export default function RootLayout() {
       href: string;
     }[];
   };
-  const { showBanner } = useShowConsentBanner();
 
   useChangeLanguage(lang);
 
@@ -72,7 +68,9 @@ export default function RootLayout() {
   return (
     <>
       <div>
-        {showBanner && <ConsentBanner lang={lang} />}
+        {loaderData?.showConsentBanner || false ? (
+          <ConsentBanner lang={lang} />
+        ) : null}
         <SkipLink href='#main'>{t('accessibility.skip-link')}</SkipLink>
       </div>
       <Header