.-with-dot {
  position: relative;

  &:before {
    content: "";
    position: absolute;
    left: -1em;
    top: -0.24em;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    background-color: var(--color-brand-strong);
    z-index: -1;
  }

  &.-dot-top:before {
    left: -0.64em;
    top: -0.64em;
  }

  &.-dot-top-right:before {
    right: 0.48em;
    top: -0.96em;
    left: unset;
  }
}