diff --git a/src/layout.mjs b/src/layout.mjs
index 576a4bd..ce9e063 100644
--- a/src/layout.mjs
+++ b/src/layout.mjs
@@ -45,6 +45,8 @@ const ICONS = {
   pin: '<path d="M12 21s7-6.2 7-11.5a7 7 0 0 0-14 0C5 14.8 12 21 12 21z"/><circle cx="12" cy="9.5" r="2.5"/>',
   book: '<path d="M4 4.5A1.5 1.5 0 0 1 5.5 3H19v15H5.5A1.5 1.5 0 0 0 4 19.5z"/><path d="M4 19.5A1.5 1.5 0 0 0 5.5 21H19v-3"/>',
   pen: '<path d="M4 20l1-4.5L15.5 5a2.1 2.1 0 0 1 3 3L8 18.5z"/><path d="m13.5 7 3 3"/>',
+  moon: '<path d="M20 14.5A8.5 8.5 0 0 1 9.5 4a8.5 8.5 0 1 0 10.5 10.5z"/>',
+  sun: '<circle cx="12" cy="12" r="4"/><path d="M12 2.5v2M12 19.5v2M2.5 12h2M19.5 12h2M5.3 5.3l1.4 1.4M17.3 17.3l1.4 1.4M18.7 5.3l-1.4 1.4M6.7 17.3l-1.4 1.4"/>',
   spark: '<path d="M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M18.4 5.6l-2.8 2.8M8.4 15.6l-2.8 2.8"/>',
 };
 
@@ -56,7 +58,10 @@ export function icon(name, cls = '') {
   return `<svg class="${cls}" viewBox="${vb}" fill="none" stroke="currentColor"${sw} stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${ICONS[name]}</svg>`;
 }
 
-export const mark = (cls = 'brand-mark') => `<svg class="${cls}" viewBox="0 0 34 34" aria-hidden="true"><rect width="34" height="34" rx="10" fill="#594ff4"/><path d="M8 9h7.2c4.4 0 7.3 3.1 7.3 7.6 0 1.5-.3 2.8-.9 4L16.9 25H8l1.8-3.2h5.6c2.6 0 4.1-2 4.1-4.9 0-2.6-1.5-4.6-4.3-4.6h-5.3z" fill="#fff"/><path d="M27 8.5 18.3 25.5h4.2L27 16.8z" fill="#fff" opacity=".55"/></svg>`;
+// Dylan Mazzei monogram: italic "D" (inherits text color) and the sky-blue blade.
+export const mark = (cls = 'logo-mark') => `<svg class="${cls}" viewBox="0 0 104 60" aria-hidden="true"><path fill="currentColor" fill-rule="evenodd" d="M9 4h55c10 0 13 7 9 14L58 46c-3 6-8 8-15 8.5L3 57zM21.5 15.5 18.3 45.8 40 44.5c4-.3 6-1.5 7.5-4.3l12-21.4c1.2-2.2.3-3.3-2-3.3z"/><path fill="#33b9ff" d="M24 59 102 1 91 52 72 54.5 79 33z"/><path fill="#8fdcff" d="M24 59 102 1 79 33z"/></svg>`;
+
+export const logo = () => `${mark()}<span class="brand-word">Dylan <b>Mazzei</b></span>`;
 
 export const eyebrow = (t) => `<span class="eyebrow">${t}</span>`;
 
