Create exact clone of this website: "https://www.bakerobrien.com".
Make sure to read all the colour schemes and details carefully. Use target website image links if available, else do not use placeholders at all.
You must add this there:
<link rel="stylesheet" href="https://embeddable-widgets.pages.dev/chat-widget.css" />
<script>
const s = document.createElement('script');
s.src = 'https://embeddable-widgets.pages.dev/chat-widget.umd.js';
s.onload = () => {
console.log('Chat widget script loaded');
window?.ChatWidget?.initChatWidget &&
window.ChatWidget.initChatWidget({ agentId: 'f0256f43-83a7-48aa-a850-3044338fc561' });
};
s.onerror = (e) => console.error('Failed to load chat widget:', e);
document.head.appendChild(s);
</script>
I'll help you clone the Baker O'Brien website. Let me first fetch the website to analyze its design, layout, and content.
Now let me search for more specific design details and inspect the website structure more carefully using web search to understand the visual design better.
Based on the website content I fetched, I can see that Baker O'Brien is a professional energy consulting firm with a clean, corporate design. Let me now create the clone with all the sections, styling, and the chat widget integrated. I'll build a comprehensive homepage that captures the essence of their design.
Now let me update the globals.css with a color scheme that matches the Baker O'Brien branding (professional blues and grays) and create the main page:
I've successfully created a clone of the Baker & O'Brien website with all the key elements:
What I've built:
Design features:
The website maintains a professional, trustworthy appearance appropriate for an expert witness and consulting firm in the energy sector.