Sticky background with scroll text

A few steps; first combine this text into a single text block:

Pin this block with this button, and set the offset to 60px:

Remove the background image from the section and add this code:

section[data-section-id="66401df29cb8660c4f9af59c"] {
  .section-background{
    &::after {
    /*creating the element*/      
      content: "";
      width:100%;
      height:100%;
      position: absolute;
      
      /*adding the image*/  
      background-image:url('https://images.squarespace-cdn.com/content/v1/564557c3e4b0c87513050114/1601421132965-VGA8O3U4MAXR0TRBFDJU/Guests+%40+Gallery+Back+Room.jpg');
      background-repeat:no-repeat;
      
      /*positioning the image*/  
      background-size:cover;
      background-position:center center;
      background-attachment: fixed;
      
      /*mobile*/  
      @media(max-width:787px){
        background-position:center center;
        background-attachment: scroll !important;
      }
    } 
  }
}

This code was developed by Will Myers, you can see his website and instructions that go along with it here: 
https://www.will-myers.com/adding-parallax-effect-to-a-background-image-in-squarespace-71