A fully responsive, multi-page luxury catering website for "Break the Beet" with a quiet luxury aesthetic.

1. Home (index.html) - Hero section with tagline, brand intro, and CTAs
2. Menu (menu.html) - 8 exact dishes with descriptions
3. Services (services.html) - 3 core services
4. Meet the Chef (chef.html) - Chef Eric Brown's biography and credentials
5. Gallery (gallery.html) - Portfolio grid with image placeholders
6. Contact (contact.html) - Multi-step quote request form

• Base Colors: Black (#0A0A0A), White (#FAFAFA), Charcoal (#2C2C2C)
• Accent Colors: Muted Gold (#B8956A), Copper (#C09573)

• Headings: Playfair Display, Cormorant Garamond (serif)
• Body: Inter, Poppins (sans-serif)

• Sticky CTA button (always visible)
• Generous whitespace
• Mobile-first responsive design
• Animated transitions on gallery grid
• Accessible (WCAG compliant)
• SEO-friendly metadata

• Hero section brand introduction (2-3 sentences)
• Expanded introduction about mission and values (3-4 sentences)
• Additional context about brand approach (2-3 sentences)
• Short brand tagline for footer (1-2 sentences)

All 8 dishes need:

• Mini Arepas - Description and image
• Crab Cake with Spicy Aioli - Description and image
• Yakitori Chicken Skewers - Description and image
• Pani Puri Chicken Salad - Description and image
• Beef Sliders - Description and image
• Mini Empanadas (Beef/Chicken/Cheese) - Description and image
• Endives with Citrus & Goat Cheese - Description and image
• Caprese Skewers - Description and image

• Catering for Intimate Gatherings - Precise description (3-4 sentences)
• Customized Menus - Precise description (3-4 sentences)
• Private Chef Experiences - Precise description (3-4 sentences)

• Chef Eric Brown professional photo
• Biography paragraph 1: Culinary philosophy and passion (3-4 sentences)
• Biography paragraph 2: Journey in culinary world (3-4 sentences)
• Biography paragraph 3: Commitment to Break the Beet (3-4 sentences)
• Training with Marcus Samuelsson details (2-3 sentences)
• Training with Jean-Georges details (2-3 sentences)
• Additional credential/experience #1
• Additional credential/experience #2
• Culinary specialty #1
• Culinary specialty #2
• Culinary specialty #3
• Personal quote about culinary philosophy (1-2 sentences)

• 12 high-resolution images (event/food photography)
• Real client testimonials (optional - section will remain empty until provided)

• Phone number
• Email address
• Street address
• City, State, ZIP
• Instagram URL
• Facebook URL
• Twitter/X URL

DO NOT add:

• Invented testimonials
• Fake client names
• Made-up awards or recognitions
• Stock photography
• AI-generated images
• Fictional events or stories

All placeholders marked with [PLACEHOLDER: ...] must be filled with real, authentic content provided by you.

• Full Name (required)
• Email Address (required)
• Phone Number (optional)
• Event Date (required)

• Number of Guests (required)
• Event Type (required)
• Service Needed (optional)
• Additional Details (optional)
• Estimated Budget (optional)

Form includes validation, smooth transitions, and success message display.

/
├── index.html
├── menu.html
├── services.html
├── chef.html
├── gallery.html
├── contact.html
├── css/
│   └── style.css
├── js/
│   └── main.js
└── images/
    └── (your images here)

• HTML5
• CSS3 (with CSS Grid and Flexbox)
• Vanilla JavaScript (no frameworks)
• Google Fonts (Playfair Display, Cormorant Garamond, Inter, Poppins)

• Chrome/Edge (latest)
• Firefox (latest)
• Safari (latest)
• Mobile browsers (iOS Safari, Chrome Mobile)

1. Add Your Content: Replace all [PLACEHOLDER: ...] text with your real content
2. Add Images: Place your images in the images/ directory
3. Update Image References: Replace placeholder divs with <img> tags pointing to your images
4. Test Responsiveness: View the site on different devices
5. Deploy: Upload to your web hosting service

• Dish Photos: 800x800px (1:1 aspect ratio)
• Chef Photo: 600x800px (portrait)
• Gallery Images: 1000x1000px (1:1 aspect ratio)

• JPEG or PNG
• Optimized for web (compressed)
• High quality (300dpi source preferred)

• ✅ Fully responsive (mobile-first)
• ✅ Sticky CTA button
• ✅ Smooth scroll navigation
• ✅ Multi-step form with validation
• ✅ Animated gallery grid
• ✅ Accessible (keyboard navigation, ARIA labels)
• ✅ SEO optimized
• ✅ Fast loading
• ✅ No external dependencies (except Google Fonts)

1. Review all placeholder locations in each HTML file
2. Gather your content (text, images, contact info)
3. Replace placeholders with real content
4. Test the contact form
5. Verify all links work correctly
6. Check responsive design on multiple devices
7. Deploy to production

© 2024 Break the Beet. All rights reserved.

Note: This website strictly adheres to your content-only policy. No fabricated testimonials, awards, or marketing stories have been added. Every placeholder is clearly marked for you to complete with authentic content.