From d2f80b156557800bceb909c5e5a3c6b963133511 Mon Sep 17 00:00:00 2001
From: Michael Victory <michael@opencommunications.consulting>
Date: Tue, 16 Jun 2026 14:45:21 -0700
Subject: [PATCH] OC footer: exact match to Manus build (footer-bg watermark
 svg + scaled content block on mobile, align-items center, logo 28/21px)

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 assets/brand/oc-logo-wh.svg | 34 ++++++++++++++++++++++++++++++++++
 index.html                  | 21 ++++++++++++++-------
 style.css                   | 34 ++++++++++++++++++++++------------
 3 files changed, 70 insertions(+), 19 deletions(-)
 create mode 100644 assets/brand/oc-logo-wh.svg

diff --git a/assets/brand/oc-logo-wh.svg b/assets/brand/oc-logo-wh.svg
new file mode 100644
index 0000000..4c96292
--- /dev/null
+++ b/assets/brand/oc-logo-wh.svg
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1267.11 451.01">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #fff;
+      }
+    </style>
+  </defs>
+  <g id="Layer_1-2" data-name="Layer_1">
+    <g>
+      <path class="cls-1" d="M0,406.32c0-25.36,17.27-44.69,43.74-44.69,22.5,0,36.45,12.84,39.46,31.22h-24.09c-1.74-7.77-6.81-12.68-15.06-12.68-12.52,0-18.86,10.3-18.86,26.15s6.34,25.83,18.86,25.83c9.19,0,14.74-5.55,15.85-15.21h23.93c-.79,19.18-16.01,34.07-39.46,34.07-26.94,0-44.38-19.49-44.38-44.69Z"/>
+      <path class="cls-1" d="M91.45,406.32c0-25.36,17.75-44.69,44.69-44.69s44.38,19.33,44.38,44.69-17.59,44.69-44.38,44.69-44.69-19.49-44.69-44.69ZM155.32,406.32c0-16.01-6.97-26.94-19.33-26.94s-19.34,10.94-19.34,26.94,6.66,26.63,19.34,26.63,19.33-10.78,19.33-26.63Z"/>
+      <path class="cls-1" d="M193.04,364h23.93v13.15h.48c5.39-9.98,13.47-15.53,25.36-15.53,11.09,0,18.86,5.55,23.14,16.01h.32c6.97-11.25,16.17-16.01,26.78-16.01,18.7,0,28.37,12.36,28.37,31.06v55.63h-24.72v-51.51c0-9.19-4.44-14.74-12.52-14.74-8.87,0-14.42,7.45-14.42,18.23v48.02h-24.88v-51.51c0-9.19-4.12-14.74-12.36-14.74-8.72,0-14.58,7.45-14.58,18.23v48.02h-24.88v-84.31Z"/>
+      <path class="cls-1" d="M337.26,364h23.93v13.15h.48c5.39-9.98,13.47-15.53,25.36-15.53,11.09,0,18.86,5.55,23.14,16.01h.32c6.97-11.25,16.17-16.01,26.78-16.01,18.7,0,28.37,12.36,28.37,31.06v55.63h-24.72v-51.51c0-9.19-4.44-14.74-12.52-14.74-8.87,0-14.42,7.45-14.42,18.23v48.02h-24.88v-51.51c0-9.19-4.12-14.74-12.36-14.74-8.72,0-14.58,7.45-14.58,18.23v48.02h-24.88v-84.31Z"/>
+      <path class="cls-1" d="M536.32,448.31v-12.04h-.48c-6.18,9.83-13.79,14.42-25.36,14.42-19.18,0-29.64-12.36-29.64-30.9v-55.79h24.88v51.03c0,9.35,4.6,14.74,13.47,14.74,9.98,0,16.17-7.61,16.17-18.07v-47.7h24.56v84.31h-23.61Z"/>
+      <path class="cls-1" d="M600.51,376.84h.48c5.23-10.14,14.26-15.21,25.99-15.21,18.54,0,29.32,12.36,29.32,31.22v55.47h-24.72v-50.71c0-9.19-4.91-15.37-14.11-15.37-9.67,0-16.17,7.77-16.17,18.54v47.55h-24.88v-84.31h24.09v12.84Z"/>
+      <path class="cls-1" d="M671.99,330.4h25.2v21.71h-25.2v-21.71ZM672.15,364h24.88v84.31h-24.88v-84.31Z"/>
+      <path class="cls-1" d="M709.55,406.32c0-25.36,17.27-44.69,43.74-44.69,22.5,0,36.45,12.84,39.46,31.22h-24.09c-1.74-7.77-6.81-12.68-15.06-12.68-12.52,0-18.86,10.3-18.86,26.15s6.34,25.83,18.86,25.83c9.19,0,14.74-5.55,15.85-15.21h23.93c-.79,19.18-16.01,34.07-39.46,34.07-26.94,0-44.38-19.49-44.38-44.69Z"/>
+      <path class="cls-1" d="M857.73,438.01h-.32c-5.55,7.77-12.52,12.52-25.52,12.52-16.64,0-28.84-8.87-28.84-25.52,0-18.7,14.74-23.46,33.12-25.67,15.06-2.06,21.24-4.44,21.24-10.78s-3.96-10.14-12.52-10.14c-9.51,0-14.11,4.44-14.74,11.09h-22.98c.63-14.42,12.36-27.89,37.4-27.89,10.78,0,18.38,1.58,24.25,5.07,8.72,5.07,12.84,13.79,12.84,25.2v43.27c0,6.66.95,10.3,3.17,11.73v1.43h-24.25c-1.27-1.9-2.38-5.55-2.85-10.3ZM858.05,418.04v-10.94c-3.65,2.22-9.03,3.49-14.58,4.75-10.94,2.38-16.17,5.07-16.17,12.36s5.55,9.98,12.36,9.98c11.09,0,18.38-6.97,18.38-16.17Z"/>
+      <path class="cls-1" d="M892.76,364h12.68v-26.94h24.41v26.94h16.48v15.85h-16.48v41.84c0,6.34,3.49,8.08,9.35,8.08,1.59,0,4.12-.16,5.71-.32h1.27v18.54c-2.69.48-7.77,1.27-14.42,1.27-15.69,0-26.31-5.07-26.31-22.19v-47.23h-12.68v-15.85Z"/>
+      <path class="cls-1" d="M959.17,330.4h25.2v21.71h-25.2v-21.71ZM959.33,364h24.88v84.31h-24.88v-84.31Z"/>
+      <path class="cls-1" d="M996.73,406.32c0-25.36,17.75-44.69,44.69-44.69s44.38,19.33,44.38,44.69-17.59,44.69-44.38,44.69-44.69-19.49-44.69-44.69ZM1060.6,406.32c0-16.01-6.97-26.94-19.33-26.94s-19.34,10.94-19.34,26.94,6.66,26.63,19.34,26.63,19.33-10.78,19.33-26.63Z"/>
+      <path class="cls-1" d="M1122.41,376.84h.48c5.23-10.14,14.26-15.21,25.99-15.21,18.54,0,29.32,12.36,29.32,31.22v55.47h-24.72v-50.71c0-9.19-4.91-15.37-14.11-15.37-9.67,0-16.17,7.77-16.17,18.54v47.55h-24.88v-84.31h24.09v12.84Z"/>
+      <path class="cls-1" d="M1188.66,422.32h23.46c1.43,7.92,7.45,12.36,17.12,12.36,8.87,0,13.95-3.65,13.95-9.67,0-7.61-9.98-8.56-21.71-10.78-15.06-2.85-30.27-6.66-30.27-26.31,0-17.27,15.69-26.31,35.5-26.31,23.46,0,35.18,10.14,37.4,24.88h-23.14c-1.58-6.02-6.34-9.03-14.26-9.03s-12.52,3.17-12.52,8.56c0,6.34,9.19,7.29,20.76,9.35,15.06,2.69,32.17,6.66,32.17,27.89,0,18.23-16.17,27.73-38.04,27.73-24.41,0-39.15-11.73-40.41-28.69Z"/>
+    </g>
+    <g>
+      <path class="cls-1" d="M792.41,174.06c-8.6,0-15.57-6.97-15.57-15.57s6.97-15.57,15.57-15.57h157.73C942.31,62.69,874.69,0,792.42,0c-87.53,0-158.48,70.96-158.48,158.48s70.96,158.48,158.48,158.48c82.27,0,149.9-62.69,157.72-142.91h-157.73Z"/>
+      <path class="cls-1" d="M1108.62.38c-.54,0-1.08.02-1.61.02v-.02s-156.87,0-156.87,0v158.1h0c0,.13,0,.25,0,.38,0,82.27,62.69,149.9,142.91,157.72v-157.73c0-8.6,6.97-15.57,15.57-15.57s15.57,6.97,15.57,15.57v157.73c80.22-7.83,142.91-75.45,142.91-157.72,0-87.53-70.96-158.48-158.48-158.48Z"/>
+      <path class="cls-1" d="M158.48,0C70.96,0,0,70.96,0,158.48s70.96,158.48,158.48,158.48,158.48-70.96,158.48-158.48S246.01,0,158.48,0ZM162.61,209.89c-28.39,0-51.41-23.02-51.41-51.41s23.02-51.41,51.41-51.41,51.41,23.02,51.41,51.41-23.02,51.41-51.41,51.41Z"/>
+      <path class="cls-1" d="M475.45,0C387.92,0,316.97,70.96,316.97,158.48v158.48h110.07v-158.86c0-28.39,23.02-51.41,51.41-51.41s51.41,23.02,51.41,51.41-23.02,51.41-51.41,51.41h-20.26v107.46h17.26c87.53,0,158.48-70.96,158.48-158.48S562.98,0,475.45,0Z"/>
+    </g>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/index.html b/index.html
index de8b279..89030d5 100644
--- a/index.html
+++ b/index.html
@@ -164,18 +164,25 @@
 
 </main>
 
