.wrapper {
  scroll-snap-type: y mandatory;
  max-height: 100vh;
  overflow: scroll;
}

body {
  padding: 0;
  margin: 0;
}

code {
  background-color: rgba(0, 0, 0, 0.15);
  padding: 0.2em;
}

li {
  line-height: 2em;
}

.hero,
.footer {
  scroll-snap-align: start;
  box-sizing: border-box;
  padding: 40px 32px;
}

.hero {
  background-color: #daf;
  height: 100svh;
}

.footer {
  background-color: #afd;
  height: 260px;
}

<div class="wrapper">
    <div class="hero">
      <strong>Steps to reproduction:</strong>
      <ol>
        <li>Open page in Google Chrome (possibly only in MacOS)</li>
        <li>
          <code>&lt;html&gt;</code> with CSS
          <code>scroll-snap-type:y mandatory</code>
        </li>
        <li>
          <code>&lt;body&gt;</code> has 2 children, each with CSS
          <code>scroll-snap-align:start</code>
        </li>
        <li>Scroll up and down document (scroll-snapping works)</li>
        <li>From top of document, scroll further up (using trackpad)</li>
        <li>
          (alternatively) From bottom of document, scroll further down (using
          trackpad)
        </li>
      </ol>
  
      <br /><strong>Expected results:</strong><br />
      <ul>
        <li>
          The scroll-viewport is allowed to go beyond the document’s
          scroll-boundary (relative to scrolling-velocity) but should bounce
          back to the scroll-boundary right after.
        </li>
      </ul>
  
      <br /><strong>Actual results:</strong><br />
      <ul>
        <li>
          The scroll-viewport allows scrolling beyond the document’s
          scroll-boundary and does not bounce back to the scroll-boundary.
        </li>
      </ul>
  
      <br />
      (bug observed in Google Chrome 131.0.6778.86 on MacOS)
    </div>
    <div class="footer"></div>
  </div>