.ds-missed-target {
  text-align: center;
}

.ds-missed-target__illustration {
  height: auto;
  margin: 1.5rem 0;
  padding: 1.5rem 0 0 0;
  width: 13rem;
}

.ds-missed-target__headline {
  color: var(--ds-color-london-5);
  font-family: var(--ds-type-system-serif);
  font-size: var(--ds-type-scale-5);
  font-weight: 500;
  line-height: var(--ds-type-leading-upper);
}

.ds-missed-target__subheadline {
  color: var(--ds-color-london-5);
  font-family: var(--ds-type-system-serif);
  font-size: var(--ds-type-scale-4);
  font-weight: 400;
  line-height: var(--ds-type-leading-upper);
  margin: 0.5rem 0 0 0;
}

.ds-missed-target__summary {
  color: var(--ds-color-london-5);
  font-family: var(--ds-type-system-serif);
  font-size: var(--ds-type-scale-1);
  font-style: italic;
  font-weight: 400;
  line-height: var(--ds-type-leading-lower);
  margin: 1.5rem 0 0 0;
  a {
    color: var(--ds-color-london-5);
    font-family: var(--ds-type-system-serif);
    font-size: var(--ds-type-scale-1);
    font-style: italic;
    font-weight: 400;
    line-height: var(--ds-type-leading-lower);
    text-decoration: underline;
    text-decoration-color: var(--ds-color-london-5);
    text-decoration-thickness: 0.063rem;
    text-underline-offset: 0.188rem;
    transition: all var(--ds-interactions-transition);
    will-change: border-color, color;
    &:hover {
      color: var(--ds-color-chicago-30);
      text-decoration-color: var(--ds-color-chicago-30);
      text-decoration-thickness: 0.125rem;
    }
    &:focus {
      background-color: var(--ds-color-chicago-90);
      color: var(--ds-color-london-5);
      outline: none;
      text-decoration-color: var(--ds-color-london-5);
      text-decoration-thickness: 0.125rem;
    }
    &:active {
      background-color: var(--ds-color-chicago-90);
      color: var(--ds-color-chicago-30);
      text-decoration-color: var(--ds-color-chicago-30);
      text-decoration-thickness: 0.125rem;
    }
  }
}

@media (--ds-viewport-max-medium) {
  .ds-missed-target__subheadline {
    line-height: var(--ds-type-leading-lower);
  }
}

@media (max-width: 52.125rem) {
  .ds-missed-target__illustration {
    width: 10rem;
  }
  .ds-missed-target__subheadline {
    font-size: var(--ds-type-scale-1);
  }
}

@media (min-width: 52.125rem) {
  .ds-missed-target__subheadline {
    font-size: var(--ds-type-scale-3);
  }
}
