.quote {
  position: relative;
  isolation: isolate;
  background: var(--cognac);
  overflow: hidden;
}

.quote::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(rgba(181, 93, 33, .82), rgba(44, 32, 26, .84)),
    url("assets/Chess-Board-02.png") center 58% / cover no-repeat;
  filter: grayscale(1) contrast(1.06);
}

@media (max-width: 739px) {
  .hero::before {
    background:
      linear-gradient(180deg, rgba(44, 32, 26, .24), rgba(44, 32, 26, .82)),
      url("assets/Crowd-02.png") center 60% / cover no-repeat;
  }
}