Screen ID: CON-035
Flow: Home → Quick Shops → Collection Detail
Previous: CON-034 Quick Shops All (or CON-030 Home)
Next: Product Detail (CON-050) or Cart (CON-060)

Header: White header with back chevron and collection title ("Braai Essentials"). The title changes dynamically based on which collection was tapped.

Hero Image: Full-width colored placeholder (180px tall) with a gradient background and large emoji. In production, this would be a curated photograph or illustration representing the collection theme.

Description: Brief text explaining the collection purpose. Helps users understand the value proposition of the curated bundle.

Add All to Cart: Full-width lime accent button showing the total bundle price (R 289.99). Tapping adds all 6 items to the cart at once. The total is calculated as the sum of all individual item prices: R 69.99 + R 79.99 + R 22.99 + R 37.99 + R 54.99 + R 24.04 = R 289.99.

Product List: Vertical list of 6 items in this collection. Each item shows: • Product image (64x64 placeholder with emoji)
• Brand name (uppercase, muted)
• Product name (medium weight)
• Price in Rands (heading font, bold)
• Circular "+" add button (lime accent, adds individual item to cart)

Collection Items: 1. Traditional Boerewors 500g (Karoo) - R 69.99
2. Rump Steak 400g (Beef Master) - R 79.99
3. Braai Broodjies Rolls 6pk (Albany) - R 22.99
4. Original Chutney 470g (Mrs Ball's) - R 37.99
5. Charcoal Briquettes 4kg (Heat Beads) - R 54.99
6. Firelighters 12 Pack (Blitz) - R 24.04

Individual Add: The circular "+" button adds a single item to the cart. Once added, it should transform into a quantity stepper (- count +) consistent with the .qty-stepper component from components.css.

Bottom Navigation: Home tab is active. Standard 4-tab consumer bottom nav present.