diff --git a/_includes/layouts/base.njk b/_includes/layouts/base.njk
index 28c781e..d3b5dbe 100644
--- a/_includes/layouts/base.njk
+++ b/_includes/layouts/base.njk
@@ -54,18 +54,9 @@
   <link rel="icon" type="image/x-icon" href="/favicon.ico">
 
   <link rel="stylesheet" href="/pagefind/pagefind-ui.css">
-  <script src="/pagefind/pagefind-ui.js" defer></script>
   <script>
-    // Pagefind init helper — queues creation until PagefindUI is available (deferred script)
     var _pfQueue = [];
     function initPagefind(sel, opts) { _pfQueue.push([sel, opts]); }
-    document.addEventListener("DOMContentLoaded", function() {
-      if (typeof PagefindUI === "undefined") return;
-      for (var i = 0; i < _pfQueue.length; i++) {
-        var el = document.querySelector(_pfQueue[i][0]);
-        if (el) new PagefindUI(Object.assign({ element: _pfQueue[i][0], showSubResults: false, showImages: false }, _pfQueue[i][1] || {}));
-      }
-    });
   </script>
   <link rel="stylesheet" href="/css/style.css?v={{ '/css/style.css' | hash }}">
   <link rel="stylesheet" href="/css/prism-theme.css?v={{ '/css/prism-theme.css' | hash }}">
@@ -485,5 +476,15 @@
       </svg>
     </button>
   </div>
+  {# Pagefind — load at end of body so all DOM elements exist, then process queue #}
+  <script src="/pagefind/pagefind-ui.js"></script>
+  <script>
+    (function() {
+      if (typeof PagefindUI === "undefined") { console.warn("[pagefind] PagefindUI not loaded"); return; }
+      for (var i = 0; i < _pfQueue.length; i++) {
+        new PagefindUI(Object.assign({ element: _pfQueue[i][0], showSubResults: false, showImages: false }, _pfQueue[i][1] || {}));
+      }
+    })();
+  </script>
 </body>
 </html>