diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx
index 48f588632..b700fed50 100644
--- a/app/[locale]/layout.tsx
+++ b/app/[locale]/layout.tsx
@@ -22,6 +22,7 @@ import { DynamicMobileBottomNav as MobileBottomNav } from '@/components/layout/D
import { DynamicCorporateBackground as CorporateBackground } from '@/components/decorations/DynamicCorporateBackground';
import { DynamicPageTransitionShutter as PageTransitionShutter } from '@/components/providers/DynamicPageTransitionShutter';
+import { DynamicFramerMotion as FramerMotionProvider } from '@/components/providers/DynamicFramerMotion';
const inter = Inter({
subsets: ['latin'],
@@ -190,26 +191,28 @@ export default async function Layout(props: {
-
-
-
-
-
-
-
-
- {children}
-
+
+
+
+
+
+
+
+
+
+ {children}
+
-
-
-
+
+
+
-
+
+
diff --git a/components/providers/DynamicFramerMotion.tsx b/components/providers/DynamicFramerMotion.tsx
new file mode 100644
index 000000000..4f8c0ed6f
--- /dev/null
+++ b/components/providers/DynamicFramerMotion.tsx
@@ -0,0 +1,7 @@
+'use client';
+import dynamic from 'next/dynamic';
+
+export const DynamicFramerMotion = dynamic(
+ () => import('./FramerMotionProvider').then((mod) => mod.FramerMotionProvider),
+ { ssr: true }
+);
diff --git a/components/providers/FramerMotionProvider.tsx b/components/providers/FramerMotionProvider.tsx
new file mode 100644
index 000000000..c556d9c1c
--- /dev/null
+++ b/components/providers/FramerMotionProvider.tsx
@@ -0,0 +1,11 @@
+'use client';
+import { LazyMotion } from 'framer-motion';
+const loadFeatures = () => import('@/lib/framer-features').then(res => res.default);
+
+export function FramerMotionProvider({ children }: { children: React.ReactNode }) {
+ return (
+
+ {children}
+
+ );
+}
diff --git a/components/providers/TransitionProvider.tsx b/components/providers/TransitionProvider.tsx
index 31e41703d..6d27cdd17 100644
--- a/components/providers/TransitionProvider.tsx
+++ b/components/providers/TransitionProvider.tsx
@@ -2,9 +2,6 @@
import React, { createContext, useContext, useState, useCallback, ReactNode, useEffect } from 'react';
import { useRouter, usePathname, useSearchParams } from 'next/navigation';
-import { LazyMotion } from 'framer-motion';
-
-const loadFeatures = () => import('@/lib/framer-features').then(res => res.default);
interface TransitionContextType {
isTransitioning: boolean;
@@ -71,9 +68,7 @@ export function TransitionProvider({ children }: { children: ReactNode }) {
setTransitionMessage={setTransitionMessage}
/>
-
- {children}
-
+ {children}
);
}