:root {
  --hero-image: url("./hero.png");
  --hero-overlay: linear-gradient(
    180deg,
    rgba(20, 32, 27, 0.12),
    rgba(20, 32, 27, 0.78)
  );
}

.hero-visual {
  background: var(--hero-overlay), var(--hero-image) center 40% / cover;
}