Add mobile menu outside/escape close and sticky header scrolled state

public/js/main.js

@@ -3,6 +3,11 @@
   const nav = document.getElementById('siteNav');
 
   if (toggle && nav) {
+    const closeMenu = () => {
+      toggle.setAttribute('aria-expanded', 'false');
+      nav.classList.remove('open');
+    };
+
     toggle.addEventListener('click', () => {
       const expanded = toggle.getAttribute('aria-expanded') === 'true';
       toggle.setAttribute('aria-expanded', String(!expanded));
@@ -11,10 +16,31 @@
 
     nav.querySelectorAll('a').forEach((link) => {
       link.addEventListener('click', () => {
-        toggle.setAttribute('aria-expanded', 'false');
-        nav.classList.remove('open');
+        closeMenu();
       });
     });
+
+    document.addEventListener('click', (event) => {
+      if (!nav.classList.contains('open')) return;
+      if (nav.contains(event.target) || toggle.contains(event.target)) return;
+      closeMenu();
+    });
+
+    document.addEventListener('keydown', (event) => {
+      if (event.key === 'Escape' && nav.classList.contains('open')) {
+        closeMenu();
+      }
+    });
+  }
+
+  const siteHeader = document.getElementById('siteHeader');
+  if (siteHeader) {
+    const syncScrolledState = () => {
+      siteHeader.classList.toggle('is-scrolled', window.scrollY > 8);
+    };
+
+    syncScrolledState();
+    window.addEventListener('scroll', syncScrolledState, { passive: true });
   }
 
   const reveals = document.querySelectorAll('[data-reveal]');