Pricing promo film — HyperFrames prompt (monthly/yearly toggle flip)

<direction> A 9-second pricing promo film, HyperFrames 1280x720 at 30fps. House style: near-black #0a0a0a background, panels #141414, borders #2a2a2a, text #ffffff/#c9c9c9, ONE accent #ff5c1a, Arial/Helvetica bold, no webfonts. This run's accent: #ff5c1a. Three pricing cards land, then a monthly/yearly toggle flips mid-film and the prices swap on screen — the discount is SHOWN, not just claimed. Fictional product and prices. No gradients, no stock photos, no real brand logos, no lorem ipsum, no purple/blue tech gradient. </direction> <structure> 0.0-1.2s — Kicker "PRICING — MetricNest". Headline: "PICK A PLAN. IT GROWS WITH YOU." 1.2-3.6s — Three cards rise in stagger: STARTER $0 / PRO $19 (accent border, "MOST POPULAR" pill ON the card) / SCALE $49, each with two short feature lines and "/MO" captions. 3.6-5.4s — A toggle pill above the cards flips MONTHLY → YEARLY; at the flip, Pro swaps to $15 and Scale to $39 with a small scale pop; a line appears: "YEARLY = ~20% OFF". 5.4-9.0s — Cards hold; bottom band carries the fine print: fictional product, sample prices — set your own. </structure> <build> One paused GSAP timeline. Prices are paired spans; the flip tween crossfades monthly/yearly values at the same timestamp as the toggle's knob transform (translateX — never animate left). The MOST POPULAR pill must be a CHILD of the Pro card so it inherits the card's entrance transform. </build> <gotchas> - Iteration 1 failed exactly there: the pill was a sibling positioned over the card edge and the inspector flagged it occluded/clipped. Parent it to the card, offset top:-21px. - Put the fine print in the bottom band from the start — an early draft overlapped it with the kicker at the top. - Keep the toggle flip and the price swap on the SAME timeline position or the eye catches the cheat. </gotchas> Before you finish: step through the timeline at five points and fix anything that overlaps, clips the frame, or drifts off the beat grid.