Add Checkerboard Pattern to Path Code Block

Site URL: https://finch-tetra-4yf2.squarespace.com/?password=pearler

I'd love to add a checkerboard pattern to this section I've made (attached)

Inside code block:

<div class="wavy-path">  
  <svg version="1.1" class="wavy-svg-one" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
       viewBox="0 0 1579 285" xml:space="preserve">
    <style type="text/css">
      .path-bg {
        fill: red;
      } 
      .path-text {
        fill:none;
      }
    </style>
    <g>
      <path class="path-bg" id="path-bg-one" d="M785.93.06c60.14-1,118.16,9.59,177.38,32.35C1014.39,52.05,1059.74,78,1103.6,103c62.57,35.73,121.66,69.48,189.27,80,75.43,11.79,154.17-6.38,247.79-57.16l38.15,70.31c-57.23,31.05-110,51.29-161.27,61.87-47.19,9.74-92,11.06-137,4-82.15-12.84-150.5-51.88-216.59-89.63C979,124,898.87,78.2,787.25,80.05S597,130.33,513.81,181.6C449,221.53,382,262.81,300.31,278.37c-44.75,8.52-89.59,8.69-137.07.52C111.62,270,58.22,251.54,0,222.41l35.79-71.55c95.26,47.66,174.56,63.2,249.55,48.92,67.22-12.8,125.17-48.5,186.51-86.29,43-26.49,87.47-53.88,137.87-75.21C668.15,13.56,725.79,1.06,785.93.06Z"/>
    </g>
    <path id="path-text-one" class="path-text" d="M17.9,186.64C395.25,375.42,478.79,45.17,786.59,40.06s402.26,322.19,773.14,121"/>
    <text width="100%" style="transform:translate3d(0,0,0);"><textPath class="text-path" alignment-baseline="top" xlink:href="#path-text-one" startOffset="-3200"  id="path-text-one-letters">
      <tspan id="path-span-one"> Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence -Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - Learn the Code - Create the Unexpected - Charge with Confidence - </tspan>
    <animate attributeName="startOffset" repeatCount="indefinite" from="-3200" to="0" begin="0s" dur="150s" ></animate>
    </textPath>
    </text>
      
  </svg>
</div>

Inside custom CSS:

// ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ WAVY MARQUEE ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ ☯ //

section[data-section-id="622fdfe39420130436619447"] {
  z-index:2;
  .content-wrapper, .sqs-row {
    position:static !important;
  }
    
  .code-block {
    position:absolute;
    width:100%;
    bottom:0;
    left:0;
    padding:0 !important;
    transform: scale(1.2) rotate(-5deg)translateY(5%);
  }
}

.path-bg {
  fill: #fff !important;
}

#path-span-one {
  fill: #000;
  font-family: @heading;
}

#sections {
	overflow:hidden;
}

@media screen and (max-width:767px) {
  section[data-section-id="61c10b59ddbd633522652f9b"] {
    .code-block {
      transform:scale(2.0) translate(10%,10%);

    }
    #path-span-one {
      font-size:2rem !important;
    }
  }
}