Erster Entwurf: Landingpage mit 4 Kacheln und Unterseiten

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

assets/site.js

@@ -0,0 +1,42 @@
+(() => {
+  const body = document.body;
+
+  // Mobiles Menü
+  const burger = document.querySelector('.burger');
+  if (burger) {
+    burger.addEventListener('click', () => {
+      const open = body.classList.toggle('menu-open');
+      burger.setAttribute('aria-expanded', open);
+    });
+    document.querySelectorAll('.nav a').forEach(a =>
+      a.addEventListener('click', () => {
+        body.classList.remove('menu-open');
+        burger.setAttribute('aria-expanded', 'false');
+      })
+    );
+  }
+
+  // Startseite: Header einblenden, sobald der Hero verlassen wird
+  const hero = document.querySelector('.hero');
+  if (body.classList.contains('is-home') && hero) {
+    new IntersectionObserver(([e]) => body.classList.toggle('scrolled', !e.isIntersecting), {
+      rootMargin: '-120px 0px 0px 0px'
+    }).observe(hero);
+  }
+
+  // Elemente beim Scrollen einblenden
+  const items = document.querySelectorAll('.reveal');
+  if ('IntersectionObserver' in window) {
+    const io = new IntersectionObserver(entries => {
+      entries.forEach(e => {
+        if (e.isIntersecting) {
+          e.target.classList.add('in');
+          io.unobserve(e.target);
+        }
+      });
+    }, { threshold: 0.12, rootMargin: '0px 0px -40px 0px' });
+    items.forEach(el => io.observe(el));
+  } else {
+    items.forEach(el => el.classList.add('in'));
+  }
+})();