From 4af82067238bf0bd5f4eed9c305985526a7b14b2 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Wed, 30 Nov 2016 13:52:12 +0000
Subject: [PATCH] Reword and embiggen the headings

Also reword some of the `<p>`s so that they flow better from the
headings.

This was a bit me, and a bit sitting down and hammering this stuff out
with Stephen and Sheryll.
---
 .../stylesheets/views/product-page.scss       | 11 ++++++
 app/templates/views/signedout.html            | 36 +++++++++----------
 2 files changed, 29 insertions(+), 18 deletions(-)

diff --git a/app/assets/stylesheets/views/product-page.scss b/app/assets/stylesheets/views/product-page.scss
index d256c10bd..23fc6a2c0 100644
--- a/app/assets/stylesheets/views/product-page.scss
+++ b/app/assets/stylesheets/views/product-page.scss
@@ -71,12 +71,23 @@
   &-section {
 
     @extend %site-width-container;
+    margin-bottom: $gutter-half;
 
     h2 {
       @include bold-24;
       margin: $gutter-half 0 10px 0;
     }
 
+    h2 {
+      @include bold-36;
+      margin: 0 0 $gutter;
+    }
+
+    .with-keyline {
+      border-top: 1px solid $border-colour;
+      padding: $gutter * 1.5 0 0 0;
+    }
+
     img {
       max-width: 100%;
       margin: 0 0 $gutter * 1.5 0;
diff --git a/app/templates/views/signedout.html b/app/templates/views/signedout.html
index 4149b9feb..ce74ab718 100644
--- a/app/templates/views/signedout.html
+++ b/app/templates/views/signedout.html
@@ -18,8 +18,8 @@
             Send emails and text messages to your users
           </h1>
           <p>
-            If you work for a UK government department or agency you can
-            try GOV.UK Notify now.
+            Try GOV.UK Notify now if you work for a UK government
+            department or agency.
           </p>
           <div class="button-container">
             <a class="button button-start" href='{{ url_for('.register' )}}'>
@@ -37,28 +37,28 @@
     <div class="grid-row">
       <div class="column-half">
         <h2>
-          Get control of your content
+          Control your content
         </h2>
         <p>
-          Straightforward templating means you don’t need technical
-          knowledge to create emails and text messages.
+          You don’t need any technical knowledge to create email and
+          text&nbsp;message templates.
         </p>
       </div>
       <div class="column-half">
-        <h2>
-          See how your messages are performing
-        </h2>
-        <p>
-          Track how many messages you’ve sent and which ones aren’t
-          getting delivered.
-        </p>
+        <img src="/static/images/product/01-templates.svg">
       </div>
     </div>
   </div>
   <div class="product-page-section">
     <div class="grid-row">
       <div class="column-half">
-        <img src="/static/images/product/01-templates.svg">
+        <h2>
+          See how your messages perform
+        </h2>
+        <p>
+          Track how many messages you’ve sent and
+          find out which ones aren’t getting delivered.
+        </p>
       </div>
       <div class="column-half">
         <img src="/static/images/product/02-reporting.svg">
@@ -66,20 +66,20 @@
     </div>
   </div>
   <div class="product-page-section bottom-gutter-2">
-    <h2>
-      Works with your existing systems
+    <h2 class="with-keyline">
+      Send messages manually or automatically
     </h2>
     <div class="grid-row">
       <div class="column-half">
         <p>
-          Use the web interface to upload a spreadsheet of
-          email&nbsp;addresses or phone&nbsp;numbers.
+          Upload a spreadsheet of email&nbsp;addresses or
+          phone&nbsp;numbers and Notify sends the messages.
         </p>
         <img src="/static/images/product/03-spreadsheet.svg">
       </div>
       <div class="column-half">
         <p>
-          Integrate the GOV.UK Notify API with your web application or
+          Integrate the GOV.UK Notify API with your web&nbsp;application or
           back office system.
         </p>
         <img src="/static/images/product/04-api.svg">