.btn-mktg {
  position: relative;
  z-index: 1;
  display: inline-block;
  appearance: none !important;
  // stylelint-disable-next-line primer/spacing
  padding: rem(($spacer-3) * 0.9) rem($spacer-4) rem(($spacer-3) * 1.1);
  // stylelint-disable-next-line primer/typography
  font-size: 1rem;
  font-weight: $font-weight-bold;
  line-height: 1;
  white-space: nowrap;
  vertical-align: middle;
  user-select: none;
  border: 0;
  // stylelint-disable-next-line primer/borders
  border-radius: rem(6px);

  @include btn-solid-mktg(
    var(--color-mktg-btn-text),
    var(--color-mktg-btn-bg-top),
    var(--color-mktg-btn-bg-bottom),
    var(--color-mktg-btn-bg-overlay-top),
    var(--color-mktg-btn-bg-overlay-bottom),
  );

  &::before {
    background-blend-mode: overlay, normal;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    content: "";
    // stylelint-disable-next-line primer/borders
    border-radius: rem(6px);
    opacity: 0;
    transition: opacity 0.4s;
  }

  &:hover {
    text-decoration: none;

    &::before {
      opacity: 1;
      transition: opacity 0.4s;
    }
  }
}

.btn-primary-mktg {
  @include btn-solid-mktg(
    var(--color-mktg-btn-primary-text),
    var(--color-mktg-btn-primary-bg-top),
    var(--color-mktg-btn-primary-bg-bottom),
    var(--color-mktg-btn-primary-bg-overlay-top),
    var(--color-mktg-btn-primary-bg-overlay-bottom),
  );
}

.btn-enterprise-mktg {
  @include btn-solid-mktg(
    var(--color-mktg-btn-enterprise-text),
    var(--color-mktg-btn-enterprise-bg-top),
    var(--color-mktg-btn-enterprise-bg-bottom),
    var(--color-mktg-btn-enterprise-bg-overlay-top),
    var(--color-mktg-btn-enterprise-bg-overlay-bottom),
  );
}

.btn-outline-mktg {
  @include btn-outline-mktg(
    var(--color-mktg-btn-outline-text),
    var(--color-mktg-btn-outline-hover-text),
    var(--color-mktg-btn-outline-border),
    var(--color-mktg-btn-outline-hover-border),
    var(--color-mktg-btn-outline-focus-border),
    var(--color-mktg-btn-outline-focus-border-inset)
  );
  transition: box-shadow 0.4s, color 0.4s;
}

.btn-transparent {
  @include btn-outline-mktg(
    var(--color-mktg-btn-dark-text),
    var(--color-mktg-btn-dark-hover-text),
    var(--color-mktg-btn-dark-border),
    var(--color-mktg-btn-dark-hover-border),
    var(--color-mktg-btn-dark-focus-border),
    var(--color-mktg-btn-dark-focus-border-inset)
  );
  transition: box-shadow 0.4s, color 0.4s;
}

// Size modifiers

.btn-small-mktg {
  // stylelint-disable-next-line primer/spacing
  padding: rem(10px) rem($spacer-3) rem(13px);
}

.btn-large-mktg {
  // stylelint-disable-next-line primer/spacing
  padding: 20px 30px 23px !important;
}