.experience {
  position: relative;
  background-color: #07111f;
  background-image:
    linear-gradient(90deg, rgba(7, 17, 31, .98) 0%, rgba(7, 17, 31, .92) 32%, rgba(7, 17, 31, .58) 66%, rgba(7, 17, 31, .30) 100%),
    linear-gradient(0deg, rgba(7, 17, 31, .88) 0%, transparent 45%, rgba(7, 17, 31, .34) 100%),
    url("blueprint-background.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  isolation: isolate;
}

.experience::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, transparent 45%, rgba(54, 214, 231, .05));
  pointer-events: none;
}

.experience-copy {
  text-shadow: 0 2px 24px rgba(2, 10, 20, .75);
}

.sector-map {
  filter: drop-shadow(0 18px 36px rgba(0, 0, 0, .24));
}

@media (max-width: 900px) {
  .experience {
    background-image:
      linear-gradient(180deg, rgba(7, 17, 31, .96) 0%, rgba(7, 17, 31, .78) 50%, rgba(7, 17, 31, .48) 100%),
      url("blueprint-background.png");
    background-position: 62% center;
  }
}
