diff --git a/assets/css/screen.css b/assets/css/screen.css
index 769a44a7..b4185bd6 100644
--- a/assets/css/screen.css
+++ b/assets/css/screen.css
@@ -2262,6 +2262,20 @@ unless a heading is the very first element in the post content */
     font-family: var(--font-mono);
 }
 
+/* Public Preview Fading Effect for Last Paragraph */
+.fadeout-content p:last-child {
+    -webkit-mask-image: linear-gradient(to bottom, var(--color-black) 1%, transparent 100%);
+    mask-image: linear-gradient(to bottom, var(--color-black) 1%, transparent 100%);
+    margin-bottom: 1.5em; /* Ensure consistent spacing */
+}
+
+/* Reset other paragraphs to prevent unintended effects */
+.fadeout-content p:not(:last-child) {
+    -webkit-mask-image: none;
+    mask-image: none;
+    margin-bottom: 1.5em; /* Ensure normal paragraph spacing */
+}
+  
 /* 16. Cards
 /* ---------------------------------------------------------- */
 
diff --git a/partials/content-cta b/partials/content-cta
new file mode 100644
index 00000000..f4b2e3be
--- /dev/null
+++ b/partials/content-cta
@@ -0,0 +1,24 @@
+{{{html}}}
+<div class="fadeout">
+    <div class="fadeout-content">
+        {{{html}}}
+    </div>
+</div>
+    <div class="gh-post-upgrade-cta-content" style="background-color: {{@site.accent_color}}">
+        {{#has visibility="paid"}}
+            <h2>This content is for paying subscribers only</h2>
+        {{/has}}
+        {{#has visibility="members"}}
+            <h2>This content is for subscribers only</h2>
+        {{/has}}
+        {{#has visibility="tiers"}}
+            <h2>This content is for subscribers on the following tiers only: {{tiers}}</h2>
+        {{/has}}
+        {{#if @member}}
+            <a class="gh-btn" data-portal="account/plans" href="#/portal/account/plans" style="color:{{@site.accent_color}}">Upgrade your account</a>
+        {{else}}
+            <a class="gh-btn" data-portal="signup" href="#/portal/signup" style="color:{{@site.accent_color}}">Subscribe</a>
+            <p><small>Already member? <a data-portal="signin" href="#/portal/signin">Sign in</a></small></p>
+        {{/if}}
+    </div>
+</aside>