diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index fd12fbd..c7eebf2 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -1,4 +1,5 @@
 ---
+import { ClientRouter } from "astro:transitions";
 import "../styles/global.css";
 
 interface Props {
@@ -14,7 +15,7 @@ const imageUrl = `${siteUrl}${image}`;
 ---
 
 <!doctype html>
-<html lang="en" class="h-full">
+<html lang="es" class="h-full" transition:name="root" transition:animate="none">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width" />
@@ -55,6 +56,9 @@ const imageUrl = `${siteUrl}${image}`;
     <meta property="twitter:title" content={title} />
     <meta property="twitter:description" content={description} />
     <meta property="twitter:image" content={imageUrl} />
+    
+    <!-- View Transitions -->
+    <ClientRouter />
   </head>
   <body class="h-full bg-white">
     <slot />
diff --git a/src/layouts/PageLayout.astro b/src/layouts/PageLayout.astro
index abf2b68..67d0d8d 100644
--- a/src/layouts/PageLayout.astro
+++ b/src/layouts/PageLayout.astro
@@ -18,7 +18,7 @@ const { title, description, image } = Astro.props;
       <Navigation />
     </header>
     
-    <main class="flex-1 pt-16">
+    <main class="flex-1 pt-16" transition:animate="fade">
       <slot />
     </main>
     
