Create exact clone of this website: "https://www.deepwater.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: 'f5c86f73-82a2-4277-84d6-acb59790c49a' });
};
s.onerror = (e) => console.error('Failed to load chat widget:', e);
document.head.appendChild(s);
</script>
Now I have enough information to build the clone. Let me create the full site.
Now let me assemble everything into the main page and verify the layout file has the chat widget correctly placed:
The Muli font has been deprecated from Google Fonts and renamed to Mulish. Let me fix that:
The Transocean (deepwater.com) clone is complete. Here's a summary of what was built:
Pages & Components:
SiteHeader — Fixed nav with NYSE ticker bar (blue top strip), Transocean SVG logo with reticle mark, dropdown nav links, search bar, and mobile hamburger menuHeroSection — Full-viewport dark oceanic hero with the "Boundless" headline, SVG reticle/crosshair overlay, and red accent dividerPressReleasesSection — Split panel with all 5 press releases (dates, tags, read more links)PerformanceSection — Dark blue cinematic banner with the "27% Reduction in All Hurts" circular stat graphicFleetSection — Two fleet category cards (Ultra-Deepwater & Harsh Environment) with hover overlaysWhereWeOperateSection — Interactive world map with all 7 region dots and a sidebar region list with image calloutsSafetySection — Dark overlay section with 4 safety stat boxesOurPeopleSection — Split image/content panel for careersInvestorsSection — Dark blue NYSE stock ticker with mini bar chartContactSection & SiteFooter — Full footer with 5 link columnsChat Widget is injected via layout.tsx <head> using the exact provided script tags, with the agent ID f5c86f73-82a2-4277-84d6-acb59790c49a. Color scheme matches Transocean exactly: deep navy #003087, red #e8001d, dark ocean #0a1628, with Mulish/Open Sans fonts.