/* Keep pacing separate from the site's typography and other local CSS edits.
   Ordinary reading layout is retained without motion or a working renderer. */
.motion-enabled .story-step {
  min-height: 100vh;
}

.motion-enabled .story-step[data-step="3"] {
  min-height: 160vh;
  /* Put the text near the beginning; leave the extra distance for viewing motion. */
  justify-content: flex-start;
  padding-top: 18vh;
}

@media (max-width: 700px) {
  .motion-enabled .story-step {
    min-height: 95svh;
  }

  .motion-enabled .story-step[data-step="3"] {
    min-height: 150svh;
    padding-top: 60px;
  }
}