wooden-design

bySneha Rajput

I am attaching a JPEG image of my website design created in Figma. Your task: Convert this design into clean, production-ready frontend code. Strict Requirements: 1. The final output must match the design EXACTLY pixel-to-pixel. - No layout changes - No spacing changes - No font changes - No color changes - No design improvisation 2. Tech Stack: - HTML5 - CSS3 - Bootstrap 5 ONLY - No Tailwind - No inline styles unless absolutely required 3. Structure: - Provide HTML and CSS in separate files - index.html - style.css 4. WordPress Friendly: - Use clean semantic structure - Section-based layout (header, hero, services, footer, etc.) - Avoid unnecessary wrappers - Use class naming suitable for WordPress integration - No JS frameworks 5. Responsiveness (VERY IMPORTANT): - Fully responsive on: • Mobile • Tablet • Laptop • Large screens - Use Bootstrap grid system properly - Pixel-perfect responsiveness 6. Clean Code: - Proper indentation - Reusable classes - Comment each section clearly 7. Fonts: - If fonts are visible in design, include Google Fonts import 8. Images: - Use placeholder paths like /assets/images/filename.jpg 9. Output format: - First provide complete HTML file - Then provide CSS file separately DO NOT: - Change design - Add animations unless visible - Use extra libraries - Guess missing parts creatively Goal: The final webpage should visually look identical to the attached Figma JPEG.