Your problem can be solved without position: fixed, keeping position: sticky.

Add position: relative for the body style:

body {
    ...
    position: relative;
}

And add bottom: 0 for .book selector. This will stretch this div to the very bottom of the body tag:

.book {
    ...
    bottom: 0;
}

Change

.book {
  position: absolute;
}

To:

.book {
  position: fixed;
}

And also remove position: sticky; from .book a

Codepen: https://codepen.io/manaskhandelwal1/pen/yLaROjq

Change the position to fixed to both and adjust margin top and right like below code

.book {
   position: fixed;
   height: 100%;
   z-index: 100;
   margin-top: 30px;
   margin-right: 150px;
   right: 0;
   top: 0;
 }

a tag code

.book a {
     position: fixed;
     text-decoration: none;
     color: #1e1e1e;
     border: 4px solid #cfac44;
     background: #cfac44;
     padding: 10px 15px;
     transition: .2s;
     -webkit-transition: .2s;
    }

I have change css, here below:

book {
    position: fixed;
    height: 100%;
    z-index: 100;
    margin-top: 0;
    margin-right: 0;
    right: 0;
    top: 0;
}

.book a {
    position: sticky;
    top: 0;
    text-decoration: none;
    color: #1e1e1e;
    border: 4px solid #cfac44;
    background: #cfac44;
    padding: 10px 15px;
    transition: 0.2s;
    -webkit-transition: 0.2s;
}

I have a ‘Book Now’ button that sticks to the top of the viewport at 10px gap.
The parent element has height of 100%, which means scrolling past 100%-worth of height makes the ‘Book Now’ div scroll out of view. See here.

How can I make the parent element 100% of the full webpage height, so the ‘Book Now’ div always sticks to the top?

HTML:

<div class="book font">
        <a href="index.html">BOOK NOW</a>
</div>

CSS:

.book {
position: absolute;
height: 100%;
z-index: 100;
margin-top: 80px;
margin-right: 10px;
right: 0;
top: 0;
}

.book a {
    position: sticky;
    top: 10px;
    text-decoration: none;
    color: #1e1e1e;
    border: 4px solid #cfac44;
    background: #cfac44;
    padding: 10px 15px;
    transition: .2s;
    -webkit-transition: .2s;
}