Gradient Juice Sitev0.1.1

A brand selling a handful of bright products plus a subscription needs a site that looks like a campaign and works like a shop. From your real products, prices, growers, stories and stockists, your agent builds both into one offline HTML file of 31 routes. Visitors open on one edge-to-edge photograph of someone drinking straight from the brand's bottle against a coral, butter, lime and blush backdrop. Over it sit only a modest two-line tagline, a pair of cream ribbons whose words drift along curved paths, and a small card for the featured flavor. Further down comes the story: an uneven collage mixing colored copy tiles with photos, a coral ribbon that runs from tree to fridge with a timeline of real times, journal stories, four promises, customer notes, questions and a newsletter split. Buying runs through arched product cards on a gradient band, with filter chips and one-tap add, a crate teaser whose price updates, and a shop that searches, filters and sorts. Each flavor, collection and story has a page; on flavor pages shoppers switch pack size and quantity. Shoppers fill a crate of six or twelve in any mix and pick a real delivery day; the bag adds bottle deposits, takes a promo code and shows progress toward free delivery; the demo checkout tests the address against the delivery zones. Growers and seasons, stockists pinned on a drawn map, a delivery page that checks ZIP codes, questions, contact, newsletter and policies round it out; each form admits nothing was sent or charged.

How it works

1. Collect from the brand: products with prices and pack sizes, where and when it delivers, growers, stories, stockists and how to reach it
2. Fill in site.json starting from the example brief and leave out what isn't known
3. Generate or bring in the photos in the image plan: the campaign portrait, a still life per product, plus pictures of daily life, the process and the place
4. Run the build, which lists every gap in the brief in a single pass
5. Validate: one file, a single h1 per page, no broken links, labeled controls, photos present
6. At 390, 768, 1024 and 1440 px, try the rail, the filters in the shop, the pack switch, the crate builder, bag and checkout, the ZIP checker, the stockist finder and every form
7. Hand over the file with a list of what the brand still has to confirm

Checked before delivery

• validate.mjs passes: single file, one h1 per page, every link resolves, no remote assets, structured data
• Every price, pack saving, delivery day, cut-off, deposit and ingredient matches the brief; no invented health, nutrition or certification claims
• Flavor rail, shop filters, pack switch, crate builder, bag with promo code, demo checkout, ZIP checker, month switcher, stockist map, FAQ search and forms work at widths of 390, 768, 1024 and 1440 px