-<footer class="band dark site-footer" data-bg="dark">
-  <img class="footer-watermark" src="assets/brand/oc-mark-wh.svg" alt="" aria-hidden="true">
-  <div class="footer-inner">
-    <div class="wrap">
-      <div class="footer-brand logo-mark" role="img" aria-label="Open Communications"></div>
-      <nav class="footer-nav" aria-label="Footer">
+<footer class="site-footer" data-bg="dark">
+  <div class="footer-bg" aria-hidden="true">
+    <svg class="footer-bg-img" viewBox="0 0 1267.11 316.97" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+      <path d="M792.41,174.06c-8.6,0-15.57-6.97-15.57-15.57s6.97-15.57,15.57-15.57h157.73C942.31,62.69,874.69,0,792.42,0c-87.53,0-158.48,70.96-158.48,158.48s70.96,158.48,158.48,158.48c82.27,0,149.9-62.69,157.72-142.91h-157.73Z"/>
+      <path d="M1108.62.38c-.54,0-1.08.02-1.61.02v-.02s-156.87,0-156.87,0v158.1h0c0,.13,0,.25,0,.38,0,82.27,62.69,149.9,142.91,157.72v-157.73c0-8.6,6.97-15.57,15.57-15.57s15.57,6.97,15.57,15.57v157.73c80.22-7.83,142.91-75.45,142.91-157.72,0-87.53-70.96-158.48-158.48-158.48Z"/>
+      <path d="M158.48,0C70.96,0,0,70.96,0,158.48s70.96,158.48,158.48,158.48,158.48-70.96,158.48-158.48S246.01,0,158.48,0ZM162.61,209.89c-28.39,0-51.41-23.02-51.41-51.41s23.02-51.41,51.41-51.41,51.41,23.02,51.41,51.41-23.02,51.41-51.41,51.41Z"/>
+      <path d="M475.45,0C387.92,0,316.97,70.96,316.97,158.48v158.48h110.07v-158.86c0-28.39,23.02-51.41,51.41-51.41s51.41,23.02,51.41,51.41-23.02,51.41-51.41,51.41h-20.26v107.46h17.26c87.53,0,158.48-70.96,158.48-158.48S562.98,0,475.45,0Z"/>
+    </svg>
+  </div>
+  <div class="footer-content">
+    <div class="footer-block">
+      <div class="footer-logo"><img class="footer-logo-img" src="assets/brand/oc-logo-wh.svg" alt="Open Communications"></div>
+      <nav class="footer-links" aria-label="Footer">
         <a href="#problem">The problem</a>
         <a href="#work">How we work</a>
         <a href="#who">Who we are</a>
         <a href="https://shopwisdom.ca">ShopWisdom</a>
       </nav>
