Revise landing page to focus more on our unique strengths.

(imported from commit 50d641d3e24ce57c873d0ea5deb077b825c14782)

static/styles/portico.css

@@ -250,8 +250,7 @@ img.screenshot{
 }
 
 .main-signup-button {
-    margin-top: 2em;
+    margin: 1em;
-    margin-bottom: 2.5em;
 }
 
 .shaded-background {

templates/zerver/hello.html

@@ -5,8 +5,9 @@
   <div class="content">
     <div class="span12">
       <div class="main-headline">
-        <h1>We&rsquo;ve built the group conversation tool of your dreams.</h1>
+        <img src="/static/images/landing-page/zulip-header.png" style="height: 75px">
-        <h4>Lightning-fast search, drag-and-drop file sharing, and more&mdash;all from your computer or mobile device.</h4>
+        <h2>Finally, workplace chat that actually improves your productivity<sup><small>&dagger;</small></sup></h2>
+        <small>&dagger; Zulip also supports sharing cat pictures.</small>
       </div>
     </div>
 
@@ -26,9 +27,13 @@
   <div class="row-fluid landing-page">
     <div class="offset2 span4">
       <h3>Threaded conversations</h3>
-      <p>You wouldn't tolerate email without subject lines or threading,
+      <p>Every conversation in Zulip has a <em>topic</em>, so it's
-        so why do you in chat? Easily focus on the messages you care
+      easy to keep things straight. Are your coworkers talking about
-        about, and ignore the ones you don't.</p>
+      an important meeting and where to go to lunch at the same time?
+      No problem.
+      </p>
+      <p>You wouldn&rsquo;t tolerate email without subject lines or
+      threading, so why do you for chat?</p>
     </div>
     <div class="span4">
       <img class="spotlighted-feature" src="/static/images/landing-page/threads.png" />
@@ -40,17 +45,21 @@
       <hr />
     </div>
   </div>
+
 {##################################}
 
   <div class="row-fluid landing-page">
     <div class="offset2 span4">
-      <img class="spotlighted-feature" src="/static/images/landing-page/search.png" />
+      <img class="spotlighted-feature" src="/static/images/landing-page/catching-up.png" />
     </div>
 
     <div class="span4">
-      <h3>Lightning-fast, full-history search</h3>
+      <h3>At-a-glance summary of what you&rsquo;ve missed</h3>
-      <p>Find that important conversation from two weeks ago in seconds,
+      <p>Sometimes, important things get discussed when you're not
-        using our powerful search feature.</p>
+      around. Unfortunately, so do a lot of unimportant things.</p>
+      <p><em>Narrowing</em> by stream or topic lets you see only
+      those critical announcements without having to read about how
+      Jim's guitar lessons are going.</p>
     </div>
   </div>
 
@@ -59,11 +68,55 @@
       <hr />
     </div>
   </div>
+
 {##################################}
 
   <div class="row-fluid landing-page">
     <div class="offset2 span4">
-      <h3>Efficient, just like you</h3>
+      <h3>Integrations that don&rsquo;t get in your way</h3>
+      <p>We have <a href="/integrations">tons of integrations</a> and
+      a powerful <a href="/api">API</a> to match. But here&rsquo;s
+      where it gets interesting:</p>
+      <p>Thanks to our threading, automated messages never overwhelm
+      the conversation&mdash;they&rsquo;re easy to focus on and
+      ignore, as appropriate.</p>
+    </div>
+    <div class="span4">
+      <img class="spotlighted-feature" src="/static/images/landing-page/api.png" />
+    </div>
+  </div>
+
+  <div class="row-fluid">
+    <div class="offset2 span8">
+      <hr />
+    </div>
+  </div>
+
+{##################################}
+
+  <div class="row-fluid landing-page">
+    <div class="offset2 span4">
+      <img class="spotlighted-feature" src="/static/images/landing-page/search.png" />
+    </div>
+    <div class="span4">
+      <h3>Search that isn&rsquo;t an afterthought</h3>
+      <p>A ton of knowledge lives in your chat system. Which is why we
+      make it easy for you to get at it, with robust and powerful
+      in-app search that was designed in from day one.</p>
+    </div>
+  </div>
+
+  <div class="row-fluid">
+    <div class="offset2 span8">
+      <hr />
+    </div>
+  </div>
+
+{##################################}
+
+  <div class="row-fluid landing-page">
+    <div class="offset2 span4">
+      <h3>As technical as you want to be</h3>
       <p>Keyboard shortcuts? Check.<br />
         Syntax highlighting? Check.<br />
         Discuss code and technical topics with ease.</p>
@@ -78,75 +131,20 @@
       <hr />
     </div>
   </div>
+
 {##################################}
 
   <div class="row-fluid landing-page">
     <div class="offset2 span4">
-      <img class="spotlighted-feature" src="/static/images/landing-page/one-on-one.png" />
-    </div>
-
-    <div class="span4">
-      <h3>One-on-one or group messaging</h3>
-      <p>Have private conversations with one or as many people as you
-        need.</p>
-    </div>
-  </div>
-
-  <div class="row-fluid">
-    <div class="offset2 span8">
-      <hr />
-    </div>
-  </div>
-{##################################}
-
-  <div class="row-fluid landing-page">
-    <div class="offset2 span4">
-      <h3>Drag-and-drop file uploads</h3>
-      <p>Whether you&rsquo;re sending that important document or a hilarious
-        cat picture, we&rsquo;ve got you covered. Drag, drop, share.</p>
-    </div>
-    <div class="span4">
-      <img class="spotlighted-feature" src="/static/images/landing-page/file-uploads.png" />
-    </div>
-  </div>
-
-  <div class="row-fluid">
-    <div class="offset2 span8">
-      <hr />
-    </div>
-  </div>
-{##################################}
-
-  <div class="row-fluid landing-page">
-    <div class="offset2 span4">
-      <img class="spotlighted-feature" src="/static/images/landing-page/api.png" />
-    </div>
-
-    <div class="span4">
-      <h3>API and integrations</h3>
-      <p><a href="/integrations">Integrations</a> for Jenkins, Github,
-        Jira, Nagios, Pivotal Tracker, Capistrano, and many more right out
-        of the box. And a powerful <a href="/api">API</a> to match.</p>
-    </div>
-  </div>
-
-  <div class="row-fluid">
-    <div class="offset2 span8">
-      <hr />
-    </div>
-  </div>
-{##################################}
-
-  <div class="row-fluid landing-page">
-    <div class="offset2 span4">
-      <h3>...and much more</h3>
-      <p>Keyboard shortcuts, @-notifications, audible alerts,
-        missed-message emails, and basically everything else you might
-        want. Including emoji, obviously.</p>
-    </div>
-    <div class="span4">
       <img class="spotlighted-feature" src="/static/images/landing-page/more.png" />
     </div>
+    <div class="span4">
+      <h3>...and all the obvious stuff, too</h3>
+      <p>Drag-and-drop file uploads, group private messages, audible
+        notifications, missed-message emails, desktop apps, and
+        <a href="/features">everything else you might
+        want</a>. Including emoji, naturally.</p>
+    </div>
   </div>
 
 {##################################}