WHAT A PHONE SHOWS BEFORE ANY SCROLLING
Getting the button on screen before anyone scrolls
A
Shorter hero, real button on screen
Both options and a working button land inside the 844px screen. The sticky bar stays hidden until this button scrolls away, so there is only ever one Add to Cart in view.
On a smaller phone (iPhone SE, 667px) the button still falls below the fold.
B
Sticky bar, pinned from the first frame
The choice and the button are pinned to the bottom of the screen from the first frame and never leave. The hero keeps its full height, so the product still gets a proper photo.
Works on every screen size, because nothing depends on where the fold lands.
LP
Landing page, same treatment
Button and comparison line both land at 646px. The hero came down to 270px and the headline to 34px to get there.
Clears the fold on an iPhone SE at 667px, so it holds on every current phone.