.hero {
  isolation: isolate;
  background: #11110f;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, #11110f 0%, #11110ff2 31%, #11110f99 52%, #11110f1f 73%),
    linear-gradient(0deg, #11110f8c 0%, transparent 42%),
    url("assets/elbliners-hero.png") center / cover no-repeat;
}

.hero::after {
  z-index: 0;
}

.hero > * {
  position: relative;
  z-index: 1;
}

.hero .hero-stamp {
  position: absolute;
}

@media (max-width: 900px) {
  .hero::before {
    background:
      linear-gradient(90deg, #11110ff7 0%, #11110fd9 50%, #11110f66 100%),
      linear-gradient(0deg, #11110fa6 0%, transparent 52%),
      url("assets/elbliners-hero.png") 61% center / auto 100% no-repeat;
  }
}

@media (max-width: 600px) {
  .hero::before {
    background:
      linear-gradient(90deg, #11110ffa 0%, #11110fd9 64%, #11110f70 100%),
      linear-gradient(0deg, #11110fb8 0%, transparent 55%),
      url("assets/elbliners-hero.png") 64% center / auto 100% no-repeat;
  }
}