How to create a mirror image of a CSS cubic-bezier()

Question

I want to create two bezier curves using CSS, the second being a horizontal mirror image of the first. If both y values are 0.5 and the two x values are the same, I can do it by changing the x values to 1 - x. But if the x values are different that does not work, and it doesn't work with the y values. I have tried swapping the two points, i.e. setting x1/y1 to x2/y2 and vice-versa, and that isn't even close.

Here is a crude visual of what I want to achieve, using the curve of the built-in easing function named ease, e.g. cubic-bezier(0.25, 0.1, 0.25, 1):

Now that second curve has P0 and P3 swapped, so it might be a bit confusing, since it starts at 1,1 and ends at 0,0. I handle that with a 1 - value calculation. I'm not sure how to visualize it without that, so hopefully you'll understand what I am trying to do...

The idea is to do a round-trip animation where the return trip mirrors the original in its timing.

Answer 1

After repeatedly adjusting my web search terms, I found a working answer here:

https://codepen.io/michellebarker/pen/jQpwKq

After fiddling with that codepen, it becomes clear that the answer lies in combining my original approaches:

x1 = 1 - x2
y1 = 1 - y2
x2 = 1 - x1
y2 = 1 - y1