Source: frameworks/kit-homepage/04-homepage-quality.md

04 — QUALITY: Homepage

Pass threshold: 90 / 100 When to run: After every Mode 1 build or Mode 3 content update, before sharing with Kathryn.

Structure & Completeness (20 points)

#	Check	Points
1	All 10 sections present in correct order: Header, Hero, Problem/Pattern, Featured Product, Paid Offer, About, Proof, Pull Quote, Bottom CTA, Footer	5
2	Every section has exactly one job — no section tries to do two things (e.g., About does not also sell)	3
3	Header is sticky (`position: sticky; top: 0; z-index: 100`) with gold bottom border	2
4	Hero is two-column: main copy + side panel. Side panel contains product preview card.	3
5	About section uses class-based CSS (.about-hero, .about-hero-bg, .about-hero-overlay, .about-hero-content) — not inline styles for the photo treatment	3
6	Footer contains all compliance elements: Meta disclaimer, testimonial context disclaimer, brand attribution, contact email, legal links	4

Responsive & Technical (20 points)

#	Check	Points
7	All grids collapse to single column at 968px breakpoint	3
8	Header stacks vertically and centers at 968px — no hamburger menu (unless explicitly requested)	2
9	About hero gradient switches from left-to-right to top-to-bottom at 968px. Content shifts to `justify-content: flex-end`. Photo stays visible at all breakpoints.	4
10	No CSS `var()` anywhere in the file — all values hardcoded as hex	3
11	No JavaScript — zero