/*

    - data-scroll="snap"
      data-scroll="soft"
      data-scroll="none"
      Controls scoll behaviour -
       'snap' for hard snaps (no continuous scroll)
       'soft' for soft snaps (autoscroll if position is in proximity of the full page)
       'none' for no scroll control
      example: <div class="pages" data-scroll="snap"...

*/
.pages {
    height: 100vh;
    overflow: scroll;
}
.pages .page-content {
    overflow: hidden;
    height: 100%;
}

/* Snap or soft paging */
body:not(.zoomed-in) .pages[data-scroll="snap"] {
    scroll-snap-type: both mandatory;
}
body:not(.zoomed-in) .pages[data-scroll="soft"] {
    scroll-snap-type: both proximity;
}
body:not(.zoomed-in) .pages[data-scroll="snap"] .page,
body:not(.zoomed-in) .pages[data-scroll="soft"] .page {
    scroll-snap-align: start;
    scroll-snap-stop: always;
}