@mixin blocks-background-mapping {
  .block__title {
    @include bg-variants() {
      color: variant-property('titlePrimary');
    }
  }

  .block__header p {
    @include bg-variants() {
      color: variant-property('bodyPrimary');
    }
  }

  // ! Deprecation warning, do not use anymore. Will be removed in a later release use bg-variants function instead.
  .block__title {
    .bg-brand--dark-blue &,
    .bg-brand--blue & {
      color: $color-brand--four;
    }
  }

  // sub title
  .block__header p {
    .bg-brand--blue &,
    .bg-brand--dark-blue & {
      color: $color-alpha--four-50;
    }

    .bg-brand--off-white & {
      color: $color--two-80;
    }

    .bg-brand--yellow {
      color: $color-alpha--two-70;
    }
  }
}