.hero-photo{
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.14) 9%,rgba(0,0,0,.5) 22%,rgba(0,0,0,.86) 36%,#000 48%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.14) 9%,rgba(0,0,0,.5) 22%,rgba(0,0,0,.86) 36%,#000 48%);
}
.hero{
  z-index:1;
  padding-bottom:138px;
  margin-bottom:-134px;
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 134px),rgba(0,0,0,.8) calc(100% - 100px),rgba(0,0,0,.45) calc(100% - 62px),rgba(0,0,0,.16) calc(100% - 28px),transparent 100%);
  mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 134px),rgba(0,0,0,.8) calc(100% - 100px),rgba(0,0,0,.45) calc(100% - 62px),rgba(0,0,0,.16) calc(100% - 28px),transparent 100%);
}
#como-funciona{padding-top:calc(100px + 134px)}
@media(max-width:760px){
  .hero-photo{
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 30%,#000 62%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 30%,#000 62%);
  }
  .hero{
    padding-bottom:132px;
    margin-bottom:-110px;
    -webkit-mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 110px),rgba(0,0,0,.8) calc(100% - 82px),rgba(0,0,0,.45) calc(100% - 52px),rgba(0,0,0,.16) calc(100% - 24px),transparent 100%);
    mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 110px),rgba(0,0,0,.8) calc(100% - 82px),rgba(0,0,0,.45) calc(100% - 52px),rgba(0,0,0,.16) calc(100% - 24px),transparent 100%);
  }
  #como-funciona{padding-top:calc(70px + 110px)}
}