diff --git a/docusaurus.config.js b/docusaurus.config.js
index a2722a4856..26e7deb5ba 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -245,14 +245,27 @@ const config = {
       image: 'img/og-image-flow-docs-2025-dark.png',
       metadata: [
         { name: 'twitter:card', content: 'summary_large_image' },
-        { name: 'twitter:image', content: getUrl() + '/img/og-image-flow-docs-2025-dark.png' },
-        { property: 'og:image', content: getUrl() + '/img/og-image-flow-docs-2025-dark.png' },
+        {
+          name: 'twitter:image',
+          content: getUrl() + '/img/og-image-flow-docs-2025-dark.png',
+        },
+        {
+          property: 'og:image',
+          content: getUrl() + '/img/og-image-flow-docs-2025-dark.png',
+        },
         { property: 'og:image:type', content: 'image/png' },
         { property: 'og:image:width', content: '1200' },
         { property: 'og:image:height', content: '630' },
         { property: 'og:type', content: 'website' },
-        { property: 'og:description', content: 'Flow Developer Documentation - The future of culture and digital assets is built on Flow' },
-        { property: 'og:logo', content: getUrl() + '/img/flow-docs-logo-light.png' },
+        {
+          property: 'og:description',
+          content:
+            'Flow Developer Documentation - The future of culture and digital assets is built on Flow',
+        },
+        {
+          property: 'og:logo',
+          content: getUrl() + '/img/flow-docs-logo-light.png',
+        },
       ],
       docs: {
         sidebar: {
@@ -295,6 +308,12 @@ const config = {
             type: 'custom-connectButton',
             position: 'right',
           },
+          {
+            type: 'html',
+            position: 'right',
+            value:
+              "<button onclick=\"if(window.Pylon){console.log('Opening Pylon from navbar'); window.Pylon('show');}else{console.warn('Pylon not available');}\" class=\"inline-flex items-center justify-center font-semibold text-center border transition duration-200 cursor-pointer font-display text-sm px-4 py-2 rounded-md bg-black text-white border-transparent hover:bg-gray-800 hover:text-white active:bg-gray-900 active:text-white dark:bg-white dark:text-black dark:hover:bg-gray-100 dark:hover:text-black dark:active:bg-gray-200 dark:active:text-black\">Ask Flow AI</button>",
+          },
           {
             href: 'https://github.com/onflow',
             html: '<img src="" alt="GitHub" id="navbar-github" class="box-content h-32 w-32"/><span class="p-2 desktop:hidden">Github</span>',
@@ -320,7 +339,7 @@ const config = {
                 to: '/build/cadence/getting-started/contract-interaction',
               },
               {
-                label: "Tools & SDKs",
+                label: 'Tools & SDKs',
                 to: '/build/tools',
               },
               {
@@ -632,6 +651,7 @@ const config = {
     },
 
     require('./src/plugins/font-preload'),
+    require('./src/plugins/pylon-chat'),
   ],
   stylesheets: [
     {
diff --git a/src/components/PylonConfig.tsx b/src/components/PylonConfig.tsx
new file mode 100644
index 0000000000..4a8064f521
--- /dev/null
+++ b/src/components/PylonConfig.tsx
@@ -0,0 +1,54 @@
+import React, { useEffect } from 'react';
+import { useCurrentUser } from '@site/src/hooks/use-current-user';
+import BrowserOnly from '@docusaurus/BrowserOnly';
+
+// Your Pylon APP_ID
+const PYLON_APP_ID = 'cc6b067b-cddb-4fd4-8043-030f95e703e4';
+
+declare global {
+  interface Window {
+    pylon?: {
+      chat_settings: {
+        app_id: string;
+        email?: string;
+        name?: string;
+        account_external_id?: string;
+      };
+    };
+    Pylon?: (action: string, ...args: any[]) => void;
+  }
+}
+
+const PylonConfigInner: React.FC = () => {
+  const { user, addr } = useCurrentUser();
+
+  useEffect(() => {
+    if (typeof window !== 'undefined') {
+      console.log('🔧 Setting Pylon configuration with user context...');
+      console.log('👤 User logged in:', user.loggedIn, 'Address:', addr);
+
+      window.pylon = {
+        chat_settings: {
+          app_id: PYLON_APP_ID,
+          // Add user context when available
+          ...(user.loggedIn &&
+            addr && {
+              email: `${addr}@flow.blockchain`,
+              name: `Flow User ${addr.slice(0, 8)}...`,
+              account_external_id: addr,
+            }),
+        },
+      };
+
+      console.log('✅ Pylon config set:', window.pylon);
+    }
+  }, [user.loggedIn, addr]);
+
+  return null;
+};
+
+const PylonConfig: React.FC = () => {
+  return <BrowserOnly>{() => <PylonConfigInner />}</BrowserOnly>;
+};
+
+export default PylonConfig;
diff --git a/src/plugins/pylon-chat.js b/src/plugins/pylon-chat.js
new file mode 100644
index 0000000000..384dbaf4d8
--- /dev/null
+++ b/src/plugins/pylon-chat.js
@@ -0,0 +1,36 @@
+module.exports = function pylonChatPlugin() {
+  return {
+    name: 'pylon-chat',
+    injectHtmlTags() {
+      return {
+        headTags: [],
+        postBodyTags: [
+          // Set Pylon configuration immediately (like the working test file)
+          {
+            tagName: 'script',
+            innerHTML: `
+console.log('🔧 Setting Pylon configuration...');
+window.pylon = {
+  chat_settings: {
+    app_id: 'cc6b067b-cddb-4fd4-8043-030f95e703e4',
+    email: 'anonymous@flow.docs',
+    name: 'Flow Docs User'
+  }
+};
+console.log('✅ Pylon config set:', window.pylon);
+            `,
+          },
+          // Then add Pylon chat widget script
+          {
+            tagName: 'script',
+            innerHTML: `
+console.log('📦 Loading Pylon script...');
+(function(){var e=window;var t=document;var n=function(){n.e(arguments)};n.q=[];n.e=function(e){n.q.push(e)};e.Pylon=n;var r=function(){var e=t.createElement("script");e.setAttribute("type","text/javascript");e.setAttribute("async","true");e.setAttribute("src","https://widget.usepylon.com/widget/cc6b067b-cddb-4fd4-8043-030f95e703e4");e.onload=function(){console.log('🎉 Pylon widget script fully loaded!');setTimeout(function(){console.log('🔍 Checking for chat elements:', document.querySelectorAll('[data-pylon]').length);if(window.Pylon){console.log('🚀 Chat bubble should now be visible!');}},1000);};e.onerror=function(){console.error('❌ Failed to load Pylon script');};var n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)};if(t.readyState==="complete"){r()}else if(e.addEventListener){e.addEventListener("load",r,false)}})();
+console.log('✅ Pylon script loader initialized');
+            `,
+          },
+        ],
+      };
+    },
+  };
+};
diff --git a/src/theme/SearchBar.js b/src/theme/SearchBar.js
index cd0a7ee0b3..b0bcd4521d 100644
--- a/src/theme/SearchBar.js
+++ b/src/theme/SearchBar.js
@@ -1,17 +1,18 @@
 import React from 'react';
 import SearchBar from '@theme-original/SearchBar';
-import AskCookbook from '@cookbookdev/docsbot/react';
-import BrowserOnly from '@docusaurus/BrowserOnly';
+// import AskCookbook from '@cookbookdev/docsbot/react';
+// import BrowserOnly from '@docusaurus/BrowserOnly';
 /** It's a public API key, so it's safe to expose it here */
-const COOKBOOK_PUBLIC_API_KEY =
-  'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiI2NzEyYWRkYjk5YjBmNWViM2ZkODQxOGMiLCJpYXQiOjE3MjkyNzc0MDMsImV4cCI6MjA0NDg1MzQwM30._bhlmAnFpvxvkTV0PvU-6FwabhFOdSOx-qed2UIogpY';
+// const COOKBOOK_PUBLIC_API_KEY =
+//   'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiI2NzEyYWRkYjk5YjBmNWViM2ZkODQxOGMiLCJpYXQiOjE3MjkyNzc0MDMsImV4cCI6MjA0NDg1MzQwM30._bhlmAnFpvxvkTV0PvU-6FwabhFOdSOx-qed2UIogpY';
 export default function SearchBarWrapper(props) {
   return (
     <>
       <SearchBar {...props} />
-      <BrowserOnly>
+      {/* Replaced with Pylon chat widget integration */}
+      {/* <BrowserOnly>
         {() => <AskCookbook apiKey={COOKBOOK_PUBLIC_API_KEY} />}
-      </BrowserOnly>
+      </BrowserOnly> */}
     </>
   );
 }
diff --git a/src/ui/design-system/src/lib/Components/ContentFeatureList/index.tsx b/src/ui/design-system/src/lib/Components/ContentFeatureList/index.tsx
index b279b02dba..67212e27b4 100644
--- a/src/ui/design-system/src/lib/Components/ContentFeatureList/index.tsx
+++ b/src/ui/design-system/src/lib/Components/ContentFeatureList/index.tsx
@@ -12,14 +12,14 @@ const ContentFeatures: Record<string, ContentFeatureProps> = {
     image: 'feature-why-flow-image',
     header: 'Why Flow',
     text: "Explore Flow's scalable and high-performance blockchain architecture",
-    link: '/build/cadence/flow',
+    link: '/build/flow',
   },
   'smart-accounts': {
     icon: IconName.FEATURE_WAND_ICON,
     image: 'feature-wand-image',
     header: 'Smart Accounts',
     text: 'Benefit from flexible accounts with seamless key management for security and convenience',
-    link: 'build/basics/accounts',
+    link: '/build/cadence/basics/accounts',
   },
   transactions: {
     icon: IconName.FEATURE_STACKS_ICON,
@@ -62,31 +62,13 @@ const homepagePillData: Record<
     text: 'Flow AI Assistant',
     subText: 'Chat with devs',
     onClick: () => {
-      const el = document.querySelector('ask-cookbook') as HTMLElement & {
-        shadowRoot?: ShadowRoot;
-      };
-      if (!el) {
-        console.warn('ask-cookbook element not found');
-        return;
+      // Open Pylon chat widget instead of ask-cookbook
+      if (typeof window !== 'undefined' && window.Pylon) {
+        console.log('Opening Pylon chat widget from Flow AI Assistant button');
+        window.Pylon('show');
+      } else {
+        console.warn('Pylon widget not available yet');
       }
-
-      const shadow = el.shadowRoot;
-      if (!shadow) {
-        console.warn('ask-cookbook has no shadowRoot');
-        return;
-      }
-
-      const button = shadow.querySelector(
-        '#ask-cookbook-button',
-      ) as HTMLButtonElement;
-      if (!button) {
-        console.warn(
-          'Internal #ask-cookbook-button not found in the shadow root',
-        );
-        return;
-      }
-
-      button.click();
     },
   },
   'developer-chat': {
diff --git a/src/ui/design-system/src/lib/Components/GoldStarPanel/index.tsx b/src/ui/design-system/src/lib/Components/GoldStarPanel/index.tsx
index 36dce9aad6..3080146719 100644
--- a/src/ui/design-system/src/lib/Components/GoldStarPanel/index.tsx
+++ b/src/ui/design-system/src/lib/Components/GoldStarPanel/index.tsx
@@ -10,31 +10,13 @@ export const GoldStarPanel: React.FC = () => {
   const handleAskFlowAI = (e: React.MouseEvent) => {
     e.preventDefault();
 
-    const el = document.querySelector('ask-cookbook') as HTMLElement & {
-      shadowRoot?: ShadowRoot;
-    };
-    if (!el) {
-      console.warn('ask-cookbook element not found');
-      return;
+    // Open Pylon chat widget instead of ask-cookbook
+    if (typeof window !== 'undefined' && window.Pylon) {
+      console.log('Opening Pylon chat widget from Ask Flow AI button');
+      window.Pylon('show');
+    } else {
+      console.warn('Pylon widget not available yet');
     }
-
-    const shadow = el.shadowRoot;
-    if (!shadow) {
-      console.warn('ask-cookbook has no shadowRoot');
-      return;
-    }
-
-    const button = shadow.querySelector(
-      '#ask-cookbook-button',
-    ) as HTMLButtonElement;
-    if (!button) {
-      console.warn(
-        'Internal #ask-cookbook-button not found in the shadow root',
-      );
-      return;
-    }
-
-    button.click();
   };
 
   const progress = user.loggedIn ? getProgress() * 100 : 0;
@@ -47,13 +29,20 @@ export const GoldStarPanel: React.FC = () => {
     <div className="flex flex-col gap-4 h-full">
       <div className="flex gap-2">
         <button
-          onClick={() => window.open('https://calendar.google.com/calendar/embed?src=c_47978f5cd9da636cadc6b8473102b5092c1a865dd010558393ecb7f9fd0c9ad0%40group.calendar.google.com', '_blank')}
+          onClick={() =>
+            window.open(
+              'https://calendar.google.com/calendar/embed?src=c_47978f5cd9da636cadc6b8473102b5092c1a865dd010558393ecb7f9fd0c9ad0%40group.calendar.google.com',
+              '_blank',
+            )
+          }
           className={`flex-1 ${colors.black.dark} text-white px-4 py-2 rounded-xl hover:bg-gray-700 appearance-none cursor-pointer border-0`}
         >
           Office Hours
         </button>
         <button
-          onClick={() => window.open('https://github.com/orgs/onflow/discussions', '_blank')}
+          onClick={() =>
+            window.open('https://github.com/orgs/onflow/discussions', '_blank')
+          }
           className={`flex-1 ${colors.black.dark} text-white px-4 py-2 rounded-xl hover:bg-gray-700 appearance-none cursor-pointer border-0`}
         >
           Discussions
@@ -66,13 +55,13 @@ export const GoldStarPanel: React.FC = () => {
         </button>
       </div>
 
-      <div 
+      <div
         onClick={handleProfileClick}
         className={`${colors.black.dark} p-6 rounded-lg shadow-lg flex-1 hover:scale-[1.02] transition-transform cursor-pointer`}
       >
         <div className="w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700">
-          <div 
-            className={`${colors.flowgreen.light} h-2.5 rounded-full`} 
+          <div
+            className={`${colors.flowgreen.light} h-2.5 rounded-full`}
             style={{ width: `${progress}%` }}
           ></div>
         </div>
@@ -83,9 +72,7 @@ export const GoldStarPanel: React.FC = () => {
               : 'Please connect your wallet and create a profile'}
           </p>
           {user.loggedIn && progress < 100 && (
-            <p className="text-sm text-gray-100">
-              Learn More
-            </p>
+            <p className="text-sm text-gray-100">Learn More</p>
           )}
         </div>
       </div>
diff --git a/src/ui/design-system/src/lib/Pages/HomePage/HeroSection.tsx b/src/ui/design-system/src/lib/Pages/HomePage/HeroSection.tsx
index 0f104d87cb..68dbb89d86 100644
--- a/src/ui/design-system/src/lib/Pages/HomePage/HeroSection.tsx
+++ b/src/ui/design-system/src/lib/Pages/HomePage/HeroSection.tsx
@@ -101,4 +101,4 @@ const HeroSection: React.FC = () => {
   );
 };
 
-export default HeroSection; 
\ No newline at end of file
+export default HeroSection; 
diff --git a/src/ui/design-system/src/lib/Pages/HomePage/index.tsx b/src/ui/design-system/src/lib/Pages/HomePage/index.tsx
index fde319eaba..b2282be3ce 100644
--- a/src/ui/design-system/src/lib/Pages/HomePage/index.tsx
+++ b/src/ui/design-system/src/lib/Pages/HomePage/index.tsx
@@ -6,6 +6,8 @@ import HeroSection from './HeroSection';
 import FeatureSection from './FeatureSection';
 import BrowseByCategory from './BrowseByCategory';
 import QuickStartShowcase from './QuickStartShowcase';
+// import { ContentFeatureList } from '../../Components/ContentFeatureList';
+// import { HomeHeader } from '../../Components/HomeHeader';
 
 export type HomePageProps = {};