Add custom header image

Add support for configuring a custom header image from a page's front
matter, and use a new one for foundation.

content/foundation/_index.md

@@ -1,6 +1,7 @@
 ---
 title: Kosmos Infrastructure Foundation
 description: Providing physical infrastructure for Kosmos software and services
+headerImage: servers-01.jpg
 menu:
   main:
     identifier: foundation

themes/kosmos-22/layouts/_default/section.html

@@ -1,7 +1,15 @@
 {{ define "main" }}
+  {{ if .Params.HeaderImage }}
+    <!-- <div class="w&#45;full h&#45;32 bg&#45;[center_bottom_23rem] bg&#45;cover" -->
+    <!--      style="background&#45;image: url(/img/{{ .Params.HeaderImage }})"> -->
+    <div class="w-full h-32 bg-[center] bg-cover"
+         style="background-image: url(/img/{{ .Params.HeaderImage }})">
+    </div>
+  {{ else }}
     <div class="w-full h-32 bg-[url('/img/lagoon-close-02.jpg')]
                 bg-[center_top_30rem] bg-cover">
     </div>
+  {{ end }}
   <div class="max-w-5xl mx-auto -mt-12 py-8 px-8 text-left bg-white">
   <header class="mb-8">
     <h1 class="text-2xl font-bold">{{ .Title }}</h1>