Neuigkeiten: News-Pinnwand auf der Startseite

Sektion 'Neues aus dem Laden' nach dem Hero. Die Beitraege schreibt Opa Martin
im WEBklar-Kundenportal (Funktion News); news.js von project.webklar.com zeigt
sie als Korkwand. Ohne Beitraege bleibt der statische Leerzustand stehen.
Menuepunkt 'Neuigkeiten' (am Handy ausgeblendet, 4 Punkte passen),
Datenschutz Abschnitt 4c, Stand 30.09.2026.

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

index.html

@@ -23,6 +23,7 @@
     </a>
     <nav class="nav" aria-label="Hauptnavigation">
       <a href="index.html" aria-current="page">Start</a>
+      <a class="nav__news" href="index.html#neuigkeiten">Neuigkeiten</a>
       <a href="shop.html">Shop</a>
       <a href="hilfe-verein.html">Hilfe Verein</a>
       <a href="hilfe-verein.html#kontakt">Kontakt</a>
@@ -64,6 +65,25 @@
     </div>
   </section>
 
+  <!-- News-Pinnwand (WEBklar Kundenportal, Funktion "News"). Beitraege schreibt Opa Martin im Portal;
+       news.js ersetzt den Leerzustand, sobald mindestens ein Beitrag haengt. -->
+  <section class="wrap section" id="neuigkeiten">
+    <div class="sh">
+      <span class="sh__chip" style="--chip-bg:var(--coral-600)"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 17v5"/><path d="M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z"/></svg></span>
+      <h2>Neues aus dem Laden</h2>
+    </div>
+    <p class="news-lead">Was gerade reingekommen ist, wann ich zu habe und was sonst so los ist. Frisch von mir an die Pinnwand gehängt.</p>
+    <div class="news-pinnwand" data-webklar-news="q74ehq7hvnpiymqy" data-api="https://project.webklar.com" data-signature="Opa Martin">
+      <div class="news-board">
+        <div class="news-empty">
+          <span class="news-empty__pin"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 17v5"/><path d="M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z"/></svg></span>
+          <h3>Hier hängt bald was Neues.</h3>
+          <p>Neue Ware, Aktionen und Öffnungszeiten findest du ab jetzt an dieser Pinnwand. Schau bald wieder vorbei.</p>
+        </div>
+      </div>
+    </div>
+  </section>
+
   <section class="wrap section" id="ueber-mich">
     <div class="sh">
       <span class="sh__chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"/></svg></span>
@@ -213,5 +233,6 @@
 </footer>
 
 <script src="assets/player.js" defer></script>
+<script src="https://project.webklar.com/embed/news.js" defer></script>
 </body>
 </html>