Fixed! and I am chagrined at the reason, but maybe someone can learn from my errors.
Thank you, @multithemes … the revised images didn’t change anything … and then it hit me … the problem was an optical illusion.
I’d noticed that your images stayed centered as they changed size, and then it hit me … the visual focus point of my image was to the right, not in the center. The actual center of the image WAS in fact staying centered on the available space, but since the focal part of the image - on the right side - was being cut off, it exaggerated the changes. I took a different image, cropped it to put the visual focus in the center and mostly blank space to the right, and used that for the banner. And now it looks just like it should.
I’m not the only person to run into this, right? Or is this a basic part of responsive website design that everybody already knows? It also seems to be a right-handed thing … I always shrink a window by dragging the right edge to the left, because my mouse hand is on that side of the screen. Do left-handed people do the opposite, shrink windows from the left? I think I have to check all my images to make sure that the images still look good to me either way.