Mike: no left-edge blend on OC, match the Inga (full-bleed, balanced) version, and
make the loops more transparent. Desktop waves go full-bleed with the gentle top/
bottom paper fade (no horizontal fade), opacity .5 -> .35. Mobile C .5 -> .4.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Desktop swaps to the flowing thin-line waves (they blend clean against the cream;
C's cool-gray background never did) with the Manus-style left-edge paper fade
restored. Mobile keeps the C loop Mike approved (rotated 90deg, centered, tinted).
JS chooses the source by viewport at load. Drop the unused comparison clips.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
C's background is cool-gray (not white), so multiply muddied it against the
cream. Back to plain cover at 50% opacity, normal blend, no zoom.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The gap was C's cool-white background reading against the cream + the zoom
pushing dots to one corner. Switch the desktop loop to mix-blend-mode:multiply
over the paper bg: white dissolves into paper (seamless, no gap), dots remain,
full-res (no zoom), and it holds at any viewport width. Opacity back to 1 (the
multiply does the lightening). Mobile pinned to its approved look (normal blend,
.5 opacity, rotate, centered).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
C's dots cluster low-right, leaving the tall desktop column's top empty. Zoom
1.45x + object-position 66% to fill it (1080p keeps it crisp at this level).
Scoped to desktop; mobile resets object-position to center so the approved
mobile framing is untouched.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- Revert the scale/translate zoom that softened the loop and pulled it off the
edges; back to full-cover (full res). Re-encoded current loop at 1080p (2.4MB).
- Keep the 50% opacity lightening. Mobile loop back to centered (left:50%).
- theme-color -> navy (#0f1729) so the mobile address-bar UI is dark blue, not amber.
- Add hero-previews.html: 4 hero options (current + A/B/C) at 50%, full-cover, noindex,
for side-by-side comparison. Preview videos are temporary.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Wash the loop back into the paper so text reads cleanly over it (matters most on
mobile where text overlays the loop): drop the playing opacity to .5 (blends with
the paper bg) and flip the tint overlay from darkening multiply to a light paper
wash (.2). Tunable via those two values.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Desktop: drop the left-edge mask (the near-white clip blends into paper on its
own) and zoom/lift the loop (scale 1.7, translateY -16%) so the waves center on
the "easy part" headline instead of sitting low. Mobile: shift the rotated loop
left (left:34%) so it reads as a left-third band behind the headline + book
button. Both dialed via offline still-frame mocks (the loop won't decode in the
review browser).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Move the top-down fade start from 52% to 18% so the ambient reads behind the
headline (desktop-like presence) instead of tucked at the bottom.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Was position:relative on mobile, so it pushed down below the text. Make it the
full-bleed hero background (inherits absolute inset), rotated 90deg CW and sized
100vh x 100vw so it covers after rotation, with a top->down mask so the headline
reads over paper and the ambient shows lower.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- Nav: fully transparent over the hero (no bg/blur/border), frosts in once
scrolled past 24px (.scrolled toggled in updateNavTheme; on-dark still wins
over dark sections).
- Mobile hero loop: rotate 90deg CW and size (240px x 100vw, centered) so it
fills the landscape strip after rotation; warm tint ::after still applies.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Stop boxing the loop. Pull .hero-media out of the content grid to a direct child
of .hero, absolutely positioned to bleed off the right edge and up behind the
frosted nav. Dissolve its left edge into the paper with a gradient mask-image and
warm it with a subtle paper/multiply overlay so it reads as cream, not stark
white — matching how Manus meshed it in. Mobile = full-width strip with a
bottom fade.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Can't generate a frame poster (the loop is VP9; fine for real browsers but the
review tooling can't decode it), so rely on the paper-tinted panel as the
instant never-blank base and fade the video in on the 'playing' event. Cleaner
and removes a 404. VP9 confirmed — plays on all modern browsers + iOS 14.5+.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Bring back the reference's hero ambient — text left, looping WebM right — but
fixed: self-hosted (62KB, off Manus's S3), poster-first with a paper-tinted
container so it's NEVER blank, and loaded via JS only when appropriate (skipped
on Save-Data and prefers-reduced-motion; poster stays if autoplay is blocked).
No autoplay attribute = no surprise download. Poster image added next.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The negative bottom margin let the next band's paper bg paint over the circle's
lower edge (the "clip"). Use symmetric positive margin + line-height:0 +
overflow:visible. Bump to 34px and give the scale-in a small rotate so the
entrance actually reads.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Progressive-enhancement motion, all gated on a single html.has-motion line so
it's trivially on/off:
- Section reveal-on-scroll (fade + 10px rise), below the fold only — hero stays
instant so LCP is untouched. Animates opacity/transform only (CLS 0).
- Staggered reveal on the three "how we work" blocks.
- Grow-on-hover underline for prose links (clearer affordance).
- An open-o divider that settles in just before the contact CTA.
- Persistent "Book a conversation" that returns after the hero scrolls off and
steps aside at the contact section.
~1KB inline vanilla JS (IntersectionObserver), try/catch + reduced-motion guard
so content is never left hidden. No animation library.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Replaces the model-teaching cards (and the 'Clear models / not just a
workshop' heading) with Inga's concrete framing: the work happens in three
places — the people who carry the knowledge (coaching), the team that has to
get on board (facilitation), and the process that could work better
(redesign). Stacked editorial rows; new .work-list styles.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Soft conversion path alongside booking: situation -> optional detail -> name/email.
Honeypot-protected, posts JSON to https://n8n.shopwisdom.ca/webhook/oc-lead, with an
email fallback on error. Captures the 'interested but not ready to book' visitor.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- Reframe: card tags Workshop/Flagship -> 'A shared lens' / 'The core shift';
diagram intro now 'not a workshop you sit through - a lens for the room'.
- Separate the two triangles: drama points DOWN (Persecutor/Rescuer/Victim),
empowerment points UP (Creator/Challenger/Coach), with a 'the shift' arrow +
role-mapping legend (Victim->Creator, Persecutor->Challenger, Rescuer->Coach).
- Proper IP attribution: Karpman (1968) for the Drama Triangle; David Emerald
(TED*) for the Empowerment Dynamic; Conscious Leadership Group for above/below.
- New 'above / below the line' teaching graphic with its own section + credit.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The IAS/OnDek before-after testimonials praise tool delivery, which is SW's
domain — and SW already hosts them in text at #results. Remove the OC 'Proof,
from the field' section + its assets; OC's proof should be human-change work.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Two case studies pulled from the reference build: Innovative Aluminum Systems
(dealer pricing tool) and OnDek Vinyl Worx (customer order form), each showing a
before/after screenshot pair plus the client's quote and headshot. Side-by-side
with an arrow on desktop; stacks with the arrow hidden on mobile. Framed to OC's
adoption thesis (systems stick because the people were brought along). Assets in
assets/work/ + assets/people/.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Open Communications homepage rebuilt clean (no Tailwind/React bloat):
adaptive light/dark frosted-glass nav, Playfair/DM Sans/Lora, navy+amber,
bot-protected click-to-call. For sovereign OVH (Gitea -> Coolify) staging.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
mike
Michael Victory