style: add QR code to sharepic layout

docs/marketing/sharepic.html

@@ -117,18 +117,41 @@
       font-weight: 600;
     }
 
+    .cta-container {
+      display: flex;
+      align-items: center;
+      gap: 20px;
+    }
+
     .cta-badge {
-      align-self: flex-start;
       background: linear-gradient(135deg, #38bdf8 0%, #0284c7 100%);
       color: #0f172a;
       font-size: 22px;
       font-weight: 800;
-      padding: 12px 28px;
+      padding: 14px 28px;
       border-radius: 12px;
       letter-spacing: -0.02em;
       box-shadow: 0 4px 20px rgba(56, 189, 248, 0.25);
     }
 
+    .qr-code {
+      width: 60px;
+      height: 60px;
+      background: #ffffff;
+      padding: 4px;
+      border-radius: 8px;
+      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .qr-code img {
+      width: 100%;
+      height: 100%;
+      object-fit: contain;
+    }
+
     .right-col {
       flex: 0.9;
       display: flex;
@@ -249,8 +272,13 @@
         Führe dein Bordlogbuch modern & digital: Reisetage, GPS-Tracks, Crew- und Schiffsdaten — 
         <strong>Ende-zu-Ende-verschlüsselt</strong>, als App installierbar und <strong>auch offline</strong> auf See nutzbar.
       </p>
-      <div class="cta-badge">
-        kapteins-daagbok.eu
+      <div class="cta-container">
+        <div class="cta-badge">
+          kapteins-daagbok.eu
+        </div>
+        <div class="qr-code">
+          <img src="assets/qr-kapteins-daagbok.eu.png" alt="QR Code" />
+        </div>
       </div>
     </div>
     <div class="right-col">