feat: update landing page, changelog, compare, quick-start with darkMode + hideSelectors features

.gitignore

@@ -34,4 +34,4 @@ Thumbs.db
 # Temporary files
 *.tmp
 *.temp
-.cache/
+.cache/*.pyc

public/changelog.html

@@ -127,10 +127,29 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   <div class="timeline">
 
     <div class="release latest">
+      <div class="release-header">
+        <span class="release-version">v0.7.0</span>
+        <span class="release-date">March 4, 2026</span>
+        <span class="release-tag">Latest</span>
+      </div>
+      <div class="release-body">
+        <ul>
+          <li>✨ New: <code>darkMode</code> parameter — emulate prefers-color-scheme: dark for dark mode screenshots</li>
+          <li>✨ New: <code>hideSelectors</code> parameter — hide elements by CSS selector before capture (max 10, 200 chars each)</li>
+          <li>🔒 Fixed: Cancelled subscriptions now properly blocked (was incorrectly getting free tier)</li>
+          <li>🔒 Fixed: Recovery endpoint no longer logs full API keys</li>
+          <li>🛡️ Added: Rate limiting on billing endpoints (10 req/15min)</li>
+          <li>🐛 Fixed: FAQ accordion double-toggle</li>
+          <li>🐛 Fixed: Privacy/Terms/Impressum 404s on extensionless URLs</li>
+          <li>📊 355 tests passing</li>
+        </ul>
+      </div>
+    </div>
+
+    <div class="release">
       <div class="release-header">
         <span class="release-version">v0.6.0</span>
         <span class="release-date">March 2026</span>
-        <span class="release-tag">Latest</span>
       </div>
       <div class="release-body">
         <ul>

public/compare.html

@@ -129,6 +129,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
         <ul>
           <li>EU data residency (Germany)</li>
           <li>POST &amp; GET endpoints</li>
+          <li>Dark mode capture support</li>
+          <li>Element hiding (CSS selectors)</li>
           <li>Built-in response caching</li>
           <li>Free playground, no signup</li>
           <li>Node.js &amp; Python SDKs</li>
@@ -189,6 +191,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <ul class="feature-list">
       <li><span class="icon">🇪🇺</span> <strong>EU-hosted &amp; GDPR compliant</strong> — All rendering happens on servers in Germany. Your data never leaves the EU. No extra DPAs or compliance headaches.</li>
       <li><span class="icon">💶</span> <strong>Simple EUR pricing</strong> — No currency conversion, no hidden fees. Plans start at €9/month with clear per-screenshot pricing.</li>
+      <li><span class="icon">🌙</span> <strong>Dark mode capture</strong> — Take screenshots in dark mode with a single parameter. Perfect for showcasing dark themes and modern designs.</li>
+      <li><span class="icon">👁️‍🗨️</span> <strong>Element hiding</strong> — Hide cookie banners, popups, and ads before capture using CSS selectors for clean results.</li>
       <li><span class="icon">🔗</span> <strong>GET &amp; POST endpoints</strong> — Use GET requests to embed screenshots directly in <code>&lt;img&gt;</code> tags. No server-side code needed for simple use cases.</li>
       <li><span class="icon">⚡</span> <strong>Built-in caching</strong> — Response caching out of the box. Repeated requests for the same URL return cached results instantly.</li>
       <li><span class="icon">🎮</span> <strong>Free playground</strong> — Try the API in your browser without creating an account or entering payment details.</li>

public/guides/quick-start.html

@@ -196,6 +196,36 @@ screenshot = client.<span class="fn">take</span>(
       </div>
     </div>
 
+    <div class="step">
+      <div class="step-number">6</div>
+      <h2>Dark Mode and Element Hiding</h2>
+      <p>Take advantage of SnapAPI's newest features for cleaner, more professional screenshots:</p>
+
+      <h4>Dark Mode Screenshots</h4>
+      <p>Capture websites in dark mode by setting <code>darkMode: true</code>:</p>
+      
+      <div class="code-window">
+        <div class="code-titlebar"><span class="code-dot"></span><span class="code-dot"></span><span class="code-dot"></span><span>cURL</span></div>
+        <div class="code-body"><pre>curl -X POST https://snapapi.eu/v1/screenshot \
+  -H <span class="str">"Content-Type: application/json"</span> \
+  -H <span class="str">"X-API-Key: YOUR_API_KEY"</span> \
+  -d <span class="str">'{"url": "https://example.com", "darkMode": true}'</span></pre></div>
+      </div>
+
+      <h4>Hide Unwanted Elements</h4>
+      <p>Remove cookie banners, popups, and ads using CSS selectors:</p>
+
+      <div class="code-window">
+        <div class="code-titlebar"><span class="code-dot"></span><span class="code-dot"></span><span class="code-dot"></span><span>cURL</span></div>
+        <div class="code-body"><pre>curl -X POST https://snapapi.eu/v1/screenshot \
+  -H <span class="str">"Content-Type: application/json"</span> \
+  -H <span class="str">"X-API-Key: YOUR_API_KEY"</span> \
+  -d <span class="str">'{"url": "https://example.com", "hideSelectors": ["#cookie-banner", ".popup", ".ads"]}'</span></pre></div>
+      </div>
+
+      <p>You can combine both features for clean dark mode screenshots without distractions.</p>
+    </div>
+
     <div class="cta-box">
       <h2>Ready to Build?</h2>
       <p>Get your API key and start capturing screenshots in production.</p>

public/index.html

@@ -293,8 +293,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
 <span class="kw">curl</span> <span class="flag">-X POST</span> <span class="url">https://snapapi.eu/v1/screenshot</span> \
   <span class="flag">-H</span> <span class="str">"Authorization: Bearer YOUR_API_KEY"</span> \
   <span class="flag">-H</span> <span class="str">"Content-Type: application/json"</span> \
-  <span class="flag">-d</span> <span class="str">'{"url":"https://example.com","format":"png"}'</span> \
+  <span class="flag">-d</span> <span class="str">'{"url":"https://example.com","format":"png","darkMode":true}'</span> \
   <span class="flag">-o</span> <span class="str">screenshot.png</span>
+
+<span class="cmt"># Hide elements before capture</span>
+<span class="kw">curl</span> <span class="flag">-X POST</span> <span class="url">https://snapapi.eu/v1/screenshot</span> \
+  <span class="flag">-H</span> <span class="str">"Authorization: Bearer YOUR_API_KEY"</span> \
+  <span class="flag">-H</span> <span class="str">"Content-Type: application/json"</span> \
+  <span class="flag">-d</span> <span class="str">'{"url":"https://example.com","hideSelectors":["#cookie-banner",".popup"]}'</span>
         </div>
         <div class="code-body" id="code-get" style="display:none">
 <span class="cmt"># GET request with query parameters</span>
@@ -319,6 +325,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   <span class="prop">format</span>: <span class="str">'png'</span>,
   <span class="prop">width</span>: <span class="num">1920</span>,
   <span class="prop">fullPage</span>: <span class="kw">true</span>,
+  <span class="prop">darkMode</span>: <span class="kw">true</span>,
+  <span class="prop">hideSelectors</span>: [<span class="str">'#cookie-banner'</span>, <span class="str">'.popup'</span>],
 });
         </div>
         <div class="code-body" id="code-python" style="display:none">
@@ -332,6 +340,8 @@ screenshot = snap.<span class="fn">capture</span>(
     <span class="prop">format</span>=<span class="str">"png"</span>,
     <span class="prop">width</span>=<span class="num">1920</span>,
     <span class="prop">full_page</span>=<span class="kw">True</span>,
+    <span class="prop">dark_mode</span>=<span class="kw">True</span>,
+    <span class="prop">hide_selectors</span>=[<span class="str">"#cookie-banner"</span>, <span class="str">".popup"</span>],
 )
         </div>
       </div>
@@ -474,6 +484,16 @@ screenshot = snap.<span class="fn">capture</span>(
         <h3>Wait for Elements</h3>
         <p>Use CSS selectors to wait for specific elements before capturing. Ideal for SPAs and dynamic content.</p>
       </div>
+      <div class="feature-card">
+        <div class="feature-icon purple">🌙</div>
+        <h3>Dark Mode Capture</h3>
+        <p>Capture websites in dark mode with a single parameter. Perfect for design previews, marketing materials, and app stores.</p>
+      </div>
+      <div class="feature-card">
+        <div class="feature-icon pink">👁️‍🗨️</div>
+        <h3>Element Hiding</h3>
+        <p>Hide cookie banners, popups, and ads before capture. Get clean screenshots every time with CSS selector-based hiding.</p>
+      </div>
       <div class="feature-card">
         <div class="feature-icon purple">⚡</div>
         <h3>Response Caching</h3>