.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border: 2px solid currentColor;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  background: transparent;
}

.btn-yellow { background: var(--yellow); color: var(--black); border-color: var(--black); }
.btn-white { background: var(--white); color: var(--black); border-color: var(--black); }
.btn-black { background: var(--black); color: var(--white); border-color: var(--black); }
.btn-grey { background: var(--soft-grey); color: var(--black); border-color: var(--black); }
.btn-red { background: var(--red); color: var(--white); border-color: var(--black); }
.btn-green { background: var(--green); color: var(--white); border-color: var(--black); }