.logo {
  line-height: 0;

  svg {
    fill: $color-brand--white;
    overflow: visible;
    width: 150px;

    // background / color default mappings
    .bg-brand--off-white &,
    .bg-brand--white & {
      fill: $color-brand--one;
    }

    @include bg-variants(
      $supportedBackgrounds: (
        'brand-tertiary',
        'white'
      )
    ) {
      fill: returnColorCSSVar('brand-primary');
    }
  }
}
