Subtly darken navbar and full-width sections

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: bchapuis

apps/www/src/components/layout.tsx

@@ -19,7 +19,7 @@ export function Layout({ children, navigation }: LayoutProps) {
 
   return (
     <div className="min-h-screen bg-stone-100 bg-dot-grid flex flex-col overflow-x-clip">
-      <header className="sticky top-0 z-50 w-full px-6 py-4 bg-stone-100/60 backdrop-blur-md backdrop-saturate-150 border-b border-white/20 shadow-sm supports-[backdrop-filter]:bg-stone-100/50">
+      <header className="sticky top-0 z-50 w-full px-6 py-4 bg-[#f1f1ef]/60 backdrop-blur-md backdrop-saturate-150 border-b border-gray-200 supports-[backdrop-filter]:bg-[#f1f1ef]/50">
         <div className="flex items-center justify-between">
           <a href="/" className="flex items-center gap-3">
             <img src="/icon.svg" alt="Dafthunk" className="h-8 w-8" />

apps/www/src/routes/home.tsx

@@ -112,7 +112,7 @@ export default function Home() {
       </section>
 
       <section
-        className="relative left-1/2 right-1/2 w-screen -ml-[50vw] -mr-[50vw] py-24 bg-stone-100 border-y border-gray-200"
+        className="relative left-1/2 right-1/2 w-screen -ml-[50vw] -mr-[50vw] py-24 bg-[#f1f1ef] border-y border-gray-200"
         aria-label="Built on and integrates with"
       >
         <div className="max-w-screen-2xl mx-auto px-6 flex flex-col lg:flex-row lg:items-center gap-6 lg:gap-16">
@@ -127,7 +127,6 @@ export default function Home() {
               "Google",
               "GitHub",
               "Discord",
-              "Gmail",
             ].map((name) => (
               <span
                 key={name}
@@ -267,7 +266,7 @@ export default function Home() {
       </section>
 
       <section
-        className="relative left-1/2 right-1/2 w-screen -ml-[50vw] -mr-[50vw] py-24 bg-stone-100 border-y border-gray-200"
+        className="relative left-1/2 right-1/2 w-screen -ml-[50vw] -mr-[50vw] py-24 bg-[#f1f1ef] border-y border-gray-200"
         aria-label="Platform statistics"
       >
         <div className="max-w-screen-2xl mx-auto px-6 grid grid-cols-2 md:grid-cols-4 gap-12 text-center">