CTA update

assets/css/screen.css

@@ -777,7 +777,7 @@ Search                         LOGO                    Login Subscribe
 }
 
 .gh-card-title {
-    font-size: 2.2rem;
+    font-size: 2.1rem;
     font-weight: 800;
     letter-spacing: -0.014em;
 }
@@ -1161,7 +1161,7 @@ Search                         LOGO                    Login Subscribe
 .gh-featured-feed .gh-card-title {
     display: -webkit-box;
     overflow-y: hidden;
-    font-size: 1.6rem;
+    font-size: 1.7rem;
     font-weight: 725;
     letter-spacing: -0.011em;
     -webkit-line-clamp: 3;
@@ -1295,6 +1295,7 @@ Search                         LOGO                    Login Subscribe
 .gh-container.is-grid .gh-feed {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
+    row-gap: calc(var(--grid-gap) * 1.5);
     overflow: hidden;
 }
 
@@ -2000,33 +2001,24 @@ figcaption a {
 }
 
 .gh-cta {
-    margin-top: 64px;
+    margin-top: calc(var(--grid-gap) / 2);
 }
 
 .gh-cta-inner {
     display: flex;
-    flex-direction: row;
+    flex-direction: column;
     align-items: center;
-    gap: 34px;
-    padding-top: 40px;
+    gap: 24px;
+    padding-top: 80px;
     border-top: 1px solid var(--color-border);
 }
 
-.gh-cta-inner > * {
-    flex: 1;
-}
-
-.gh-cta-content {
-    padding: 8px 0 8px 24px;
-    border-left: 8px solid var(--ghost-accent-color);
-}
-
 .gh-cta-title {
     max-width: 720px;
-    font-size: 3.8rem;
-    font-weight: 750;
+    font-size: 4.4rem;
+    font-weight: 800;
     line-height: 1.1;
-    letter-spacing: -0.017em;
+    letter-spacing: -0.026em;
 }
 
 .gh-cta-description {
@@ -2034,7 +2026,7 @@ figcaption a {
     font-size: 2rem;
     font-weight: 450;
     line-height: 1.4;
-    letter-spacing: -.015em;
+    letter-spacing: -.017em;
     color: var(--color-secondary-text);
 }
 
@@ -2043,7 +2035,7 @@ figcaption a {
     align-items: center;
     position: relative;
     overflow: hidden;
-    max-width: 640px;
+    max-width: 520px;
     width: 100%;
     height: 64px;
     font-size: 1.8rem;
@@ -2061,7 +2053,7 @@ figcaption a {
 .gh-cta .gh-header-input {
     position: absolute;
     inset: 0;
-    padding-inline: 28px;
+    padding-inline: 26px;
     width: 100%;
     height: 100%;
     font-size: inherit;

partials/components/cta.hbs

@@ -1,8 +1,13 @@
 <section class="gh-cta gh-outer">
     <div class="gh-cta-inner gh-inner">
         <div class="gh-cta-content">
-            <h2 class="gh-cta-title is-title">{{@custom.footer_signup_header}}</h2>
-            <p class="gh-cta-description is-body">{{@custom.footer_signup_subhead}}</p>
+            <h2 class="gh-cta-title is-title">
+                {{#if @custom.footer_signup_header}}
+                    {{@custom.footer_signup_header}}
+                {{else}}
+                    Subscribe to {{@site.title}}
+                {{/if}}
+            </h2>
         </div>
         <form class="gh-header-form">
             <input class="gh-header-input" type="email" placeholder="jamie@example.com">

partials/components/footer.hbs

@@ -19,7 +19,13 @@
 
         <section class="gh-footer-signup">
             {{#if @custom.footer_signup_header}}
-                <h2 class="gh-footer-signup-header is-title">{{@custom.footer_signup_header}}</h2>
+                <h2 class="gh-footer-signup-header is-title">
+                    {{#if @custom.footer_signup_header}}
+                        {{@custom.footer_signup_header}}
+                    {{else}}
+                        Subscribe to {{@site.title}}
+                    {{/if}}
+                </h2>
             {{/if}}
             {{#if @custom.footer_signup_subhead}}
                 <p class="gh-footer-signup-subhead is-body">{{@custom.footer_signup_subhead}}</p>