Worked through this challenge myself recently, and here's what I came up with.
Since an iframe is basically its own window, its width is calculated independent of the main browser width. To make the landing page form responsive, you need to set up media queries on the landing page based on the size of the iframe and not the window.
Example:
If your iframe sits in a sidebar that has widths of 300px (desktop @ 960px), 225px (tablet @ 768px), and 125px (phone @ 480px), then on your landing page you want your media queries to be based on 300px, 225px, and 125px (instead of 960, 768, and 480).