Close the open menu on a click beside it and add social icons

The open burger menu now closes when someone clicks elsewhere, without a
script: an invisible layer that belongs to the menu button covers the
page while the menu is open. Facebook, Instagram and WhatsApp join the
icon set, so menu buttons can carry them. The stroke attributes of every
icon move into the stylesheet, which saves about 4 KB per page.

Hüfner gets a right-aligned menu with the quote button, Facebook and
Instagram as menu buttons.

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

templates/blocks/icon.html.twig

@@ -1,4 +1,6 @@
-{# Inline SVG from a fixed allowlist. No icon font, no external request, no extra stylesheet. #}
+{# Inline SVG from a fixed allowlist. No icon font, no external request, no extra stylesheet.
+   Facebook, Instagram und WhatsApp am Ende: dieselben Formen wie social-icon.html.twig, damit sie
+   auch als Symbol eines Menü-Buttons oder Bausteins wählbar sind. #}
 {% set paths = {
     'arrow-up-right': 'M6.5 17.5 17.5 6.5M8.5 6.5h9v9',
     'arrow-right': 'M4 12h15.5m-6.5-6.5 6.5 6.5-6.5 6.5',
@@ -97,6 +99,9 @@
     laptop: 'M5 5h14v10H5Zm-2.5 10h19l-1 3.5h-17Z',
     hardware: 'M4 5h16v11H4Zm4 15h8m-4-4v4',
     network: 'M5 3h14v5H5Zm0 13h14v5H5Zm7-8v8M8 8v3h8V8',
-    design: 'M4 20h16M6 16 18 4l3 3L9 19l-4 1Z'
+    design: 'M4 20h16M6 16 18 4l3 3L9 19l-4 1Z',
+    facebook: 'M15.5 4h-2.2A3.8 3.8 0 0 0 9.5 7.8V10H7v3.2h2.5V20h3.3v-6.8h2.4l.5-3.2h-2.9V8.2c0-.6.3-.9.9-.9h2Z',
+    instagram: 'M8.1 3.5h7.8a4.6 4.6 0 0 1 4.6 4.6v7.8a4.6 4.6 0 0 1-4.6 4.6H8.1a4.6 4.6 0 0 1-4.6-4.6V8.1a4.6 4.6 0 0 1 4.6-4.6ZM12 8.1a3.9 3.9 0 1 0 0 7.8 3.9 3.9 0 0 0 0-7.8ZM17 7h.01',
+    whatsapp: 'M4 20l1.4-4A8.5 8.5 0 1 1 8.6 19.1ZM9.3 9.2c0 3 2.5 5.5 5.5 5.5l1.3-1.4-2-.9-.9.8a4.1 4.1 0 0 1-2.3-2.3l.8-.9-.9-2Z'
 } %}
-<svg class="block-icon" viewBox="0 0 24 24" width="32" height="32" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="{{ paths[name] }}"/></svg>
+{# Strich, Farbe und Enden stehen als Regel für svg.block-icon in site.css und admin.css, nicht an jedem Symbol: eine Seite trägt um die 40 davon. #}<svg class="block-icon" viewBox="0 0 24 24" width="32" height="32" aria-hidden="true" focusable="false"><path d="{{ paths[name] }}"/></svg>