/* Cache-isolated presentation for the Solutions decision map. */
.solutions-hero__map-label {
  color: var(--mute);
  font-family: var(--font-mono);
  font-size: .625rem;
  font-weight: 500;
  letter-spacing: .1em;
}

.solutions-hero__map svg {
  height: calc(100% - 2rem);
  inset: 2rem 0 0 2rem;
  position: absolute;
  width: calc(100% - 2rem);
  z-index: 0;
}

.solutions-hero__map-steps {
  inset: 4rem 0 1rem 2rem;
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  z-index: 1;
}

.solutions-hero__map-steps li {
  background: var(--paper);
  display: block;
  list-style: none;
  margin: 0;
  max-width: 11.5rem;
  padding: .55rem .75rem .6rem 0;
  position: absolute;
}

.solutions-hero__map-steps li::marker { content: ""; }
.solutions-hero__map-steps li:nth-child(1) { left: 0; top: 0; }
.solutions-hero__map-steps li:nth-child(2) { right: 0; top: 20%; }
.solutions-hero__map-steps li:nth-child(3) { left: 8%; top: 55%; }
.solutions-hero__map-steps li:nth-child(4) { bottom: 0; right: 0; }

.solutions-hero__map-steps span {
  color: var(--mute);
  display: block;
  font-family: var(--font-mono);
  font-size: .625rem;
  font-weight: 500;
  letter-spacing: .08em;
  line-height: 1.4;
}

.solutions-hero__map-steps strong {
  display: block;
  font-size: .9375rem;
  font-weight: 600;
  line-height: 1.2;
  margin-block-start: .3rem;
}

@media (max-width: 47.99rem) {
  .solutions-hero__map {
    height: 19rem;
  }

  .solutions-hero__map svg {
    inset: 2rem 0 0;
    width: 100%;
  }

  .solutions-hero__map-steps { inset: 3.75rem 0 .5rem; }
  .solutions-hero__map-steps li { max-width: 9.75rem; padding-right: .5rem; }
  .solutions-hero__map-steps li:nth-child(1) { top: 0; }
  .solutions-hero__map-steps li:nth-child(2) { top: 18%; }
  .solutions-hero__map-steps li:nth-child(3) { left: 0; top: 58%; }
  .solutions-hero__map-steps strong { font-size: .8125rem; }
}