@media only screen and (min-width: 992px) {
  @supports (grid-area: auto) {
    body.template-homepage {
      grid-template-rows: 60px 470px minmax( calc(100% - 460px - 172px),auto) auto;
    }
  }
  .hero {
    height: 560px;
    
    grid-template-rows: 140px auto auto 8fr;
    
  }
  @supports not (grid-area: auto){
    .hero{
      display: flex;
      justify-content: center;
    }
  }
  @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
    .hero{
      display: flex;
      justify-content: center;
    }
  }
}

.collapse {
  height: 0;
  transition: height 0.25s ease-in;
}