# PHASE 05: HOMEPAGE Read `docs/03-UX-SPECIFICATION.md` section 1 and decision D-19. ## Scope Eleven sections, in the order given. Not fourteen. The three cut sections and the one added section are deliberate, do not restore them. ## Build `front-page.php` composing the eleven sections in `template-parts/home/`. Header and footer come from phase 4, so this file adds nine parts plus the two existing ones: 1. Hero: one image, headline, one CTA. **Not a carousel.** The image is the LCP element: `fetchpriority="high"`, `loading="eager"`, `decoding="async"`, plus a `` in the head. Editable from the Customizer. 2. Trust strip, three items from the Customizer. 3. Featured categories: two-column tile grid on mobile, six tiles, three columns on desktop. 4. Best sellers: eight product cards. Horizontal scroll with CSS scroll-snap on mobile, a four-up grid with arrows on desktop. **No slider library.** Query cached in a 12 hour transient, purged on `save_post`. 5. Shop by size: four chips linking to a size-filtered listing. This section is not in the original brief and it is the most valuable one here, build it properly. 6. Featured collection: editorial image plus a four-card grid, category selectable from the Customizer. 7. Why choose us: four points with inline SVG icons. 8. Customer reviews: three genuine approved reviews with product thumbnail and the Verified Purchase mark. If fewer than three exist, the section hides itself rather than showing placeholders. 9. WhatsApp CTA band. 10. Footer (already built). Plus: the product card component wired to real data, used here for the first time. It shows image, name, price with real sale saving, rating if any, one attribute, COD badge and Add to Cart. Do not overload it. ## Acceptance criteria - [ ] Eleven sections, in order, nothing extra - [ ] Hero LCP under 2.5s on a throttled 4G Lighthouse run - [ ] CLS under 0.05, verified with the aspect-ratio wrappers doing their job - [ ] Best sellers carousel scrolls by touch and by keyboard, with no JS library loaded - [ ] Reviews section hides itself when there are fewer than three approved reviews - [ ] Every Customizer-driven field actually drives its section - [ ] Total page weight under 900 KB, JS under 90 KB, CSS under 60 KB - [ ] No fake urgency, no invented counters, no placeholder reviews anywhere - [ ] Correct at 360, 390, 430, 768, 1024, 1440 ## Stop No category or product templates. Next phase.