When i set flexbox-column height to 100%, it makes its parents height larger

Question

Not sure why flexbox is doing me in like this lol, but I have a header with height: 80vh that contains a navbar and a hero image. The navbar is its own element, the hero image is its own element, and the flexbox is an element within the hero image.

I have the hero image set at height: 100% and the flexbox set to a `flex-direction: column. Because I want to position the flexbox in the middle of the hero image I set the height of the flex container to 100% but this makes the hero image taller than the 80vh height of the header. Not sure why this is happening.

Side Note: I know I can position the hero image as relative and position the div absolute while using transform translate to center the box. I'm trying to learn flexbox and am looking for help with why this symptom is occurring.

index.html - I omitted the nav bar html

.header {
  display: flex;
  flex-direction: column;
  height: 80vh;
}

.header__container {
  display: flex;
  justify-content: center;
  padding-top: 2rem;
  padding-bottom: 2rem;
  box-shadow: 0 0.1rem 1rem rgba(0, 0, 0, 0.3);
  background-color: #fff;
  align-items: center;
  border-bottom: 2px solid black;
}

.header__featuredPost {
  height: 100%;
  background-image: linear-gradient(to right, rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)), url('gaming2.jpg');
  background-size: cover;
  background-position: center;
  outline: .5rem solid black;
}

.header__featuredPost-parentContainer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  height: 100%;
}

<div class='header__container'>

  <div class='header__featuredPost'>
    <div class='header__featuredPost-parentContainer'>
      <h2 class='header__featuredPost-parentContainer--heading'>
        Top 10 animals
      </h2>
      <a href='#' class='btn btn__readMore'>Read More</a>
    </div>
  </div>
</div>

TLDR How come when I set the height of .parentContainer to 100% it makes the featuredPost div larger than the 80vh set by the header.