jumbotron: move chapel image onto the header so it scrolls

The .bg div was position: fixed to support the (now-removed) parallax
effect. Without parallax, a fixed-position background bleeds through
behind page content as the user scrolls, since the body has no opaque
background of its own. Move the chapel image directly onto the
.jumbotron element and drop the .bg div; the header and its background
now scroll away together as expected.

https://claude.ai/code/session_01S5QXfkxZBNSAf2Y1XAD8H7

Author: claude

_includes/jumbotron.html

@@ -1,4 +1,3 @@
-<div class="bg"></div>
 <div class="jumbotron">
   <div class="container">
     <br>

css/custom.css

@@ -32,22 +32,15 @@ figcaption {
 }
 
 /* Page header banner. .jumbotron isn't a Bootstrap 5 class (removed in
-   the 4.x → 5.x cycle), but we keep the name as a custom selector. */
+   the 4.x → 5.x cycle), but we keep the name as a custom selector.
+   The chapel image lives on the jumbotron itself so it scrolls away
+   with the header rather than staying fixed behind page content. */
 .jumbotron {
   height: 250px;
   color: white;
   text-shadow: #444 0 1px 1px;
-  background: transparent;
-}
-
-.bg {
   background: url('/images/chapel_gradient.jpg') no-repeat center center;
-  position: fixed;
-  width: 100%;
-  height: 250px; /* matches .jumbotron height */
-  top: 0;
-  left: 0;
-  z-index: -1;
+  background-size: cover;
 }
 
 .navbar {