replace illustration with photo

- align with the new brand

See #537

.gitignore

@@ -4,3 +4,6 @@
 /.cache
 .DS_Store
 /Gemfile.lock
+.jekyll-cache
+.gem
+_site

source/index.html.haml

@@ -3,20 +3,12 @@ title: Flatpak—the future of application distribution
 description: The days of chasing multiple Linux distributions are over. Standalone apps for Linux are here!
 ---
 
-%section.imagebanner.centered
+%section.imagebanner
   .container
     .row.largegap
-      .col-lg-12
+      .col-lg-10.col-lg-offset-1
         %h1.section-heading 
-          The future of 
-          %span.emphasize apps on Linux
-        %p Flatpak is a next-generation technology for building and distributing desktop applications on Linux
-
-%section.illustration.centered
-  .container
-    .row
-      .col-lg-8.col-lg-offset-2
-        = image_tag '/img/delivery_truck2.png'
+          The future of apps on Linux
 
 %section#appsplash.bg-secondary
   .container

source/stylesheets/site.css.scss

@@ -233,29 +233,22 @@ section {
 }
 
 .imagebanner {
-  background: url(/img/banner.svgz) no-repeat center bottom;
+  background: url(/img/container.webp) no-repeat center bottom;
   @media (prefers-color-scheme: dark) {
     filter: brightness(70%);
   }
   background-size: cover;
-  color: rgba(0, 0, 0, 0.5);
-  min-height: 500px;
+  color: #fff;
+  min-height: 50vh;
   z-index: 1;
+  font-weight: 800;
+  font-variation-settings: 'wght' 800;
   p {
     max-width: 30em;
     margin: auto;
   }
 }
 
-.illustration {
-  margin-top: -330px;
-  margin-bottom: 0;
-  z-index: 2; /* under the headline; issue #326 */
-  @media (max-width: 420px) {
-    display: none;
-  }
-}
-
 aside {
   padding: 50px 0;
 }
@@ -435,7 +428,6 @@ pre {
 
 .section-heading {
   margin-top: 0;
-  text-transform: capitalize;
 
   .emphasize {
     color: $key_color;