From efe35671d94a81d90fca16b20e2a4e593e74cd31 Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Mon, 21 Dec 2015 15:41:44 +0100
Subject: [PATCH] hero copy tweaks

---
 _src/_assets/styles/bigchain/_variables.scss |  2 +-
 _src/_assets/styles/page-front.scss          | 38 +++++++++++++-------
 _src/index.html                              |  3 +-
 3 files changed, 29 insertions(+), 14 deletions(-)

diff --git a/_src/_assets/styles/bigchain/_variables.scss b/_src/_assets/styles/bigchain/_variables.scss
index eef23cd..e4cacf2 100644
--- a/_src/_assets/styles/bigchain/_variables.scss
+++ b/_src/_assets/styles/bigchain/_variables.scss
@@ -47,7 +47,7 @@ $font-size-root-lg:         18px !default;
 
 $font-size-base:            1rem !default;
 $font-size-lg:              1.25rem !default;
-$font-size-sm:              0.75rem !default;
+$font-size-sm:              0.875rem !default;
 $font-size-xs:              0.75rem !default;
 
 $font-size-h1:              3rem !default;
diff --git a/_src/_assets/styles/page-front.scss b/_src/_assets/styles/page-front.scss
index d93c946..8768e71 100644
--- a/_src/_assets/styles/page-front.scss
+++ b/_src/_assets/styles/page-front.scss
@@ -31,11 +31,6 @@
         z-index: 0;
     }
 
-    .hero__content {
-        position: relative;
-        z-index: 1;
-    }
-
     .logo {
         fill-opacity: .6;
         margin: auto;
@@ -49,14 +44,14 @@
 
     .section-title {
         color: #fff;
-        margin-bottom: ($spacer * 3);
+        margin-bottom: $spacer;
 
         &:after { display: none }
     }
 
     .btn-link {
         color: #fff;
-        margin-top: ($spacer * 3);
+        margin-top: ($spacer * 4);
         opacity: .7;
 
         &:hover,
@@ -80,10 +75,15 @@
         }
     }
 
+    .btn-link {
+
+    }
+
     // intro animation
     .logo,
     .section-title,
-    .btn {
+    .btn,
+    .hero__comingsoon {
         @extend .animation-slide-in-from-bottom;
         animation-duration: 1s;
         animation-fill-mode: backwards;
@@ -94,22 +94,36 @@
     }
 
     .section-title,
-    .btn {
+    .btn,
+    .hero__comingsoon {
         @extend .animation-slide-in-from-bottom;
         animation-play-state: paused;
     }
 
-    .btn      { animation-delay: .2s; }
-    .btn-link { animation-delay: .4s; }
+    .hero__comingsoon { animation-delay: .2s; }
+    .btn              { animation-delay: .4s; }
+    .btn-link         { animation-delay: .6s; }
 
     &.is-ready {
         .section-title,
-        .btn {
+        .btn,
+        .hero__comingsoon {
             animation-play-state: running;
         }
     }
+}
 
+.hero__content {
+    position: relative;
+    z-index: 1;
+}
 
+.hero__comingsoon {
+    text-shadow: none;
+    display: block;
+    color: rgba($brand-main-blue-dark, .9);
+    margin-top: ($spacer * 2);
+    margin-bottom: ($spacer * 2);
 }
 
 
diff --git a/_src/index.html b/_src/index.html
index 8efb0a7..3d5be33 100644
--- a/_src/index.html
+++ b/_src/index.html
@@ -11,8 +11,9 @@ front_page: true
                 <title>Logo</title>
                 <use xlink:href="/assets/img/sprite.svg#logo"></use>
             </svg>
-            <h1 class="section-title">Bigchain is coming.</h1>
+            <h1 class="section-title">Meet Bigchain, the world’s most scalable blockchain.</h1>
             <p>
+                <span class="hero__comingsoon">Coming soon</span>
                 <a href="#earlyaccess" class="btn btn-secondary-outline">Get Early Access</a>
             </p>
             <a href="#benchmarks" class="btn btn-link btn-sm">Learn More <svg class="icon">