(() => {
  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);
  }

  // Ring um das Logo-Siegel: Kreis + die vier Kachel-Lücken, Übergänge mit Radius f abgerundet
  const seal = document.querySelector('.seal');
  const joint = document.querySelector('.seal-joint');
  if (seal && joint) {
    const drawJoint = () => {
      const gap = parseFloat(getComputedStyle(seal.parentElement).columnGap) || 14;
      const h = gap / 2;                     // halbe Lückenbreite
      const R = seal.offsetWidth / 2 + gap;  // Außenradius des Rings
      const f = 18;                          // Radius der Rundung
      const yd = Math.sqrt((R + f) ** 2 - (h + f) ** 2);
      const k = R / (R + f);
      const L = Math.ceil(R + f + 2);        // Arme reichen bis zum Rand der Fläche
      const rot = ([x, y], n) => { for (let i = 0; i < n; i++) [x, y] = [-y, x]; return [x + L, y + L]; };
      const pt = (p, n) => rot(p, n).map(v => v.toFixed(2)).join(' ');
      let d = `M${pt([-(h + f) * k, -yd * k], 0)}`;
      for (let n = 0; n < 4; n++) {
        d += ` A${f} ${f} 0 0 0 ${pt([-h, -yd], n)}`
          + ` L${pt([-h, -L], n)} L${pt([h, -L], n)} L${pt([h, -yd], n)}`
          + ` A${f} ${f} 0 0 0 ${pt([(h + f) * k, -yd * k], n)}`
          + ` A${R} ${R} 0 0 1 ${pt([-(h + f) * k, -yd * k], n + 1)}`;
      }
      joint.setAttribute('width', 2 * L);
      joint.setAttribute('height', 2 * L);
      joint.setAttribute('viewBox', `0 0 ${2 * L} ${2 * L}`);
      joint.firstElementChild.setAttribute('d', d + ' Z');
    };
    drawJoint();
    addEventListener('resize', drawJoint);
  }

  // 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'));
  }
})();