Add Clarence gallery, testimonials, pre-order UI and clean hero visuals

[offmybach]

Motivation

• Surface Clarence on the page (not just inside the magazine) and repeat character imagery to strengthen brand presence and match higher-performing pages.
• Provide conversion-focused elements requested: back-cover bullets, two–three testimonials, pre-order CTA, soft-cover callout, and retailer placeholder slots.
• Remove distracting top decorative circles and tighten framing around the magazine for a cleaner, higher-impact layout.

Description

• Added a new clarence-strip section with a single upload/drop input that echoes the chosen Clarence image into multiple tiles and wired it to persistent storage with the existing localStorage/in-memory fallback in script.js.
• Inserted a three-quote testimonial proof-strip, upgraded the purchase area to show Soft Cover, added a Pre-Order button plus three retailer placeholder buttons and a glossary lead-magnet note in index.html and style.css.
• Removed the two top hero radial decorations by hiding the .hero::before/::after styles and adjusted side cover cards and magazine-centerline spacing to clean up the magazine framing in style.css.
• Integrated the new image wiring into script.js (image read, save, apply functions) and preserved the existing 3D pop-out/open behavior and silent auto-open page advance.

Testing

• Ran node --check script.js to validate JS syntax (passed).
• Served the site with python3 -m http.server 4173 and confirmed pages loaded locally (server responded; passed).
• Executed a Playwright Firefox script to capture screenshots of the updated homepage and the opened magazine state and verified the updated UI (screenshots created; passed).

---

Codex Task