.hero-image {
    background-image: linear-gradient(rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 1.0)), url("../assets/images/hero/small/hero-home-s.webp");

    @media only screen and (min-width: 824px) {
        background-image: linear-gradient(rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 1.0)), url("../assets/images/hero/large/hero-home-l.webp");
    }
}

.hero-image {

    .hero-text {
        bottom: 12%;
    }
}