-      <p class="footer-legal">Open Communications and ShopWisdom are practices of Open Communications, owned and operated by Michael Victory · British Columbia, Canada</p>
+      <p class="footer-copy">Open Communications and ShopWisdom are practices of Open Communications, owned and operated by Michael Victory · British Columbia, Canada</p>
     </div>
   </div>
 </footer>
diff --git a/style.css b/style.css
index 7df8d52..3cb8de4 100644
--- a/style.css
+++ b/style.css
@@ -165,19 +165,29 @@ a.tel { text-decoration: none; }
 .actions.center { margin: 2.2em 0 0.8em; }
 .promise { font-style: italic; color: var(--ink-soft); font-size: 0.95rem; }
 
-/* Footer — the full bg "open" logo dictates the size (aspect 4:1, no clip, no padding); content overlaid low-left */
-.site-footer { padding: 0; background: var(--navy); position: relative; overflow: hidden; }
-.footer-watermark { display: block; width: 100%; height: auto; opacity: 0.06; pointer-events: none; }
-.footer-inner { position: absolute; left: 0; right: 0; bottom: 0; padding-bottom: 22px; }
-@media (max-width: 760px) {
-  .footer-watermark { position: absolute; left: 0; right: 0; bottom: 0; }
-  .footer-inner { position: relative; padding: 44px 0 26px; }
+/* Footer — exact match to the Manus build: bg "open" watermark (full-width svg) dictates height; content overlaid, scaled to fit on mobile */
+.site-footer { border-top: 1.5px solid rgba(15, 23, 41, 0.1); background: #0f1729; position: relative; }
+.footer-bg { width: 100%; display: block; pointer-events: none; }
+.footer-bg-img { width: 100%; height: auto; display: block; }
+.footer-bg-img path { fill: #1a2332; }
+.footer-content { position: absolute; inset: 0; display: flex; align-items: flex-end; justify-content: flex-start; padding: 1.5rem 2rem; }
+.footer-block { display: flex; flex-direction: column; gap: 0.25rem; }
+.footer-logo-img { height: 28px; width: auto; display: block; }
+.footer-links { display: flex; gap: 1rem; }
+.footer-links a { font-family: 'DM Sans', system-ui, sans-serif; font-size: 0.55rem; letter-spacing: 0.08em; text-transform: uppercase; color: #f7f4ef; text-decoration: none; transition: color 0.3s; }
+.footer-links a:hover { color: #e89b1c; }
+.footer-copy { font-family: 'DM Sans', system-ui, sans-serif; font-size: 0.5rem; color: #f7f4ef66; letter-spacing: 0.03em; line-height: 1.4; margin: 0; }
+@media (max-width: 900px) {
+  .footer-content { padding: 1rem 1.25rem; }
+  .footer-logo-img, .footer-bg-img { overflow: visible; }
+  .footer-logo-img { height: 21px; }
+}
+@media (max-width: 600px) {
+  .footer-content { align-items: center; justify-content: flex-start; padding: 0 1.5rem; }
+  .footer-block { align-items: flex-start; transform: scale(0.75); transform-origin: left center; }
+  .footer-links { justify-content: flex-start; }
+  .footer-copy { text-align: left; }
 }
-.footer-brand { width: 128px; height: 27px; background-color: var(--cream); margin-bottom: 10px; }
-.footer-nav { display: flex; flex-wrap: wrap; gap: 22px; font-family: 'DM Sans', sans-serif; font-size: 0.7rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.13em; margin-bottom: 9px; }
-.footer-nav a { color: var(--cream-soft); text-decoration: none; }
-.footer-nav a:hover { color: #fff; }
-.footer-legal { font-family: 'DM Sans', sans-serif; font-size: 0.72rem; line-height: 1.55; color: rgba(247, 244, 239, 0.4); margin: 0; max-width: 46em; }
 
 /* Focus */
 a:focus-visible, .btn:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; border-radius: 2px; }