Show blurred spacer.png overlay on members/wiki sections when not logged in

- Instead of hiding main-content, members and wiki sections stay visible
- Each section has a .section-locked overlay with spacer.png blurred 16px
- Semi-transparent white layer + frosted-glass CTA card on top
- CTA says 'Login via Telegram' with the same bot deep-link as Anmelden
- checkSession() now toggles overlay visibility instead of hiding the whole main

css/styles.css

@@ -813,6 +813,7 @@ body[data-lang="en"] .hide-de { display: none !important; }
   max-width: 1200px;
   box-shadow: 0 1px 3px rgba(0,0,0,0.06);
   transition: box-shadow 0.3s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
+  position: relative;
 }
 .section:hover {
   box-shadow: 0 4px 12px rgba(0,0,0,0.08);
@@ -1501,6 +1502,78 @@ TELEGRAM BANNER
 .calendar-event-headline a:hover { text-decoration: underline; }
 .calendar-event-time { color: #65676b; white-space: nowrap; }
 
+/* ========================================
+   SECTION LOCKED OVERLAY — blurred preview for non-logged-in users
+   ======================================== */
+.section-locked {
+  position: absolute;
+  inset: 0;
+  z-index: 10;
+  border-radius: 12px;
+  overflow: hidden;
+  display: block;
+}
+.locked-bg {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  filter: blur(16px);
+  -webkit-filter: blur(16px);
+  transform: scale(1.1);
+}
+.locked-overlay {
+  position: absolute;
+  inset: 0;
+  background: rgba(255, 255, 255, 0.55);
+  backdrop-filter: blur(4px);
+  -webkit-backdrop-filter: blur(4px);
+}
+.locked-cta {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 24px;
+}
+.locked-cta-content {
+  text-align: center;
+  max-width: 480px;
+  background: rgba(255,255,255,0.92);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  padding: 32px 28px;
+  border-radius: 16px;
+  box-shadow: 0 8px 32px rgba(0,0,0,0.12);
+  border: 1px solid rgba(255,255,255,0.5);
+}
+.locked-icon { font-size: 2.8rem; margin-bottom: 12px; }
+.locked-title {
+  font-size: 1.3rem;
+  font-weight: 700;
+  color: #1c1e21;
+  margin: 0 0 10px;
+}
+.locked-desc {
+  font-size: 0.95rem;
+  color: #57606a;
+  line-height: 1.55;
+  margin: 0 0 20px;
+}
+.locked-hint {
+  font-size: 0.82rem;
+  color: #999;
+  margin: 14px 0 0;
+  font-style: italic;
+}
+.locked-login-btn {
+  display: inline-flex !important;
+  align-items: center;
+  gap: 8px;
+}
+
 /* ========================================
    FOOTER
    ======================================== */

index.html

@@ -358,6 +358,31 @@
 
     <!-- Members Section -->
     <section class="section section-alt fade-in-section" id="members">
+      <div class="section-locked" id="members-locked">
+        <img class="locked-bg" src="/spacer.png" alt="" aria-hidden="true">
+        <div class="locked-overlay"></div>
+        <div class="locked-cta">
+          <div class="locked-cta-content">
+            <div class="locked-icon">🔒</div>
+            <h3 class="locked-title">
+              <span class="hide-de">Exklusiver Mitgliederbereich</span>
+              <span class="hide-en">Exclusive Members Area</span>
+            </h3>
+            <p class="locked-desc">
+              <span class="hide-de">Melde dich über Telegram an, um Zugriff auf unsere Mitgliederliste, das Wiki und alle Inhalte zu erhalten.</span>
+              <span class="hide-en">Sign in via Telegram to get access to our member directory, wiki, and everything else.</span>
+            </p>
+            <a href="https://t.me/YourBotUsername?start=send_a_login_link" target="_blank" rel="noopener" class="btn btn-primary locked-login-btn">
+              <span class="hide-de">Per Telegram anmelden</span>
+              <span class="hide-en">Login via Telegram</span>
+            </a>
+            <p class="locked-hint">
+              <span class="hide-de">Nach der Anmeldung erhältst du in Telegram einen Link, der dich hier freischaltet.</span>
+              <span class="hide-en">After signing in you will receive a link in Telegram that unlocks this page.</span>
+            </p>
+          </div>
+        </div>
+      </div>
       <div class="container">
         <h2 class="section-title">
           <span class="hide-de">Mitglieder</span>
@@ -378,6 +403,27 @@
 
     <!-- Wiki Section -->
     <section class="section fade-in-section" id="wiki">
+      <div class="section-locked" id="wiki-locked">
+        <img class="locked-bg" src="/spacer.png" alt="" aria-hidden="true">
+        <div class="locked-overlay"></div>
+        <div class="locked-cta">
+          <div class="locked-cta-content">
+            <div class="locked-icon">🔒</div>
+            <h3 class="locked-title">
+              <span class="hide-de">Exklusiver Wiki-Bereich</span>
+              <span class="hide-en">Exclusive Wiki Area</span>
+            </h3>
+            <p class="locked-desc">
+              <span class="hide-de">Melde dich über Telegram an, um auf unser Wiki mit allen Erfahrungen zu Steuern, Banken und Rechtlichem zuzugreifen.</span>
+              <span class="hide-en">Sign in via Telegram to access our wiki with all experiences on taxes, banking and legal matters.</span>
+            </p>
+            <a href="https://t.me/YourBotUsername?start=send_a_login_link" target="_blank" rel="noopener" class="btn btn-primary locked-login-btn">
+              <span class="hide-de">Per Telegram anmelden</span>
+              <span class="hide-en">Login via Telegram</span>
+            </a>
+          </div>
+        </div>
+      </div>
       <div class="container">
         <h2 class="section-title">
           <span class="hide-de">Wiki</span>

js/main.js

@@ -347,6 +347,8 @@ function checkSession() {
     document.getElementById('telegram-banner').style.display = 'none';
     document.getElementById('main-content').style.display = 'block';
     document.getElementById('newsletter-section').style.display = 'block';
+    // Remove locked overlays
+    document.querySelectorAll('.section-locked').forEach(el => el.style.display = 'none');
     loadUsers();
     loadWiki();
     loadDates();
@@ -356,8 +358,10 @@ function checkSession() {
     document.getElementById('logout-btn').style.display = 'none';
     document.getElementById('profile-btn').style.display = 'none';
     document.getElementById('telegram-banner').style.display = 'block';
-    document.getElementById('main-content').style.display = 'none';
+    document.getElementById('main-content').style.display = 'block';
     document.getElementById('newsletter-section').style.display = 'none';
+    // Show locked overlays
+    document.querySelectorAll('.section-locked').forEach(el => el.style.display = '');
   }
 }