@@ -117,9 +122,10 @@ function nav(path) {
   return `<a class="skip" href="#main">Skip to content</a>
 <header class="nav" id="nav">
   <div class="wrap nav-inner">
-    <a class="brand" href="/" aria-label="Dylan Mazzei, home">${mark()}<span class="brand-word">Dylan Mazzei</span></a>
+    <a class="brand" href="/" aria-label="Dylan Mazzei, home">${logo()}</a>
     <nav aria-label="Primary"><ul class="nav-links">${desktop}</ul></nav>
     <div class="nav-cta">
+      <button class="theme-btn" id="theme-btn" type="button" aria-label="Switch to dark mode">${icon('moon', 'moon')}${icon('sun', 'sun')}</button>
       <a class="btn btn-primary btn-sm" href="/contact/">START A CONVERSATION</a>
       <button class="menu-btn" id="menu-btn" type="button" aria-expanded="false" aria-controls="mobile-menu" aria-label="Open menu">${icon('menu')}</button>
     </div>
@@ -136,7 +142,7 @@ function footer() {
   <div class="wrap">
     <div class="foot-top">
       <div class="foot-intro">
-        <a class="brand" href="/" aria-label="Dylan Mazzei, home">${mark()}<span class="brand-word">Dylan Mazzei</span></a>
+        <a class="brand" href="/" aria-label="Dylan Mazzei, home">${logo()}</a>
         <p>DYLAN MAZZEI | FOUNDER &amp; OPERATOR</p>
       </div>
       <div class="foot-col">
@@ -200,7 +206,9 @@ export function page({ path, title, description, body, schema = [] }) {
 <title>${title}</title>
 <meta name="description" content="${description}">
 <link rel="canonical" href="${canonical}">
-<meta name="theme-color" content="#ffffff">
+<meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)">
+<meta name="theme-color" content="#0b0b0d" media="(prefers-color-scheme: dark)">
+<meta name="color-scheme" content="light dark">
 <meta property="og:type" content="website">
 <meta property="og:site_name" content="Dylan Mazzei">
 <meta property="og:title" content="${title}">
@@ -214,9 +222,9 @@ export function page({ path, title, description, body, schema = [] }) {
 <link rel="icon" href="/favicon.svg" type="image/svg+xml">
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@500;700&family=JetBrains+Mono:wght@500&display=swap">
+<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@500;700&family=JetBrains+Mono:wght@500&family=Unbounded:wght@700&display=swap">
 <link rel="stylesheet" href="/assets/styles.css">
-<script>document.documentElement.classList.add('js');setTimeout(function(){if(!window.__site)document.documentElement.classList.remove('js')},2500)</script>
+<script>(function(){var r=document.documentElement;try{var t=localStorage.getItem('theme');if(t==='dark'||t==='light')r.setAttribute('data-theme',t)}catch(e){}if(!r.hasAttribute('data-theme')&&window.matchMedia&&matchMedia('(prefers-color-scheme: dark)').matches)r.setAttribute('data-theme','dark')})();document.documentElement.classList.add('js');setTimeout(function(){if(!window.__site)document.documentElement.classList.remove('js')},2500)</script>
 ${ld}
 </head>
 <body>
diff --git a/src/pages/about.mjs b/src/pages/about.mjs
index 7f11d7d..474ebd2 100644
--- a/src/pages/about.mjs
+++ b/src/pages/about.mjs
@@ -235,7 +235,7 @@ export default {
         <div class="prose">
           <p>Eight years ago, I couldn’t have mapped the route that brought me here. I’m glad I didn’t.</p>
           <p>There are still people I haven’t met, problems I haven’t seen, and ideas that will probably ruin a perfectly good night’s sleep.</p>
-          <p style="color:var(--porcelain)">If the next eight years surprise me too, I’ll take it.</p>
+          <p style="color:var(--on-dark)">If the next eight years surprise me too, I’ll take it.</p>
         </div>
         <div class="btn-row">${btn('START A CONVERSATION', '/contact/')}</div>
       </div>
diff --git a/src/pages/business-setup.mjs b/src/pages/business-setup.mjs
index dd6a2c6..1c86ee3 100644
--- a/src/pages/business-setup.mjs
+++ b/src/pages/business-setup.mjs
@@ -53,7 +53,7 @@ export default {
     <div class="panel anim" aria-hidden="true">
       <div class="panel-bar"><span class="lights"><i></i><i></i><i></i></span><strong>SETTING THE FIRST LAYER</strong></div>
       <div style="padding:20px;display:grid;gap:8px">
-        ${layers.map((l, i) => `<div class="row" style="border:1px solid var(--mist);border-radius:12px;padding:14px 16px;margin-left:${i * 14}px;${i === 0 ? 'background:var(--violet);color:var(--porcelain);border-color:var(--violet)' : ''}"><span class="index" style="${i === 0 ? 'color:var(--porcelain)' : ''}">0${i + 1}</span><span class="name" style="font-weight:700;font-size:16px">${l}</span></div>`).join('')}
+        ${layers.map((l, i) => `<div class="row" style="border:1px solid var(--mist);border-radius:12px;padding:14px 16px;margin-left:${i * 14}px;${i === 0 ? 'background:var(--accent);color:var(--on-accent);border-color:var(--accent)' : ''}"><span class="index" style="${i === 0 ? 'color:var(--on-accent)' : ''}">0${i + 1}</span><span class="name" style="font-weight:700;font-size:16px">${l}</span></div>`).join('')}
       </div>
     </div>
   </div>
@@ -88,7 +88,7 @@ export default {
       <div class="stack-sm">${eyebrow('HOW DELIVERY WORKS')}<h2 id="order" class="h-display">Make the Decisions in the Right Order.</h2></div>
       <div class="prose">
         <p>You don’t need eight disconnected recommendations.</p>
-        <p style="color:var(--porcelain)">You need to understand which decision affects the next one.</p>
+        <p style="color:var(--on-dark)">You need to understand which decision affects the next one.</p>
         <p>That’s why this service follows the same diagnostic-first approach as my broader consulting work.</p>
       </div>
     </div>
diff --git a/src/pages/consulting.mjs b/src/pages/consulting.mjs
index db79ec0..c585774 100644
--- a/src/pages/consulting.mjs
+++ b/src/pages/consulting.mjs
@@ -113,7 +113,7 @@ export default {
         <h2 id="frac" class="h-display">When the Business Needs an Owner, Not Another Recommendation.</h2>
         <div class="prose">
           <p>Some problems don’t need another project.</p>
-          <p style="color:var(--porcelain)">They need someone accountable for the function.</p>
+          <p style="color:var(--on-dark)">They need someone accountable for the function.</p>
           <p>I can step into the business as a fractional CMO, COO, CISO, or Chief AI Officer, bringing the same operator mindset that shapes my current ventures into a defined leadership role.</p>
         </div>
         <p class="statement">Strategy gets more useful when someone owns what happens next.</p>
@@ -212,7 +212,7 @@ export default {
         <div class="prose">
           <p>You don’t need to know exactly what is wrong before we talk.</p>
           <p>Bring me the bottleneck, the stalled growth, the messy operation, or simply the feeling that the business should be working better than it is.</p>
-          <p style="color:var(--porcelain)">We’ll figure out what deserves your attention before you spend more time or money trying to fix it.</p>
+          <p style="color:var(--on-dark)">We’ll figure out what deserves your attention before you spend more time or money trying to fix it.</p>
         </div>
         <div class="btn-row">${btn('BOOK YOUR DIAGNOSTIC', '/contact/')}</div>
       </div>
diff --git a/src/pages/marketing.mjs b/src/pages/marketing.mjs
index 0dab826..71372fb 100644
--- a/src/pages/marketing.mjs
+++ b/src/pages/marketing.mjs
@@ -53,7 +53,7 @@ export default {
       <div class="panel-bar"><span class="lights"><i></i><i></i><i></i></span><strong>Visibility Is Bigger Than Google Rankings Now.</strong></div>
       <div style="padding:20px;display:grid;gap:10px">
         ${surfaces.map((s, i) => `<div class="row" style="border:1px solid var(--mist);border-radius:12px;padding:12px 14px"><span class="ico">${icon(['search', 'spark', 'target', 'users', 'pin'][i])}</span><span class="name">${s}</span><span class="status"><span class="dot"></span></span></div>`).join('')}
-        <div class="row" style="border-radius:12px;padding:12px 14px;background:var(--violet);color:var(--porcelain);border:0"><span class="name">your website</span>${icon('arrow', 'check')}</div>
+        <div class="row" style="border-radius:12px;padding:12px 14px;background:var(--accent);color:var(--on-accent);border:0"><span class="name">your website</span>${icon('arrow', 'check')}</div>
       </div>
     </div>
   </div>
@@ -90,7 +90,7 @@ export default {
     <div class="sec-head reveal">
       <div class="stack-sm">${eyebrow('HOW DELIVERY WORKS')}<h2 id="delivery" class="h-display">We Don’t Start With a Channel. We Start With the Business.</h2></div>
       <div class="prose">
-        <p style="color:var(--porcelain)">Marketing problems have a habit of disguising themselves.</p>
+        <p style="color:var(--on-dark)">Marketing problems have a habit of disguising themselves.</p>
         <p>Weak conversion can look like a traffic problem. Poor attribution can make a good channel look bad. A visibility problem can begin somewhere entirely different from SEO.</p>
         <p>That’s why every engagement follows the same diagnostic-first approach behind my consulting work.</p>
       </div>
diff --git a/static/assets/site.js b/static/assets/site.js
index 34fd4d6..cac49e9 100644
--- a/static/assets/site.js
+++ b/static/assets/site.js
@@ -3,6 +3,31 @@
   var root = document.documentElement;
   var reduce = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
 
+  // Theme toggle: remembers the visitor's choice; otherwise follows the system.
+  var themeBtn = document.getElementById('theme-btn');
+  var mq = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
+  var current = function () { return root.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'; };
+  var paint = function () {
+    if (!themeBtn) return;
+    var dark = current() === 'dark';
+    themeBtn.setAttribute('aria-label', dark ? 'Switch to light mode' : 'Switch to dark mode');
+    themeBtn.setAttribute('aria-pressed', String(dark));
+  };
+  var apply = function (t, save) {
+    root.setAttribute('data-theme', t);
+    if (save) { try { localStorage.setItem('theme', t); } catch (e) {} }
+    paint();
+  };
+  paint();
+  if (themeBtn) themeBtn.addEventListener('click', function () { apply(current() === 'dark' ? 'light' : 'dark', true); });
+  if (mq && mq.addEventListener) {
+    mq.addEventListener('change', function (e) {
+      var saved = null;
+      try { saved = localStorage.getItem('theme'); } catch (err) {}
+      if (!saved) apply(e.matches ? 'dark' : 'light', false);
+    });
+  }
+
   // Nav border on scroll
   var nav = document.getElementById('nav');
   var onScroll = function () { nav && nav.classList.toggle('is-scrolled', window.scrollY > 8); };
diff --git a/static/assets/styles.css b/static/assets/styles.css
index d327d49..ea53aa8 100644
--- a/static/assets/styles.css
+++ b/static/assets/styles.css
@@ -1,12 +1,15 @@
 /* Dylan Mazzei — "Ivory Terminal"
-   White canvas, charcoal type, one violet for every deliberate action.
+   White canvas, charcoal type, one brand blue for every deliberate action.
    Layered product-style mockups carry the visuals; dark Inkstone bands mark the
    moments where Dylan talks about how he operates. */
 :root {
-  --violet: #594ff4;
-  --violet-press: #4a40e6;
-  --violet-soft: #eeedfe;
-  --violet-glow: rgba(89, 79, 244, 0.35);
+  --accent: #0870c4;
+  --accent-press: #065ea6;
+  --accent-soft: #e7f3fc;
+  --accent-glow: rgba(8, 112, 196, 0.35);
+  --accent-bright: #33b9ff;
+  --on-accent: #ffffff;
+  --logo-blue: #1a9cf0;
   --ink: #1f1f1f;
   --graphite: #333333;
   --slate: #5d5d5d;
@@ -16,6 +19,12 @@
   --cloud: #f6f6f6;
   --porcelain: #ffffff;
   --obsidian: #000000;
+  --surface-dark: #1f1f1f;
+  --surface-dark-2: #151515;
+  --on-dark: #ffffff;
+  --on-dark-muted: #b0b0b0;
+  --ink-fixed: #1f1f1f;
+  --nav-bg: rgba(255, 255, 255, 0.86);
   --signal-green: #1aab8b;
   --dark-line: #2e2e2e;
   --dark-muted: #9a9a9a;
@@ -23,6 +32,7 @@
   --code-str: #6fd6bd;
   --code-num: #ffb38a;
   --code-dim: #8a8a8a;
+  --shadow-color: rgba(0, 0, 0, 0.12);
 
   --font-sans: "Inter", "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
   --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
@@ -41,7 +51,7 @@
   --radius-card: 36px;
   --radius-panel: 16px;
   --radius-img: 10px;
-  --shadow-float: rgba(0, 0, 0, 0.12) 0px 0px 60px -13px;
+  --shadow-float: var(--shadow-color) 0px 0px 60px -13px;
 
   --page-max: 1200px;
   --gutter: 24px;
@@ -52,6 +62,54 @@
   color-scheme: light;
 }
 
+/* Dark theme: follows the system unless the visitor picks one with the toggle. */
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme="light"]) {
+  --accent: #33b9ff;
+  --accent-press: #66cbff;
+  --accent-soft: rgba(51, 185, 255, 0.14);
+  --accent-glow: rgba(51, 185, 255, 0.35);
+  --on-accent: #04121c;
+  --logo-blue: #33b9ff;
+  --ink: #f2f2f3;
+  --graphite: #d6d6d9;
+  --slate: #a4a4aa;
+  --smoke: #85858c;
+  --ash: #9a9aa1;
+  --mist: #26262b;
+  --cloud: #141417;
+  --porcelain: #0b0b0d;
+  --surface-dark: #18181c;
+  --surface-dark-2: #101013;
+  --dark-line: #2c2c32;
+  --nav-bg: rgba(11, 11, 13, 0.82);
+  --shadow-color: rgba(0, 0, 0, 0.6);
+  color-scheme: dark;
+  }
+}
+:root[data-theme="dark"] {
+  --accent: #33b9ff;
+  --accent-press: #66cbff;
+  --accent-soft: rgba(51, 185, 255, 0.14);
+  --accent-glow: rgba(51, 185, 255, 0.35);
+  --on-accent: #04121c;
+  --logo-blue: #33b9ff;
+  --ink: #f2f2f3;
+  --graphite: #d6d6d9;
+  --slate: #a4a4aa;
+  --smoke: #85858c;
+  --ash: #9a9aa1;
+  --mist: #26262b;
+  --cloud: #141417;
+  --porcelain: #0b0b0d;
+  --surface-dark: #18181c;
+  --surface-dark-2: #101013;
+  --dark-line: #2c2c32;
+  --nav-bg: rgba(11, 11, 13, 0.82);
+  --shadow-color: rgba(0, 0, 0, 0.6);
+  color-scheme: dark;
+}
+
 *, *::before, *::after { box-sizing: border-box; }
 html { scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-h) + 24px); -webkit-text-size-adjust: 100%; }
 body {
@@ -73,9 +131,9 @@ h1, h2, h3, h4, p, ul, ol, figure, blockquote { margin: 0; }
 ul, ol { padding: 0; list-style: none; }
 h1, h2, h3, h4 { font-weight: 700; text-wrap: balance; color: var(--ink); }
 p { text-wrap: pretty; }
-::selection { background: var(--violet); color: var(--porcelain); }
-:focus-visible { outline: 2px solid var(--violet); outline-offset: 3px; border-radius: 6px; }
-.skip { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--violet); color: var(--porcelain); padding: 10px 18px; border-radius: var(--radius-pill); }
+::selection { background: var(--accent); color: var(--on-accent); }
+:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 6px; }
+.skip { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--accent); color: var(--on-accent); padding: 10px 18px; border-radius: var(--radius-pill); }
 .skip:focus { top: 12px; }
 .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
 
@@ -91,7 +149,7 @@ p { text-wrap: pretty; }
   font-size: 13px; font-weight: 500; letter-spacing: var(--tracking-eyebrow);
   text-transform: uppercase; color: var(--smoke); line-height: 1.4;
 }
-.eyebrow::before { content: ""; width: 6px; height: 6px; border-radius: 2px; background: var(--violet); flex: none; }
+.eyebrow::before { content: ""; width: 6px; height: 6px; border-radius: 2px; background: var(--accent); flex: none; }
 .h-display-lg { font-size: var(--text-display-lg); line-height: 1.03; letter-spacing: -0.04em; }
 .h-display { font-size: var(--text-display); line-height: 1.07; letter-spacing: -0.032em; }
 .h-lg { font-size: var(--text-heading-lg); line-height: 1.15; letter-spacing: -0.022em; }
@@ -121,20 +179,20 @@ p { text-wrap: pretty; }
 .btn svg { width: 16px; height: 16px; flex: none; transition: transform .18s ease; }
 .btn:hover svg { transform: translateX(3px); }
 .btn:active { transform: translateY(1px); }
-.btn-primary { background: var(--violet); color: var(--porcelain); }
-.btn-primary:hover { background: var(--violet-press); box-shadow: 0 10px 30px -10px var(--violet-glow); }
-.btn-ghost { background: transparent; color: var(--violet); border-color: var(--violet); }
-.btn-ghost:hover { background: var(--violet-soft); }
-.btn-light { background: var(--porcelain); color: var(--ink); }
-.btn-light:hover { background: var(--mist); }
-.btn-ghost-light { background: transparent; color: var(--porcelain); border-color: rgba(255, 255, 255, .35); }
-.btn-ghost-light:hover { background: rgba(255, 255, 255, .08); border-color: var(--porcelain); }
+.btn-primary { background: var(--accent); color: var(--on-accent); }
+.btn-primary:hover { background: var(--accent-press); box-shadow: 0 10px 30px -10px var(--accent-glow); }
+.btn-ghost { background: transparent; color: var(--accent); border-color: var(--accent); }
+.btn-ghost:hover { background: var(--accent-soft); }
+.btn-light { background: var(--on-dark); color: var(--ink-fixed); }
+.btn-light:hover { background: #e7e7e7; }
+.btn-ghost-light { background: transparent; color: var(--on-dark); border-color: rgba(255, 255, 255, .35); }
+.btn-ghost-light:hover { background: rgba(255, 255, 255, .08); border-color: var(--on-dark); }
 .btn-sm { min-height: 42px; padding: 11px 20px; font-size: 12px; }
 .btn-block { width: 100%; }
 .btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
 .center .btn-row { justify-content: center; }
 
-.text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--violet); font: 700 13px/1.2 var(--font-sans); letter-spacing: 0.08em; text-transform: uppercase; }
+.text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--accent); font: 700 13px/1.2 var(--font-sans); letter-spacing: 0.08em; text-transform: uppercase; }
 .text-link svg { width: 16px; height: 16px; transition: transform .18s ease; }
 .text-link:hover svg { transform: translateX(3px); }
 
@@ -147,24 +205,35 @@ p { text-wrap: pretty; }
 }
 .tag-white { background: var(--porcelain); }
 .tag-line { background: transparent; border: 1px solid var(--mist); }
-.tag-violet { background: var(--violet); color: var(--porcelain); }
+.tag-accent { background: var(--accent); color: var(--on-accent); }
 .tag-upper { text-transform: uppercase; letter-spacing: var(--tracking-eyebrow); font-size: 12px; }
-.tag-dark { background: #2a2a2a; color: var(--porcelain); }
+.tag-dark { background: #2a2a2a; color: var(--on-dark); }
 .chips { display: flex; flex-wrap: wrap; gap: 8px; }
 .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--signal-green); flex: none; box-shadow: 0 0 0 3px rgba(26, 171, 139, .15); }
 
 /* ---------- Navigation ---------- */
 .nav {
   position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
-  background: rgba(255, 255, 255, 0.86);
+  background: var(--nav-bg);
   backdrop-filter: saturate(180%) blur(16px); -webkit-backdrop-filter: saturate(180%) blur(16px);
   border-bottom: 1px solid transparent; transition: border-color .2s ease;
 }
 .nav.is-scrolled { border-bottom-color: var(--mist); }
 .nav-inner { height: var(--nav-h); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
 .brand { display: inline-flex; align-items: center; gap: 12px; flex: none; }
-.brand-mark { width: 34px; height: 34px; flex: none; }
-.brand-word { font-size: 14px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
+.brand { color: var(--ink); }
+.logo-mark { width: 46px; height: auto; aspect-ratio: 104 / 60; flex: none; }
+.brand-word { display: inline-block; font-family: "Unbounded", var(--font-sans); font-size: 14px; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; transform: skewX(-12deg); white-space: nowrap; }
+.brand-word b { color: var(--logo-blue); font-weight: 700; }
+.theme-btn {
+  width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--mist); background: transparent; color: var(--slate);
+  display: inline-grid; place-items: center; cursor: pointer; flex: none; transition: color .15s ease, border-color .15s ease;
+}
+.theme-btn:hover { color: var(--ink); border-color: var(--ash); }
+.theme-btn svg { width: 17px; height: 17px; grid-area: 1 / 1; transition: opacity .2s ease, transform .3s ease; }
+.theme-btn .sun { opacity: 0; transform: rotate(-60deg) scale(.6); }
+:root[data-theme="dark"] .theme-btn .moon { opacity: 0; transform: rotate(60deg) scale(.6); }
+:root[data-theme="dark"] .theme-btn .sun { opacity: 1; transform: none; }
 .nav-links { display: flex; align-items: center; gap: 2px; }
 .nav-links > li { position: relative; }
 .nav-links a, .nav-links button {
@@ -173,7 +242,7 @@ p { text-wrap: pretty; }
   transition: background-color .15s ease, color .15s ease;
 }
 .nav-links a:hover, .nav-links button:hover, .nav-links li:focus-within > button { background: var(--cloud); color: var(--ink); }
-.nav-links a[aria-current="page"], .nav-links .is-active > button { color: var(--violet); }
+.nav-links a[aria-current="page"], .nav-links .is-active > button { color: var(--accent); }
 .nav-links .chev { width: 12px; height: 12px; transition: transform .2s ease; }
 .dropdown {
   position: absolute; top: calc(100% + 10px); left: 50%; translate: -50% 0; min-width: 300px;
@@ -186,7 +255,7 @@ p { text-wrap: pretty; }
 .has-drop:hover .chev, .has-drop:focus-within .chev { transform: rotate(180deg); }
 .dropdown a { display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 14px; }
 .dropdown a:hover { background: var(--cloud); }
-.dropdown .di { width: 36px; height: 36px; border-radius: 10px; background: var(--violet-soft); color: var(--violet); display: grid; place-items: center; }
+.dropdown .di { width: 36px; height: 36px; border-radius: 10px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; }
 .dropdown .di svg { width: 18px; height: 18px; }
 .dropdown strong { display: block; font-size: 14px; color: var(--ink); }
 .dropdown small { display: block; font-size: 12.5px; color: var(--smoke); line-height: 1.35; }
@@ -215,7 +284,7 @@ p { text-wrap: pretty; }
 .page-hero-grid > * { min-width: 0; }
 .page-hero .stack { gap: 28px; }
 .crumbs { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--smoke); }
-.crumbs a:hover { color: var(--violet); }
+.crumbs a:hover { color: var(--accent); }
 .crumbs svg { width: 12px; height: 12px; }
 
 /* ---------- Floating panels / mockups ---------- */
@@ -231,19 +300,19 @@ p { text-wrap: pretty; }
 .lights { display: flex; gap: 6px; }
 .lights i { width: 10px; height: 10px; border-radius: 50%; background: var(--mist); }
 .panel-url { margin-left: auto; padding: 4px 12px; border-radius: var(--radius-pill); background: var(--cloud); font-size: 12px; color: var(--smoke); }
-.panel-dark { background: var(--ink); border-color: var(--ink); color: var(--porcelain); }
+.panel-dark { background: var(--surface-dark); border-color: var(--surface-dark); color: var(--on-dark); }
 .panel-dark .panel-bar { border-bottom-color: var(--dark-line); color: var(--ash); }
 .panel-dark .lights i { background: #3a3a3a; }
-.file { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; color: var(--porcelain); }
+.file { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; color: var(--on-dark); }
 .file svg { width: 14px; height: 14px; color: var(--code-key); }
 .code-pre {
-  margin: 0; padding: 18px 20px 22px; font: 500 12.5px/1.75 var(--font-mono); color: var(--porcelain);
+  margin: 0; padding: 18px 20px 22px; font: 500 12.5px/1.75 var(--font-mono); color: var(--on-dark);
   counter-reset: ln; white-space: pre; overflow-x: auto;
 }
 .code-pre .ln { display: block; }
 .code-pre .ln::before { counter-increment: ln; content: counter(ln); display: inline-block; width: 24px; color: #4d4d4d; }
 .k { color: var(--code-key); } .s { color: var(--code-str); } .n { color: var(--code-num); } .p { color: var(--code-dim); }
-.cursor { display: inline-block; width: 7px; height: 15px; background: var(--violet); vertical-align: -3px; margin-left: 2px; animation: blink 1.1s steps(1) infinite; }
+.cursor { display: inline-block; width: 7px; height: 15px; background: var(--accent); vertical-align: -3px; margin-left: 2px; animation: blink 1.1s steps(1) infinite; }
 @keyframes blink { 50% { opacity: 0; } }
 
 /* ---------- Home hero ---------- */
@@ -275,11 +344,11 @@ p { text-wrap: pretty; }
 .list-head { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; font-size: 11.5px; color: var(--smoke); background: var(--cloud); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
 .row { display: flex; align-items: center; gap: 10px; padding: 9px 14px; font-size: 13.5px; border-top: 1px solid var(--mist); }
 .list-head + .row { border-top: 0; }
-.row .ico { width: 26px; height: 26px; border-radius: 8px; background: var(--violet-soft); color: var(--violet); display: grid; place-items: center; flex: none; }
+.row .ico { width: 26px; height: 26px; border-radius: 8px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; flex: none; }
 .row .ico svg { width: 15px; height: 15px; }
 .row .name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .status { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--slate); }
-.check { color: var(--violet); width: 16px; height: 16px; flex: none; }
+.check { color: var(--accent); width: 16px; height: 16px; flex: none; }
 .profile { left: 0; top: 170px; width: 252px; z-index: 3; padding: 14px; border-radius: 24px; }
 .profile img { border-radius: var(--radius-img); aspect-ratio: 1; object-fit: cover; object-position: center 20%; width: 100%; }
 .profile-meta { padding: 14px 4px 4px; display: grid; gap: 10px; }
@@ -299,9 +368,9 @@ p { text-wrap: pretty; }
 /* ---------- Feature grid ---------- */
 .features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 32px; }
 .feature { display: flex; flex-direction: column; gap: 16px; padding-block: 32px 40px; border-top: 1px solid var(--mist); position: relative; }
-.feature::before { content: ""; position: absolute; top: -1px; left: 0; width: 0; height: 1px; background: var(--violet); transition: width .5s ease; }
+.feature::before { content: ""; position: absolute; top: -1px; left: 0; width: 0; height: 1px; background: var(--accent); transition: width .5s ease; }
 .feature:hover::before { width: 100%; }
-.ic { width: 48px; height: 48px; border-radius: 14px; background: var(--cloud); color: var(--violet); display: grid; place-items: center; flex: none; }
+.ic { width: 48px; height: 48px; border-radius: 14px; background: var(--cloud); color: var(--accent); display: grid; place-items: center; flex: none; }
 .ic svg { width: 24px; height: 24px; }
 .feature h3 { font-size: 14px; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
 .feature p { font-size: var(--text-heading-sm); line-height: 1.4; letter-spacing: -0.01em; color: var(--graphite); }
@@ -320,8 +389,8 @@ p { text-wrap: pretty; }
 .card .card-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
 .card .ic { background: var(--porcelain); border-radius: 50%; }
 .card-white { background: var(--porcelain); border: 1px solid var(--mist); }
-.card-dark { background: var(--ink); color: var(--porcelain); }
-.card-dark h2, .card-dark h3, .card-dark h4 { color: var(--porcelain); }
+.card-dark { background: var(--surface-dark); color: var(--on-dark); box-shadow: inset 0 0 0 1px var(--dark-line); }
+.card-dark h2, .card-dark h3, .card-dark h4 { color: var(--on-dark); }
 .card-dark p, .card-dark .body { color: var(--ash); }
 .card-dark .eyebrow { color: var(--ash); }
 .card-lg { padding: 48px; gap: 24px; }
@@ -339,7 +408,7 @@ p { text-wrap: pretty; }
 .stat + .stat { padding-left: 24px; border-left: 1px solid var(--mist); }
 .stat span { font-size: 13px; color: var(--smoke); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
 .stat b { font-size: clamp(56px, 6.5vw, 88px); line-height: 1; letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }
-.stat b sup { font-size: .5em; vertical-align: .7em; color: var(--violet); margin-left: 2px; }
+.stat b sup { font-size: .5em; vertical-align: .7em; color: var(--accent); margin-left: 2px; }
 .stat-note { display: flex; flex-direction: column; justify-content: space-between; gap: 20px; }
 .stat-note p { color: var(--slate); }
 
@@ -347,7 +416,7 @@ p { text-wrap: pretty; }
 .showcase { background: var(--cloud); border-radius: var(--radius-card); padding: 64px; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
 .showcase > * { min-width: 0; }
 .showcase .stack { max-width: 540px; }
-.quote-line { font-size: var(--text-heading-sm); line-height: 1.45; letter-spacing: -0.01em; color: var(--ink); padding-left: 20px; border-left: 2px solid var(--violet); }
+.quote-line { font-size: var(--text-heading-sm); line-height: 1.45; letter-spacing: -0.01em; color: var(--ink); padding-left: 20px; border-left: 2px solid var(--accent); }
 .portrait { position: relative; padding-bottom: 48px; }
 .portrait img { width: 100%; aspect-ratio: 4 / 4.4; object-fit: cover; object-position: center 22%; border-radius: 24px; }
 .flow {
@@ -358,7 +427,7 @@ p { text-wrap: pretty; }
 .flow small { font-size: 12px; color: var(--smoke); }
 .flow ol { display: grid; gap: 10px; counter-reset: f; }
 .flow li { display: flex; align-items: center; gap: 12px; font-size: 14.5px; counter-increment: f; }
-.flow li::before { content: counter(f); width: 24px; height: 24px; border-radius: 50%; flex: none; display: grid; place-items: center; font-size: 12px; background: var(--violet-soft); color: var(--violet); }
+.flow li::before { content: counter(f); width: 24px; height: 24px; border-radius: 50%; flex: none; display: grid; place-items: center; font-size: 12px; background: var(--accent-soft); color: var(--accent); }
 
 /* Steps panel (process) */
 .steps-panel { border-radius: 24px; }
@@ -366,14 +435,14 @@ p { text-wrap: pretty; }
 .sp-step { display: grid; grid-template-columns: 44px 1fr; gap: 16px; align-items: start; padding: 20px 24px; }
 .sp-step + .sp-step { border-top: 1px solid var(--mist); }
 .sp-step .num { width: 44px; height: 44px; border-radius: 12px; background: var(--cloud); display: grid; place-items: center; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--slate); }
-.sp-step:first-child .num { background: var(--violet); color: var(--porcelain); }
+.sp-step:first-child .num { background: var(--accent); color: var(--on-accent); }
 .sp-step h4 { font-size: 16px; margin-top: 11px; }
 
 /* Book */
 .book-stage { display: grid; place-items: center; padding-block: 16px; perspective: 1200px; }
 .book {
   position: relative; width: min(300px, 80%); aspect-ratio: 3 / 4.1;
-  background: var(--ink); color: var(--porcelain); border-radius: 6px 16px 16px 6px;
+  background: var(--surface-dark); color: var(--on-dark); outline: 1px solid var(--dark-line); border-radius: 6px 16px 16px 6px;
   box-shadow: var(--shadow-float), rgba(0, 0, 0, 0.22) 24px 30px 50px -24px;
   padding: 32px 28px 28px 38px; display: flex; flex-direction: column;
   transform: rotateY(-14deg) rotateX(4deg); transform-style: preserve-3d; transition: transform .6s cubic-bezier(.2, .7, .2, 1);
@@ -381,22 +450,22 @@ p { text-wrap: pretty; }
 }
 .book-stage:hover .book { transform: rotateY(-4deg) rotateX(2deg); }
 .book::before { content: ""; position: absolute; left: 14px; top: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, .12); }
-.book::after { content: ""; position: absolute; right: -10px; top: 10px; bottom: 10px; width: 10px; border-radius: 0 6px 6px 0; background: repeating-linear-gradient(180deg, var(--porcelain) 0 2px, var(--mist) 2px 3px); }
-.book .brand-mark { width: 30px; height: 30px; }
-.book h3 { color: var(--porcelain); font-size: clamp(26px, 3vw, 34px); line-height: 1.05; letter-spacing: -0.03em; margin-top: auto; }
+.book::after { content: ""; position: absolute; right: -10px; top: 10px; bottom: 10px; width: 10px; border-radius: 0 6px 6px 0; background: repeating-linear-gradient(180deg, #ffffff 0 2px, #e7e7e7 2px 3px); }
+.book .logo-mark { width: 56px; color: var(--on-dark); }
+.book h3 { color: var(--on-dark); font-size: clamp(26px, 3vw, 34px); line-height: 1.05; letter-spacing: -0.03em; margin-top: auto; }
 .book .by { margin-top: 20px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .16); font-size: 12px; color: var(--ash); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
 .beats { display: grid; }
 .beats li { display: flex; gap: 14px; align-items: baseline; padding-block: 12px; border-top: 1px solid var(--mist); color: var(--ink); }
 .beats li:last-child { border-bottom: 1px solid var(--mist); }
-.beats li svg { width: 16px; height: 16px; color: var(--violet); flex: none; transform: translateY(2px); }
+.beats li svg { width: 16px; height: 16px; color: var(--accent); flex: none; transform: translateY(2px); }
 
 /* Duo (press + poetry) */
 .duo { display: grid; grid-template-columns: 1.15fr 1fr; gap: 16px; }
-.poem { font-size: var(--text-heading); line-height: 1.35; letter-spacing: -0.015em; display: grid; gap: 4px; color: var(--porcelain); }
+.poem { font-size: var(--text-heading); line-height: 1.35; letter-spacing: -0.015em; display: grid; gap: 4px; color: var(--on-dark); }
 .poem span:last-child { color: var(--ash); }
 
 /* ---------- Dark band ---------- */
-.band { background: var(--ink); color: var(--porcelain); position: relative; overflow: hidden; }
+.band { background: var(--surface-dark); color: var(--on-dark); position: relative; overflow: hidden; border-block: 1px solid var(--dark-line); }
 .band::before {
   content: ""; position: absolute; inset: 0; pointer-events: none;
   background-image: radial-gradient(rgba(255, 255, 255, .09) 1px, transparent 1px);
@@ -405,11 +474,11 @@ p { text-wrap: pretty; }
   -webkit-mask-image: radial-gradient(ellipse 80% 70% at 85% 10%, #000, transparent 70%);
 }
 .band > * { position: relative; }
-.band h2, .band h3, .band h4 { color: var(--porcelain); }
+.band h2, .band h3, .band h4 { color: var(--on-dark); }
 .band .eyebrow { color: var(--ash); }
 .band .body, .band .prose p, .band .lead { color: var(--ash); }
-.band .statement, .band .prose p.statement { color: var(--porcelain); }
-.inline-link { color: var(--violet); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
+.band .statement, .band .prose p.statement { color: var(--on-dark); }
+.inline-link { color: var(--accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
 .inline-link:hover { text-decoration-thickness: 2px; }
 .band + .section:not(.band) { padding-top: var(--section-y); }
 
@@ -417,13 +486,13 @@ p { text-wrap: pretty; }
 .rules { border-top: 1px solid var(--dark-line); }
 .rule { display: grid; grid-template-columns: 120px 1fr 1.2fr; gap: 32px; padding-block: 36px; border-bottom: 1px solid var(--dark-line); align-items: start; }
 .rule > * { min-width: 0; }
-.rule .index { color: var(--violet); font-size: 13px; padding-top: 8px; filter: brightness(1.35); }
+.rule .index { color: var(--accent-bright); font-size: 13px; padding-top: 8px; }
 .rule h3 { font-size: var(--text-heading-lg); line-height: 1.1; letter-spacing: -0.025em; }
 .rule .prose p { color: var(--ash); }
-.rule .prose p.ink { color: var(--porcelain); }
+.rule .prose p.ink { color: var(--on-dark); }
 .qlist { display: grid; gap: 6px; }
-.qlist p { font-family: var(--font-mono); font-size: 14.5px; color: var(--porcelain) !important; }
-.qlist p::before { content: "> "; color: var(--violet); filter: brightness(1.35); }
+.qlist p { font-family: var(--font-mono); font-size: 14.5px; color: var(--on-dark) !important; }
+.qlist p::before { content: "> "; color: var(--accent-bright); }
 
 /* Line list (short beats) */
 .lines { display: grid; gap: 4px; }
@@ -439,7 +508,7 @@ p { text-wrap: pretty; }
 .signal:nth-child(2) { font-size: 16px; opacity: .85; }
 .signal:nth-child(3) { font-size: 17px; }
 .signal .dot { background: var(--ash); box-shadow: none; }
-.signal:nth-child(3) .dot { background: var(--violet); box-shadow: 0 0 0 4px var(--violet-soft); }
+.signal:nth-child(3) .dot { background: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
 .shouts { display: grid; gap: 0; }
 .shout { padding-block: 22px; border-top: 1px solid var(--mist); display: grid; gap: 6px; }
 .shout:last-child { border-bottom: 1px solid var(--mist); }
@@ -456,7 +525,7 @@ p { text-wrap: pretty; }
   width: 52px; height: 52px; border-radius: 16px; background: var(--porcelain); border: 1px solid var(--mist);
   display: grid; place-items: center; font-weight: 700; font-size: 18px; font-variant-numeric: tabular-nums; color: var(--ink);
 }
-.process-step:first-child .num { background: var(--violet); border-color: var(--violet); color: var(--porcelain); }
+.process-step:first-child .num { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
 .process-step:not(:last-child)::after {
   content: ""; position: absolute; top: 58px; right: -16px; width: 16px; height: 1px; background: var(--ash);
 }
@@ -466,20 +535,20 @@ p { text-wrap: pretty; }
 /* ---------- Pricing / engagement ---------- */
 .plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: stretch; }
 .plan { border-radius: var(--radius-card); padding: 36px 32px; display: flex; flex-direction: column; gap: 20px; background: var(--cloud); min-width: 0; }
-.plan-featured { background: var(--ink); color: var(--porcelain); box-shadow: 0 30px 60px -30px rgba(31, 31, 31, .5); }
-.plan-featured h3, .plan-featured h4 { color: var(--porcelain); }
+.plan-featured { background: var(--surface-dark); color: var(--on-dark); box-shadow: 0 30px 60px -30px rgba(31, 31, 31, .5); outline: 1px solid var(--dark-line); }
+.plan-featured h3, .plan-featured h4 { color: var(--on-dark); }
 .plan.plan-featured p { color: var(--ash); }
 .plan .plan-name { font-size: 13px; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--smoke); display: flex; justify-content: space-between; align-items: center; gap: 8px; }
 .plan-featured .plan-name { color: var(--ash); }
 .plan h3 { font-size: var(--text-heading); line-height: 1.15; letter-spacing: -0.02em; }
 .plan p { color: var(--slate); }
 .plan .fee { padding-block: 14px; border-block: 1px solid var(--mist); font-weight: 700; color: var(--ink); font-size: 15px; }
-.plan-featured .fee { border-color: var(--dark-line); color: var(--porcelain); }
+.plan-featured .fee { border-color: var(--dark-line); color: var(--on-dark); }
 .plan ul { display: grid; gap: 12px; }
 .plan li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; color: var(--graphite); }
-.plan-featured li { color: var(--porcelain); }
-.plan li svg { width: 16px; height: 16px; color: var(--violet); flex: none; margin-top: 3px; }
-.plan-featured li svg { color: #8d86ff; }
+.plan-featured li { color: var(--on-dark); }
+.plan li svg { width: 16px; height: 16px; color: var(--accent); flex: none; margin-top: 3px; }
+.plan-featured li svg { color: var(--accent-bright); }
 .plan .btn { margin-top: auto; }
 
 /* ---------- Role chips (fractional) ---------- */
@@ -488,7 +557,7 @@ p { text-wrap: pretty; }
   border: 1px solid var(--dark-line); border-radius: 24px; padding: 24px; display: grid; gap: 28px;
   background: rgba(255, 255, 255, .02); transition: border-color .2s ease, background-color .2s ease;
 }
-.role:hover { border-color: var(--violet); background: rgba(89, 79, 244, .08); }
+.role:hover { border-color: var(--accent); background: rgba(89, 79, 244, .08); }
 .role .index { color: var(--dark-muted); }
 .role b { font-size: clamp(28px, 3.4vw, 40px); letter-spacing: -0.03em; line-height: 1; }
 
@@ -503,10 +572,10 @@ p { text-wrap: pretty; }
 }
 .tab-btn .ic { width: 40px; height: 40px; border-radius: 12px; }
 .tab-btn .ic svg { width: 20px; height: 20px; }
-.tab-btn .arr { width: 16px; height: 16px; opacity: 0; transition: opacity .15s ease, transform .15s ease; transform: translateX(-4px); color: var(--violet); }
+.tab-btn .arr { width: 16px; height: 16px; opacity: 0; transition: opacity .15s ease, transform .15s ease; transform: translateX(-4px); color: var(--accent); }
 .tab-btn:hover { background: var(--cloud); color: var(--ink); }
 .tab-btn[aria-selected="true"] { background: var(--cloud); color: var(--ink); border-color: var(--mist); }
-.tab-btn[aria-selected="true"] .ic { background: var(--violet); color: var(--porcelain); }
+.tab-btn[aria-selected="true"] .ic { background: var(--accent); color: var(--on-accent); }
 .tab-btn[aria-selected="true"] .arr { opacity: 1; transform: none; }
 .tab-panels { display: grid; gap: 16px; }
 .tab-panel { background: var(--cloud); border-radius: var(--radius-card); padding: 48px; display: flex; flex-direction: column; gap: 22px; min-height: 420px; }
@@ -533,7 +602,7 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 }
 .faq summary::-webkit-details-marker { display: none; }
 .faq summary .pm { width: 32px; height: 32px; border-radius: 50%; background: var(--porcelain); display: grid; place-items: center; flex: none; transition: transform .25s ease, background-color .2s ease, color .2s ease; color: var(--ink); }
-.faq details[open] summary .pm { transform: rotate(45deg); background: var(--violet); color: var(--porcelain); }
+.faq details[open] summary .pm { transform: rotate(45deg); background: var(--accent); color: var(--on-accent); }
 .faq summary .pm svg { width: 14px; height: 14px; }
 .faq .answer { padding: 0 26px 24px; display: grid; gap: 12px; color: var(--slate); max-width: 72ch; }
 .faq-layout { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 64px; align-items: start; }
@@ -545,11 +614,11 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 .venture { background: var(--cloud); border-radius: 28px; padding: 28px; display: flex; flex-direction: column; gap: 16px; min-width: 0; position: relative; overflow: hidden; transition: background-color .2s ease, transform .25s ease; }
 .venture:hover { background: var(--porcelain); box-shadow: var(--shadow-float); outline: 1px solid var(--mist); transform: translateY(-3px); }
 .venture-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
-.mono { width: 52px; height: 52px; border-radius: 16px; background: var(--ink); color: var(--porcelain); display: grid; place-items: center; font-weight: 700; font-size: 17px; letter-spacing: -0.02em; flex: none; }
-.venture:nth-child(3n+2) .mono { background: var(--violet); }
+.mono { width: 52px; height: 52px; border-radius: 16px; background: var(--surface-dark); color: var(--on-dark); display: grid; place-items: center; font-weight: 700; font-size: 17px; letter-spacing: -0.02em; flex: none; }
+.venture:nth-child(3n+2) .mono { background: var(--accent); }
 .venture:nth-child(3n+3) .mono { background: var(--porcelain); color: var(--ink); border: 1px solid var(--mist); }
 .venture h3 { font-size: 24px; letter-spacing: -0.02em; line-height: 1.15; }
-.venture .vrole { font-size: 13px; color: var(--violet); letter-spacing: 0.02em; line-height: 1.4; }
+.venture .vrole { font-size: 13px; color: var(--accent); letter-spacing: 0.02em; line-height: 1.4; }
 .venture p { color: var(--slate); font-size: 15px; }
 .venture .focus { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--mist); display: grid; gap: 10px; }
 .venture .focus small { font-size: 11.5px; color: var(--smoke); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
@@ -564,8 +633,8 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 .marquee-track.rev { animation-direction: reverse; animation-duration: 58s; }
 @keyframes marquee { to { transform: translateX(-50%); } }
 .cap { display: inline-flex; align-items: center; gap: 12px; padding: 16px 24px; border-radius: var(--radius-pill); background: var(--porcelain); border: 1px solid var(--mist); font-size: 17px; font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }
-.cap i { width: 8px; height: 8px; border-radius: 2px; background: var(--violet); }
-.band .cap { background: rgba(255, 255, 255, .04); border-color: var(--dark-line); color: var(--porcelain); }
+.cap i { width: 8px; height: 8px; border-radius: 2px; background: var(--accent); }
+.band .cap { background: rgba(255, 255, 255, .04); border-color: var(--dark-line); color: var(--on-dark); }
 
 /* Industries grid */
 .industries { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--mist); border-left: 1px solid var(--mist); }
@@ -573,8 +642,8 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 .industry:hover { background: var(--cloud); }
 .industry .index { color: var(--ash); }
 .industry b { font-size: 19px; letter-spacing: -0.015em; line-height: 1.2; }
-.industry-note { background: var(--violet); color: var(--porcelain); grid-column: span 3; flex-direction: row; align-items: flex-end; }
-.industry-note:hover { background: var(--violet-press); }
+.industry-note { background: var(--accent); color: var(--on-accent); grid-column: span 3; flex-direction: row; align-items: flex-end; }
+.industry-note:hover { background: var(--accent-press); }
 .filler { background: var(--cloud); }
 .filler:hover { background: var(--cloud); }
 .industry-note p { font-size: 15px; line-height: 1.45; }
@@ -586,7 +655,7 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 .cover h3 { font-size: 19px; letter-spacing: -0.015em; line-height: 1.25; }
 .cover ul { display: grid; gap: 0; }
 .cover li { display: flex; gap: 12px; align-items: flex-start; padding-block: 11px; border-top: 1px solid var(--cloud); color: var(--graphite); font-size: 15px; }
-.cover li svg { width: 16px; height: 16px; color: var(--violet); flex: none; margin-top: 3px; }
+.cover li svg { width: 16px; height: 16px; color: var(--accent); flex: none; margin-top: 3px; }
 
 /* ---------- Closing CTA ---------- */
 .closing { background: var(--cloud); border-radius: var(--radius-card); padding: 88px 48px; text-align: center; position: relative; overflow: hidden; }
@@ -600,12 +669,12 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 .closing > * { position: relative; }
 .closing-inner { max-width: 780px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 24px; }
 .closing .prose p { margin-inline: auto; }
-.closing-dark { background: var(--ink); color: var(--porcelain); }
+.closing-dark { background: var(--surface-dark); color: var(--on-dark); box-shadow: inset 0 0 0 1px var(--dark-line); }
 .closing-dark::before { background-image: radial-gradient(rgba(255, 255, 255, .1) 1px, transparent 1px); background-size: 22px 22px; }
-.closing-dark h2 { color: var(--porcelain); }
+.closing-dark h2 { color: var(--on-dark); }
 .closing-dark .prose p { color: var(--ash); }
 .closing-dark .eyebrow { color: var(--ash); }
-.closing-dark .statement { color: var(--porcelain); }
+.closing-dark .statement { color: var(--on-dark); }
 
 /* ---------- Contact ---------- */
 .contact-grid { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 64px; align-items: start; }
@@ -614,7 +683,7 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 .direct-row { display: grid; gap: 8px; padding-block: 22px; border-bottom: 1px solid var(--mist); }
 .direct-row small { font-size: 12px; color: var(--smoke); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
 .direct-row .val { font-size: clamp(20px, 2.2vw, 26px); font-weight: 700; letter-spacing: -0.02em; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
-.direct-row a.val:hover { color: var(--violet); }
+.direct-row a.val:hover { color: var(--accent); }
 .copy-btn { border: 1px solid var(--mist); background: var(--porcelain); border-radius: var(--radius-pill); padding: 6px 12px; font: 500 12px var(--font-sans); color: var(--graphite); cursor: pointer; }
 .copy-btn:hover { border-color: var(--ash); }
 .form-card { padding: 36px; border-radius: 28px; display: grid; gap: 24px; }
@@ -629,54 +698,55 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
   transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
 }
 .field textarea { min-height: 150px; resize: vertical; }
-.field input:focus, .field textarea:focus, .field select:focus { outline: none; background: var(--porcelain); border-color: var(--violet); box-shadow: 0 0 0 4px var(--violet-soft); }
+.field input:focus, .field textarea:focus, .field select:focus { outline: none; background: var(--porcelain); border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
 .form-note { font-size: 13px; color: var(--smoke); }
 .form-status { font-size: 14px; color: var(--signal-green); min-height: 1.4em; }
-.cal-card { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; padding: 28px 32px; border-radius: 28px; background: var(--ink); color: var(--porcelain); transition: transform .2s ease; }
+.cal-card { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; padding: 28px 32px; border-radius: 28px; background: var(--surface-dark); color: var(--on-dark); transition: transform .2s ease; }
 .cal-card:hover { transform: translateY(-2px); }
-.cal-card h3 { color: var(--porcelain); font-size: 22px; letter-spacing: -0.02em; }
+.cal-card h3 { color: var(--on-dark); font-size: 22px; letter-spacing: -0.02em; }
 .cal-card p { color: var(--ash); font-size: 15px; margin-top: 6px; }
-.cal-card .go { width: 52px; height: 52px; border-radius: 50%; background: var(--violet); display: grid; place-items: center; transition: transform .2s ease; }
+.cal-card .go { width: 52px; height: 52px; border-radius: 50%; background: var(--accent); display: grid; place-items: center; transition: transform .2s ease; }
 .cal-card:hover .go { transform: rotate(-45deg); }
 .cal-card .go svg { width: 18px; height: 18px; }
 
 /* ---------- Press ---------- */
-.feature-press { display: grid; grid-template-columns: 1fr 1fr; border-radius: var(--radius-card); overflow: hidden; background: var(--ink); color: var(--porcelain); }
+.feature-press { display: grid; grid-template-columns: 1fr 1fr; border-radius: var(--radius-card); overflow: hidden; background: var(--surface-dark); color: var(--on-dark); }
 .feature-press > * { min-width: 0; }
-.fp-visual { position: relative; min-height: 380px; background: #151515; display: grid; place-items: center; padding: 40px; overflow: hidden; }
+.fp-visual { position: relative; min-height: 380px; background: var(--surface-dark-2); display: grid; place-items: center; padding: 40px; overflow: hidden; }
 .fp-visual::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px); background-size: 18px 18px; }
 .magazine { position: relative; width: min(260px, 70%); aspect-ratio: 3 / 4; border-radius: 8px; overflow: hidden; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .8); transform: rotate(-4deg); transition: transform .5s ease; }
 .feature-press:hover .magazine { transform: rotate(-1deg) scale(1.02); }
 .magazine img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; filter: grayscale(.2) contrast(1.05); }
 .magazine::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .55) 0%, transparent 30%, transparent 55%, rgba(0, 0, 0, .75) 100%); }
-.magazine .mast { position: absolute; top: 14px; left: 16px; right: 16px; z-index: 1; font-weight: 700; font-size: 22px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--porcelain); }
-.magazine .cover-line { position: absolute; bottom: 16px; left: 16px; right: 16px; z-index: 1; font-size: 13px; line-height: 1.3; color: var(--porcelain); font-weight: 700; }
+.magazine .mast { position: absolute; top: 14px; left: 16px; right: 16px; z-index: 1; font-weight: 700; font-size: 22px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--on-dark); }
+.magazine .cover-line { position: absolute; bottom: 16px; left: 16px; right: 16px; z-index: 1; font-size: 13px; line-height: 1.3; color: var(--on-dark); font-weight: 700; }
 .fp-copy { padding: 56px; display: flex; flex-direction: column; gap: 22px; justify-content: center; }
-.fp-copy h3 { color: var(--porcelain); font-size: var(--text-heading-lg); letter-spacing: -0.025em; line-height: 1.12; }
+.fp-copy h3 { color: var(--on-dark); font-size: var(--text-heading-lg); letter-spacing: -0.025em; line-height: 1.12; }
 .fp-copy .meta { font-size: 12px; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--ash); }
 .topics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
 .topic { border: 1px solid var(--mist); border-radius: 28px; padding: 32px; display: grid; gap: 14px; grid-template-columns: 48px 1fr; align-items: start; transition: border-color .2s ease; }
-.topic:hover { border-color: var(--violet); }
+.topic:hover { border-color: var(--accent); }
 .topic h3 { font-size: 14px; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; margin-top: 4px; }
 .topic p { color: var(--graphite); font-size: 18px; line-height: 1.45; letter-spacing: -0.01em; grid-column: 2; }
 
 /* ---------- Footer ---------- */
-.footer { background: var(--obsidian); color: var(--porcelain); padding-block: 80px clamp(110px, 17vw, 250px); margin-top: var(--section-y); position: relative; overflow: hidden; }
+.footer { background: var(--obsidian); color: var(--on-dark); padding-block: 80px clamp(110px, 17vw, 250px); margin-top: var(--section-y); position: relative; overflow: hidden; }
 .foot-cta { display: flex; justify-content: space-between; align-items: end; gap: 32px; flex-wrap: wrap; padding-bottom: 64px; border-bottom: 1px solid #1f1f1f; }
-.foot-cta h2 { color: var(--porcelain); max-width: 16ch; }
+.foot-cta h2 { color: var(--on-dark); max-width: 16ch; }
 .foot-top { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 48px; }
 .foot-top > * { min-width: 0; }
-.foot-top .brand-word { color: var(--porcelain); }
+.footer .brand { color: var(--on-dark); }
+.footer .brand-word b { color: var(--accent-bright); }
 .foot-intro { display: grid; gap: 20px; align-content: start; }
-.foot-intro p { color: var(--ash); font-size: 13px; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
+.foot-intro p { color: var(--on-dark-muted); font-size: 13px; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
 .foot-col h4 { font-size: 12px; font-weight: 500; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--slate); margin-bottom: 18px; }
 .foot-col ul { display: grid; gap: 12px; }
-.foot-col a { color: var(--porcelain); transition: color .15s ease; overflow-wrap: anywhere; }
-.foot-col a:hover { color: #8d86ff; }
+.foot-col a { color: var(--on-dark); transition: color .15s ease; overflow-wrap: anywhere; }
+.foot-col a:hover { color: var(--accent-bright); }
 .foot-col .muted { color: var(--ash); }
 .foot-big { margin-top: 72px; padding-top: 32px; border-top: 1px solid #1f1f1f; display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; }
 .foot-big .places { font-size: clamp(22px, 3.4vw, 40px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.15; }
-.foot-big .places i { font-style: normal; color: var(--violet); padding-inline: 12px; }
+.foot-big .places i { font-style: normal; color: var(--accent); padding-inline: 12px; }
 .foot-big small { color: var(--slate); font-size: 13px; }
 .foot-word { position: absolute; left: 50%; bottom: -0.22em; translate: -50% 0; font-size: clamp(80px, 17vw, 250px); font-weight: 700; letter-spacing: -0.06em; line-height: 1; color: #121212; white-space: nowrap; pointer-events: none; user-select: none; }
 .footer .wrap { position: relative; z-index: 1; }
@@ -752,7 +822,9 @@ html:not(.js) .tabs { grid-template-columns: 1fr; }
 }
 @media (max-width: 640px) {
   :root { --gutter: 16px; --section-y: 64px; --nav-h: 64px; }
-  .brand-word { font-size: 13px; }
+  .brand-word { font-size: 12px; }
+  .logo-mark { width: 38px; }
+  .nav-cta { gap: 6px; }
   .hero { padding-top: 56px; }
   .page-hero { padding-block: 48px 56px; }
   .cluster { grid-template-columns: 1fr; margin-top: 48px; }
diff --git a/static/favicon.svg b/static/favicon.svg
index d09b789..854c0bd 100644
--- a/static/favicon.svg
+++ b/static/favicon.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 34"><rect width="34" height="34" rx="10" fill="#594ff4"/><path d="M8 9h7.2c4.4 0 7.3 3.1 7.3 7.6 0 1.5-.3 2.8-.9 4L16.9 25H8l1.8-3.2h5.6c2.6 0 4.1-2 4.1-4.9 0-2.6-1.5-4.6-4.3-4.6h-5.3z" fill="#fff"/><path d="M27 8.5 18.3 25.5h4.2L27 16.8z" fill="#fff" opacity=".55"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><rect width="64" height="64" rx="16" fill="#0b0b0d"/><g transform="translate(6 15) scale(.5)"><path fill="#fff" fill-rule="evenodd" d="M9 4h55c10 0 13 7 9 14L58 46c-3 6-8 8-15 8.5L3 57zM21.5 15.5 18.3 45.8 40 44.5c4-.3 6-1.5 7.5-4.3l12-21.4c1.2-2.2.3-3.3-2-3.3z"/><path fill="#33b9ff" d="M24 59 102 1 91 52 72 54.5 79 33z"/><path fill="#8fdcff" d="M24 59 102 1 79 33z"/></g></svg>