← back to Osborne Redesign
initial scaffold (gitify-all 2026-05-06)
075297f34463baf5337f06e687e01760190b6ef3 · 2026-05-06 10:25:44 -0700 · Steve Abrams
Files touched
A .gitignoreA assets/site.jsA assets/theme.cssA clients.htmlA compare.htmlA contact.htmlA history.htmlA index.htmlA insights.htmlA performance.htmlA philosophy.htmlA reports.htmlA service-area.htmlA team.htmlA themes.htmlA videos.html
Diff
commit 075297f34463baf5337f06e687e01760190b6ef3
Author: Steve Abrams <steve@designerwallcoverings.com>
Date: Wed May 6 10:25:44 2026 -0700
initial scaffold (gitify-all 2026-05-06)
---
.gitignore | 12 +
assets/site.js | 194 ++++++++++++++++
assets/theme.css | 672 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
clients.html | 182 +++++++++++++++
compare.html | 195 ++++++++++++++++
contact.html | 113 +++++++++
history.html | 193 ++++++++++++++++
index.html | 201 ++++++++++++++++
insights.html | 225 ++++++++++++++++++
performance.html | 256 +++++++++++++++++++++
philosophy.html | 177 ++++++++++++++
reports.html | 228 ++++++++++++++++++
service-area.html | 274 ++++++++++++++++++++++
team.html | 199 ++++++++++++++++
themes.html | 191 ++++++++++++++++
videos.html | 495 ++++++++++++++++++++++++++++++++++++++++
16 files changed, 3807 insertions(+)
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..7e6a9c3
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,12 @@
+node_modules/
+.env
+.env.local
+.env.*.local
+.env.*
+tmp/
+*.log
+.DS_Store
+dist/
+build/
+.next/
+*.bak
diff --git a/assets/site.js b/assets/site.js
new file mode 100644
index 0000000..07f617c
--- /dev/null
+++ b/assets/site.js
@@ -0,0 +1,194 @@
+// Osborne Partners Redesign — site shell + theme picker
+(function () {
+ const THEMES = [
+ { id: 'heritage', name: 'Heritage Navy', desc: 'Old-money trust' },
+ { id: 'whisper', name: 'Whisper', desc: 'Swiss minimalism' },
+ { id: 'broadsheet', name: 'Broadsheet', desc: 'Editorial · WSJ-grade' },
+ { id: 'onyx', name: 'Onyx', desc: 'Black-tie luxury' },
+ { id: 'pacific', name: 'Pacific', desc: 'Warm West Coast' },
+ { id: 'atelier', name: 'Atelier', desc: 'Tech · data-forward' },
+ { id: 'loro', name: 'Loro', desc: 'Quiet luxury' },
+ { id: 'monolith', name: 'Monolith', desc: 'Architectural · brutalist' },
+ { id: 'archive', name: 'Archive', desc: 'Vintage aristocracy' },
+ { id: 'aurora', name: 'Aurora', desc: 'Refined glass · gradient' }
+ ];
+
+ const NAV = [
+ { href: 'index.html', label: 'Overview' },
+ { href: 'history.html', label: 'History' },
+ { href: 'team.html', label: 'Team' },
+ { href: 'philosophy.html', label: 'Philosophy' },
+ { href: 'performance.html', label: 'Performance' },
+ { href: 'service-area.html', label: 'Service Area' },
+ { href: 'clients.html', label: 'Clients' },
+ { href: 'insights.html', label: 'Insights' },
+ { href: 'videos.html', label: 'Videos' },
+ { href: 'reports.html', label: 'Reports' },
+ { href: 'contact.html', label: 'Contact' }
+ ];
+
+ // ----- Theme application -----
+ function applyTheme(id, opts) {
+ document.documentElement.dataset.theme = id;
+ // Only persist when the user clicks a swatch (opts.persist === true),
+ // never for theme arrivals from a URL parameter.
+ if (opts && opts.persist) {
+ try { localStorage.setItem('opcm-theme', id); } catch (e) {}
+ }
+ document.querySelectorAll('.theme-swatch').forEach(s => {
+ s.classList.toggle('is-active', s.dataset.swatch === id);
+ });
+ const t = THEMES.find(x => x.id === id) || THEMES[0];
+ const labelEl = document.querySelector('.theme-picker__label .name');
+ const numEl = document.querySelector('.theme-picker__label .num');
+ if (labelEl) labelEl.textContent = t.name;
+ if (numEl) numEl.textContent = String(THEMES.findIndex(x => x.id === id) + 1).padStart(2, '0') + ' / 10';
+ }
+
+ function getInitialTheme() {
+ // URL parameter ALWAYS wins (so iframes / shared links render the right theme,
+ // and only persist when the user picks via the on-page swatches).
+ const url = new URLSearchParams(location.search).get('theme');
+ if (url && THEMES.some(t => t.id === url)) return url;
+ try {
+ const saved = localStorage.getItem('opcm-theme');
+ if (saved && THEMES.some(t => t.id === saved)) return saved;
+ } catch (e) {}
+ return 'heritage';
+ }
+
+ // When a URL theme is present, do NOT pollute localStorage with it
+ // (so the compare grid doesn't overwrite the user's chosen sticky theme).
+ const urlTheme = new URLSearchParams(location.search).get('theme');
+
+ // ----- Header injection -----
+ function buildHeader(currentPage) {
+ const navHTML = NAV.map(item => {
+ const active = item.href === currentPage ? ' is-active' : '';
+ return `<a href="${item.href}" class="${active.trim()}">${item.label}</a>`;
+ }).join('');
+
+ return `
+ <header class="site-header">
+ <div class="site-header__inner">
+ <a href="index.html" class="brand">
+ <span>Osborne Partners</span>
+ <small>Capital Management · Est. 1937</small>
+ </a>
+ <nav class="site-nav">${navHTML}</nav>
+ <a class="site-cta" href="contact.html">Client Portal →</a>
+ </div>
+ </header>`;
+ }
+
+ // ----- Footer injection -----
+ function buildFooter() {
+ return `
+ <footer class="site-footer">
+ <div class="container">
+ <div class="site-footer__grid">
+ <div class="site-footer__col">
+ <div class="brand" style="margin-bottom:16px">
+ <span>Osborne Partners</span>
+ <small>Your wealth. Solved.</small>
+ </div>
+ <p style="font-size:14px;color:var(--ink-soft);line-height:1.6;max-width:380px">
+ A San Francisco wealth manager since 1937. We provide sophisticated investment management,
+ active financial planning, and family office services to over $2 billion in client assets.
+ </p>
+ </div>
+ <div class="site-footer__col">
+ <h4>Practice</h4>
+ <ul>
+ <li><a href="philosophy.html">Investment Philosophy</a></li>
+ <li><a href="performance.html">Performance</a></li>
+ <li><a href="service-area.html">Service Area</a></li>
+ <li><a href="clients.html">Client Stories</a></li>
+ </ul>
+ </div>
+ <div class="site-footer__col">
+ <h4>Firm</h4>
+ <ul>
+ <li><a href="history.html">History</a></li>
+ <li><a href="team.html">Team</a></li>
+ <li><a href="insights.html">Insights</a></li>
+ <li><a href="reports.html">Reports</a></li>
+ </ul>
+ </div>
+ <div class="site-footer__col">
+ <h4>Visit</h4>
+ <ul>
+ <li>One Embarcadero Center</li>
+ <li>Suite 4100, San Francisco</li>
+ <li style="padding-top:12px">545 Middlefield Road</li>
+ <li>Suite 165, Menlo Park</li>
+ </ul>
+ </div>
+ </div>
+ <div class="site-footer__bar">
+ <span>© ${new Date().getFullYear()} Osborne Partners Capital Management, LLC</span>
+ <span>800.362.7734 · info@osbornepartners.com</span>
+ </div>
+ </div>
+ </footer>`;
+ }
+
+ // ----- Theme picker injection -----
+ function buildPicker() {
+ const swatches = THEMES.map((t, i) => `
+ <button class="theme-swatch" data-swatch="${t.id}" title="${t.name}">
+ <span class="theme-swatch__num">${String(i + 1).padStart(2, '0')}</span>
+ </button>`).join('');
+ return `
+ <div class="theme-picker" id="themePicker">
+ <div class="theme-picker__title">
+ <span>Theme</span>
+ <small>10 directions</small>
+ </div>
+ <div class="theme-picker__grid">${swatches}</div>
+ <div class="theme-picker__label">
+ <span class="name">Heritage Navy</span>
+ <span class="num">01 / 10</span>
+ </div>
+ </div>`;
+ }
+
+ // ----- Init -----
+ function init() {
+ const path = location.pathname.split('/').pop() || 'index.html';
+
+ // Header
+ const headerSlot = document.getElementById('site-header-slot');
+ if (headerSlot) headerSlot.outerHTML = buildHeader(path);
+
+ // Footer
+ const footerSlot = document.getElementById('site-footer-slot');
+ if (footerSlot) footerSlot.outerHTML = buildFooter();
+
+ // Theme picker
+ const pickerSlot = document.getElementById('theme-picker-slot');
+ if (pickerSlot) pickerSlot.outerHTML = buildPicker();
+
+ // Wire up swatches — clicking a swatch persists, so the choice sticks across navigation
+ document.querySelectorAll('.theme-swatch').forEach(s => {
+ s.addEventListener('click', () => applyTheme(s.dataset.swatch, { persist: true }));
+ });
+
+ applyTheme(getInitialTheme());
+
+ // Reveal-on-scroll for cards/timeline (subtle)
+ if ('IntersectionObserver' in window) {
+ const io = new IntersectionObserver((entries) => {
+ entries.forEach(e => { if (e.isIntersecting) e.target.classList.add('in-view'); });
+ }, { threshold: 0.12 });
+ document.querySelectorAll('.card,.timeline__item,.team-card,.case,.report-row,.news-card,.chart')
+ .forEach(el => io.observe(el));
+ }
+ }
+
+ if (document.readyState === 'loading') {
+ document.addEventListener('DOMContentLoaded', init);
+ } else {
+ init();
+ }
+})();
diff --git a/assets/theme.css b/assets/theme.css
new file mode 100644
index 0000000..5f502af
--- /dev/null
+++ b/assets/theme.css
@@ -0,0 +1,672 @@
+/* ==========================================================================
+ Osborne Partners — Redesign · 10 Themes
+ Theme is set via [data-theme] on <html>. CSS variables drive 95% of look.
+ ========================================================================== */
+
+:root {
+ /* defaults — overridden per theme */
+ --bg: #fafaf7;
+ --bg-alt: #ffffff;
+ --bg-card: #ffffff;
+ --ink: #0a0a0a;
+ --ink-soft: #3a3a3a;
+ --ink-mute: #888888;
+ --line: rgba(10,10,10,0.10);
+ --line-strong: rgba(10,10,10,0.30);
+ --accent: #5a3a8a;
+ --accent-soft: #8a6abf;
+ --accent-ink: #ffffff;
+ --hairline: rgba(10,10,10,0.06);
+ --hero-grad: none;
+ --shadow: 0 6px 24px rgba(10,10,10,0.06);
+ --shadow-lg: 0 24px 64px rgba(10,10,10,0.08);
+
+ --font-sans: 'Inter', system-ui, -apple-system, Segoe UI, sans-serif;
+ --font-serif: 'Playfair Display', Georgia, serif;
+ --font-display: 'Playfair Display', Georgia, serif;
+ --font-body-serif: 'Libre Caslon Text', Georgia, serif;
+ --font-mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
+ --hero-weight: 400;
+ --hero-tracking: -0.01em;
+ --header-style: standard; /* standard | bordered | broadsheet */
+ --radius: 14px;
+ --radius-sm: 8px;
+
+ --container: 1240px;
+ --space-xl: clamp(60px, 8vw, 120px);
+ --space-lg: clamp(40px, 6vw, 80px);
+ --space-md: clamp(24px, 3vw, 40px);
+}
+
+/* ============================ THEME 01 — Heritage Navy ============================ */
+[data-theme="heritage"] {
+ --bg:#0b1a35; --bg-alt:#0a1428; --bg-card:#1a2b48; --bg-paper:#0a1428;
+ --ink:#ffffff; --ink-soft:#cbd2dc; --ink-mute:#8597b3;
+ --line:rgba(191,161,90,0.20); --line-strong:rgba(191,161,90,0.45);
+ --accent:#bfa15a; --accent-soft:#d9c592; --accent-ink:#0b1a35;
+ --hero-grad:linear-gradient(180deg,#0b1a35 0%,#0a1428 100%);
+ --font-display:'Playfair Display',serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Libre Caslon Text',serif;
+ --hero-weight:400;
+}
+
+/* ============================ THEME 02 — Whisper (Minimal) ============================ */
+[data-theme="whisper"] {
+ --bg:#fafaf7; --bg-alt:#ffffff; --bg-card:#ffffff; --bg-paper:#f4f4f0;
+ --ink:#0a0a0a; --ink-soft:#3a3a3a; --ink-mute:#888888;
+ --line:rgba(10,10,10,0.08); --line-strong:rgba(10,10,10,0.20);
+ --accent:#0a0a0a; --accent-soft:#3a3a3a; --accent-ink:#fafaf7;
+ --font-display:'Inter',sans-serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Inter',sans-serif;
+ --hero-weight:200;
+ --hero-tracking:-0.025em;
+}
+
+/* ============================ THEME 03 — Broadsheet (Editorial) ============================ */
+[data-theme="broadsheet"] {
+ --bg:#f4ede0; --bg-alt:#ede4d2; --bg-card:#fbf6e8; --bg-paper:#e8dec6;
+ --ink:#1a1a1a; --ink-soft:#3a2a1a; --ink-mute:#8a7a5a;
+ --line:rgba(26,26,26,0.30); --line-strong:rgba(26,26,26,0.85);
+ --accent:#8a3a1a; --accent-soft:#b54a2a; --accent-ink:#f4ede0;
+ --font-display:'Playfair Display',serif;
+ --font-sans:'Libre Caslon Text',serif;
+ --font-body-serif:'Libre Caslon Text',serif;
+ --font-mono:'IBM Plex Mono',monospace;
+ --hero-weight:900;
+ --header-style:broadsheet;
+}
+
+/* ============================ THEME 04 — Onyx (Dark Luxury) ============================ */
+[data-theme="onyx"] {
+ --bg:#0a0908; --bg-alt:#141210; --bg-card:#1a1612; --bg-paper:#0a0908;
+ --ink:#f5e8c8; --ink-soft:#cfc4ac; --ink-mute:#a89a7c;
+ --line:rgba(212,175,106,0.25); --line-strong:rgba(212,175,106,0.6);
+ --accent:#d4af6a; --accent-soft:#e8d4a8; --accent-ink:#0a0908;
+ --hero-grad:radial-gradient(circle at 20% 0%,rgba(212,175,106,0.08) 0%,transparent 50%),radial-gradient(circle at 90% 80%,rgba(122,74,42,0.15) 0%,transparent 60%);
+ --font-display:'Playfair Display',serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Cormorant Garamond',serif;
+ --hero-weight:900;
+ --hero-tracking:-0.015em;
+}
+
+/* ============================ THEME 05 — Pacific (Warm West Coast) ============================ */
+[data-theme="pacific"] {
+ --bg:#f3eddf; --bg-alt:#e8dec6; --bg-card:#fbf6e8; --bg-paper:#fbf6e8;
+ --ink:#2a3a2c; --ink-soft:#3a4a3c; --ink-mute:#7a6a4a;
+ --line:rgba(42,58,44,0.15); --line-strong:rgba(42,58,44,0.40);
+ --accent:#a87a3a; --accent-soft:#c89a5a; --accent-ink:#f3eddf;
+ --font-display:'Cormorant Garamond',serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Cormorant Garamond',serif;
+ --hero-weight:300;
+}
+
+/* ============================ THEME 06 — Atelier (Tech / Data) ============================ */
+[data-theme="atelier"] {
+ --bg:#0a0e14; --bg-alt:#0e141d; --bg-card:#0e141d; --bg-paper:#0a0e14;
+ --ink:#e8eef5; --ink-soft:#9aabc4; --ink-mute:#5a6a82;
+ --line:rgba(58,169,255,0.20); --line-strong:rgba(58,169,255,0.5);
+ --accent:#3aa9ff; --accent-soft:#7ac7ff; --accent-ink:#0a0e14;
+ --hero-grad:linear-gradient(180deg,#0a0e14 0%,#0e141d 100%);
+ --font-display:'Space Grotesk',sans-serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Inter',sans-serif;
+ --font-mono:'JetBrains Mono',monospace;
+ --hero-weight:700;
+ --hero-tracking:-0.03em;
+ --radius:6px; --radius-sm:4px;
+}
+
+/* ============================ THEME 07 — Loro (Quiet Luxury) ============================ */
+[data-theme="loro"] {
+ --bg:#e8e1d4; --bg-alt:#ddd5c4; --bg-card:#f1ebde; --bg-paper:#e8e1d4;
+ --ink:#3a3328; --ink-soft:#5a4a3a; --ink-mute:#7a6a4a;
+ --line:rgba(58,51,40,0.15); --line-strong:rgba(58,51,40,0.30);
+ --accent:#7a6a4a; --accent-soft:#a89a7c; --accent-ink:#e8e1d4;
+ --font-display:'Cormorant Garamond',serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Cormorant Garamond',serif;
+ --hero-weight:300;
+ --hero-tracking:-0.005em;
+}
+
+/* ============================ THEME 08 — Monolith (Architectural) ============================ */
+[data-theme="monolith"] {
+ --bg:#e6e3dc; --bg-alt:#dbd6cb; --bg-card:#f0ede5; --bg-paper:#1a1a1a;
+ --ink:#1a1a1a; --ink-soft:#3a3a3a; --ink-mute:#8a8478;
+ --line:rgba(26,26,26,0.10); --line-strong:rgba(26,26,26,0.85);
+ --accent:#1a1a1a; --accent-soft:#3a3a3a; --accent-ink:#e6e3dc;
+ --font-display:'Inter',sans-serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Inter',sans-serif;
+ --hero-weight:800;
+ --hero-tracking:-0.04em;
+ --radius:0; --radius-sm:0;
+}
+
+/* ============================ THEME 09 — Archive (Vintage Aristocracy) ============================ */
+[data-theme="archive"] {
+ --bg:#f4ecd8; --bg-alt:#ebe0c2; --bg-card:#f8f1de; --bg-paper:#e8d8b2;
+ --ink:#3a1a14; --ink-soft:#5a1a22; --ink-mute:#8a3a3a;
+ --line:rgba(90,26,34,0.30); --line-strong:rgba(90,26,34,1);
+ --accent:#5a1a22; --accent-soft:#8a3a3a; --accent-ink:#f4ecd8;
+ --font-display:'Playfair Display',serif;
+ --font-sans:'Libre Caslon Text',serif;
+ --font-body-serif:'Libre Caslon Text',serif;
+ --hero-weight:700;
+}
+
+/* ============================ THEME 10 — Aurora (Refined Glass) ============================ */
+[data-theme="aurora"] {
+ --bg:#f6f4ef; --bg-alt:#efeaf6; --bg-card:rgba(255,255,255,0.65); --bg-paper:#efeaf6;
+ --ink:#1a1530; --ink-soft:#3a3050; --ink-mute:#5a4a78;
+ --line:rgba(26,21,48,0.10); --line-strong:rgba(26,21,48,0.25);
+ --accent:#5a3a8a; --accent-soft:#8a6abf; --accent-ink:#f6f4ef;
+ --hero-grad:linear-gradient(180deg,#f6f4ef 0%,#e8e2f0 100%);
+ --font-display:'Playfair Display',serif;
+ --font-sans:'Inter',sans-serif;
+ --font-body-serif:'Inter',sans-serif;
+ --hero-weight:300;
+ --radius:24px; --radius-sm:14px;
+}
+
+/* ============================== BASE ============================== */
+* { box-sizing: border-box; margin: 0; padding: 0; }
+
+html { scroll-behavior: smooth; }
+
+body {
+ background: var(--bg);
+ color: var(--ink);
+ font-family: var(--font-sans);
+ font-size: 16px;
+ line-height: 1.55;
+ -webkit-font-smoothing: antialiased;
+ text-rendering: optimizeLegibility;
+ transition: background 0.4s ease, color 0.4s ease;
+ min-height: 100vh;
+}
+
+a { color: inherit; text-decoration: none; transition: opacity 0.2s; }
+a:hover { opacity: 0.7; }
+
+img { max-width: 100%; display: block; }
+
+.container {
+ max-width: var(--container);
+ margin: 0 auto;
+ padding: 0 32px;
+}
+
+/* ============================== HEADER ============================== */
+.site-header {
+ position: sticky; top: 0; z-index: 90;
+ background: var(--bg);
+ border-bottom: 1px solid var(--line);
+ backdrop-filter: saturate(180%) blur(8px);
+}
+[data-theme="aurora"] .site-header {
+ background: rgba(246,244,239,0.7);
+}
+[data-theme="onyx"] .site-header,
+[data-theme="atelier"] .site-header,
+[data-theme="heritage"] .site-header {
+ background: rgba(0,0,0,0.4);
+}
+
+.site-header__inner {
+ max-width: var(--container);
+ margin: 0 auto;
+ padding: 18px 32px;
+ display: flex;
+ align-items: center;
+ gap: 32px;
+}
+
+.brand {
+ display: flex; flex-direction: column; gap: 2px;
+ font-family: var(--font-display);
+ font-weight: 700;
+ font-size: 22px;
+ line-height: 1;
+ letter-spacing: 0.5px;
+}
+.brand small {
+ font-family: var(--font-sans);
+ font-size: 10px;
+ font-weight: 500;
+ letter-spacing: 3px;
+ color: var(--accent);
+ text-transform: uppercase;
+}
+
+.site-nav {
+ display: flex; gap: 28px; flex: 1; justify-content: center;
+ font-size: 13.5px; letter-spacing: 0.2px;
+}
+.site-nav a { color: var(--ink-soft); }
+.site-nav a.is-active, .site-nav a:hover { color: var(--ink); opacity: 1; }
+
+.site-cta {
+ padding: 10px 18px;
+ background: var(--accent); color: var(--accent-ink);
+ font-size: 12px; font-weight: 600; letter-spacing: 0.4px;
+ border-radius: var(--radius-sm);
+ border: none; cursor: pointer;
+}
+
+/* ============================== THEME PICKER ============================== */
+.theme-picker {
+ position: fixed;
+ right: 24px; bottom: 24px;
+ z-index: 200;
+ background: var(--bg-card);
+ color: var(--ink);
+ border: 1px solid var(--line-strong);
+ border-radius: var(--radius);
+ padding: 12px;
+ box-shadow: var(--shadow-lg);
+ font-family: var(--font-sans);
+ width: 280px;
+ backdrop-filter: blur(10px);
+}
+[data-theme="aurora"] .theme-picker { background: rgba(255,255,255,0.85); }
+
+.theme-picker__title {
+ font-size: 10px; font-weight: 700; letter-spacing: 2px;
+ text-transform: uppercase; color: var(--ink-mute);
+ margin-bottom: 10px;
+ display: flex; justify-content: space-between; align-items: center;
+}
+.theme-picker__title small { font-weight: 500; letter-spacing: 0.5px; text-transform: none; }
+
+.theme-picker__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
+.theme-swatch {
+ aspect-ratio: 1;
+ border-radius: 8px;
+ border: 1.5px solid transparent;
+ cursor: pointer;
+ position: relative;
+ overflow: hidden;
+ outline: none;
+}
+.theme-swatch:hover { transform: scale(1.05); }
+.theme-swatch.is-active { border-color: var(--ink); box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px var(--ink); }
+.theme-swatch__num { position: absolute; bottom: 2px; right: 4px; font-size: 9px; font-weight: 700; opacity: 0.7; }
+
+.theme-swatch[data-swatch="heritage"] { background: linear-gradient(135deg,#0b1a35 50%,#bfa15a 50%); color: #fff; }
+.theme-swatch[data-swatch="whisper"] { background: linear-gradient(135deg,#fafaf7 50%,#0a0a0a 50%); color: #0a0a0a; }
+.theme-swatch[data-swatch="broadsheet"] { background: linear-gradient(135deg,#f4ede0 50%,#8a3a1a 50%); color: #1a1a1a; }
+.theme-swatch[data-swatch="onyx"] { background: linear-gradient(135deg,#0a0908 50%,#d4af6a 50%); color: #f5e8c8; }
+.theme-swatch[data-swatch="pacific"] { background: linear-gradient(135deg,#f3eddf 50%,#2a3a2c 50%); color: #2a3a2c; }
+.theme-swatch[data-swatch="atelier"] { background: linear-gradient(135deg,#0a0e14 50%,#3aa9ff 50%); color: #e8eef5; }
+.theme-swatch[data-swatch="loro"] { background: linear-gradient(135deg,#e8e1d4 50%,#7a6a4a 50%); color: #3a3328; }
+.theme-swatch[data-swatch="monolith"] { background: linear-gradient(135deg,#e6e3dc 50%,#1a1a1a 50%); color: #1a1a1a; }
+.theme-swatch[data-swatch="archive"] { background: linear-gradient(135deg,#f4ecd8 50%,#5a1a22 50%); color: #3a1a14; }
+.theme-swatch[data-swatch="aurora"] { background: linear-gradient(135deg,#f6f4ef 0%,#c8b8e0 50%,#5a3a8a 100%); color: #1a1530; }
+
+.theme-picker__label {
+ margin-top: 10px;
+ padding-top: 10px;
+ border-top: 1px solid var(--line);
+ font-size: 12px; font-family: var(--font-display);
+ display: flex; justify-content: space-between;
+}
+.theme-picker__label .num { font-family: var(--font-mono); color: var(--ink-mute); font-size: 11px; }
+
+.theme-picker.collapsed { width: 64px; padding: 16px; }
+.theme-picker.collapsed > *:not(.theme-picker__toggle) { display: none; }
+.theme-picker__toggle {
+ background: none; border: none; cursor: pointer; color: var(--ink);
+ width: 32px; height: 32px; display: grid; place-items: center;
+ position: absolute; top: 8px; right: 8px;
+}
+
+/* ============================== HERO ============================== */
+.hero { padding: var(--space-xl) 0; background: var(--hero-grad,var(--bg)); position: relative; }
+.hero__eyebrow {
+ font-family: var(--font-mono); font-size: 11px; letter-spacing: 3px;
+ text-transform: uppercase; color: var(--accent); margin-bottom: 24px;
+}
+.hero__title {
+ font-family: var(--font-display);
+ font-weight: var(--hero-weight);
+ font-size: clamp(48px, 8vw, 120px);
+ line-height: 1.0;
+ letter-spacing: var(--hero-tracking);
+ margin-bottom: 32px;
+ max-width: 1100px;
+}
+.hero__title em { font-style: italic; color: var(--accent); font-family: var(--font-display); }
+.hero__sub {
+ font-family: var(--font-body-serif);
+ font-size: clamp(17px, 1.4vw, 21px);
+ line-height: 1.55;
+ color: var(--ink-soft);
+ max-width: 740px;
+ margin-bottom: 40px;
+}
+
+/* Theme-specific hero treatments */
+[data-theme="broadsheet"] .hero__title { font-weight: 900; line-height: 1.05; }
+[data-theme="monolith"] .hero__title { font-weight: 800; text-transform: uppercase; }
+[data-theme="atelier"] .hero__title { font-family: var(--font-mono); font-size: clamp(40px,6vw,84px); font-weight: 700; }
+[data-theme="archive"] .hero__title { text-align: center; }
+[data-theme="archive"] .hero__sub { text-align: center; margin-left: auto; margin-right: auto; }
+
+/* ============================== BUTTONS ============================== */
+.btn {
+ display: inline-flex; align-items: center; gap: 8px;
+ padding: 16px 28px;
+ background: var(--accent); color: var(--accent-ink);
+ font-family: var(--font-sans); font-size: 13px; font-weight: 600;
+ letter-spacing: 0.5px; border-radius: var(--radius-sm);
+ border: none; cursor: pointer;
+ transition: transform 0.2s, opacity 0.2s;
+}
+.btn:hover { transform: translateY(-1px); opacity: 0.92; }
+.btn--ghost { background: transparent; color: var(--ink); border: 1px solid var(--line-strong); }
+.btn-row { display: flex; gap: 12px; flex-wrap: wrap; }
+
+/* ============================== STATS BAND ============================== */
+.stats {
+ border-top: 1px solid var(--line);
+ border-bottom: 1px solid var(--line);
+ padding: 56px 0;
+}
+.stats__grid {
+ display: grid; grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
+ gap: 32px;
+}
+.stat__num {
+ font-family: var(--font-display); font-size: clamp(40px, 5vw, 64px);
+ line-height: 1.0; color: var(--ink); font-weight: 400;
+}
+[data-theme="atelier"] .stat__num,
+[data-theme="monolith"] .stat__num { font-family: var(--font-display); font-weight: 700; }
+.stat__label {
+ margin-top: 12px;
+ font-size: 11px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase;
+ color: var(--accent);
+}
+
+/* ============================== SECTIONS ============================== */
+.section { padding: var(--space-xl) 0; }
+.section--alt { background: var(--bg-alt); }
+
+.section__eyebrow {
+ font-family: var(--font-mono); font-size: 11px; letter-spacing: 3px;
+ text-transform: uppercase; color: var(--accent); margin-bottom: 16px;
+}
+.section__title {
+ font-family: var(--font-display);
+ font-size: clamp(36px, 5vw, 64px);
+ line-height: 1.05;
+ font-weight: var(--hero-weight);
+ letter-spacing: -0.01em;
+ margin-bottom: 24px;
+ max-width: 900px;
+}
+[data-theme="broadsheet"] .section__title { font-weight: 700; }
+[data-theme="monolith"] .section__title { font-weight: 800; text-transform: uppercase; letter-spacing: -0.02em; }
+
+.section__lead {
+ font-family: var(--font-body-serif);
+ font-size: 19px; line-height: 1.55; color: var(--ink-soft);
+ max-width: 720px;
+ margin-bottom: 48px;
+}
+
+/* ============================== CARDS / SERVICES ============================== */
+.cards {
+ display: grid;
+ grid-template-columns: repeat(auto-fit,minmax(320px,1fr));
+ gap: 24px;
+}
+.card {
+ background: var(--bg-card);
+ padding: 32px;
+ border-radius: var(--radius);
+ border: 1px solid var(--line);
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
+ position: relative;
+}
+.card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
+[data-theme="aurora"] .card { backdrop-filter: blur(20px); border: 1px solid rgba(255,255,255,0.7); }
+[data-theme="atelier"] .card { border: 1px solid rgba(58,169,255,0.15); }
+[data-theme="monolith"] .card { border: 1px solid var(--line-strong); border-radius: 0; }
+
+.card__num {
+ font-family: var(--font-display); font-weight: 400;
+ font-size: 13px; letter-spacing: 2px; color: var(--accent);
+ margin-bottom: 12px;
+}
+.card__title {
+ font-family: var(--font-display); font-size: 24px; line-height: 1.2; margin-bottom: 12px;
+ font-weight: 600;
+}
+.card__body {
+ font-size: 14.5px; line-height: 1.6; color: var(--ink-soft);
+}
+.card__cta {
+ display: inline-block; margin-top: 16px;
+ font-size: 12px; font-weight: 600; letter-spacing: 1px;
+ color: var(--accent); text-transform: uppercase;
+}
+
+/* ============================== FOOTER ============================== */
+.site-footer {
+ background: var(--bg-paper);
+ color: var(--ink);
+ padding: 64px 0 32px;
+ margin-top: 80px;
+ border-top: 1px solid var(--line);
+}
+[data-theme="onyx"] .site-footer,
+[data-theme="heritage"] .site-footer,
+[data-theme="monolith"] .site-footer,
+[data-theme="atelier"] .site-footer {
+ color: var(--ink); /* paper is dark, ink is already adjusted */
+}
+[data-theme="monolith"] .site-footer { background: #1a1a1a; color: #e6e3dc; }
+[data-theme="archive"] .site-footer { background: #e8d8b2; }
+
+.site-footer__grid {
+ display: grid;
+ grid-template-columns: 2fr 1fr 1fr 1fr;
+ gap: 48px;
+ margin-bottom: 40px;
+}
+.site-footer__col h4 {
+ font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
+ color: var(--accent); margin-bottom: 16px; font-weight: 600;
+}
+.site-footer__col ul { list-style: none; }
+.site-footer__col li { padding: 6px 0; font-size: 13.5px; }
+.site-footer__bar {
+ border-top: 1px solid var(--line);
+ padding-top: 24px;
+ display: flex; justify-content: space-between; align-items: center;
+ font-size: 12px; color: var(--ink-mute);
+}
+
+@media (max-width: 900px) {
+ .site-footer__grid { grid-template-columns: 1fr 1fr; }
+ .site-nav { display: none; }
+}
+
+/* ============================== UTIL ============================== */
+.eyebrow {
+ font-family: var(--font-mono); font-size: 11px; letter-spacing: 3px;
+ text-transform: uppercase; color: var(--accent);
+}
+.divider { height: 1px; background: var(--line); margin: 48px 0; }
+.tag {
+ display: inline-block; padding: 4px 10px; border-radius: 999px;
+ background: rgba(0,0,0,0.06); font-size: 11px; font-weight: 600; letter-spacing: 0.5px;
+ margin-right: 6px; color: var(--ink-soft);
+}
+[data-theme="atelier"] .tag { background: rgba(58,169,255,0.15); color: var(--accent); font-family: var(--font-mono); }
+
+/* ============================== CHARTS ============================== */
+.chart {
+ background: var(--bg-card); border: 1px solid var(--line);
+ border-radius: var(--radius); padding: 32px;
+}
+.chart__title {
+ font-family: var(--font-display); font-size: 24px; margin-bottom: 4px;
+}
+.chart__sub { font-size: 13px; color: var(--ink-mute); margin-bottom: 24px; }
+.chart svg { width: 100%; height: auto; display: block; }
+
+/* ============================== TABLES ============================== */
+.table { width: 100%; border-collapse: collapse; }
+.table th, .table td {
+ text-align: left; padding: 14px 8px; border-bottom: 1px solid var(--line);
+ font-size: 14px;
+}
+.table th {
+ font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--ink-mute);
+ font-weight: 600; border-bottom: 1.5px solid var(--line-strong);
+}
+.table tr:hover td { background: var(--bg-alt); }
+
+/* ============================== TIMELINE ============================== */
+.timeline { position: relative; padding-left: 32px; }
+.timeline::before {
+ content: ''; position: absolute; left: 8px; top: 8px; bottom: 8px;
+ width: 1px; background: var(--line-strong);
+}
+.timeline__item {
+ position: relative; padding-bottom: 48px;
+}
+.timeline__item::before {
+ content: ''; position: absolute; left: -28px; top: 6px;
+ width: 9px; height: 9px; border-radius: 50%;
+ background: var(--accent);
+ box-shadow: 0 0 0 4px var(--bg);
+}
+.timeline__year {
+ font-family: var(--font-display); font-size: 36px; font-weight: 700;
+ color: var(--accent); line-height: 1; margin-bottom: 8px;
+}
+.timeline__title { font-family: var(--font-display); font-size: 22px; margin-bottom: 8px; }
+.timeline__body { font-size: 14.5px; line-height: 1.6; color: var(--ink-soft); max-width: 720px; }
+
+/* ============================== TEAM ============================== */
+.team-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 24px; }
+.team-card { background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; }
+.team-card__avatar {
+ width: 96px; height: 96px; border-radius: 50%;
+ background: linear-gradient(135deg,var(--accent),var(--accent-soft));
+ display: grid; place-items: center;
+ font-family: var(--font-display); font-size: 36px; color: var(--accent-ink); font-weight: 700;
+ margin-bottom: 20px;
+}
+.team-card__name { font-family: var(--font-display); font-size: 22px; margin-bottom: 4px; font-weight: 600; }
+.team-card__role { font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--accent); margin-bottom: 14px; }
+.team-card__bio { font-size: 14px; line-height: 1.6; color: var(--ink-soft); }
+
+/* ============================== MAP / SERVICE AREA ============================== */
+.map-shell {
+ background: var(--bg-card); border: 1px solid var(--line);
+ border-radius: var(--radius); padding: 32px;
+ position: relative;
+}
+.map-shell svg { width: 100%; height: auto; }
+
+.cities {
+ display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr));
+ gap: 8px 24px;
+ font-size: 14px;
+ list-style: none;
+}
+.cities li { padding: 8px 0; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; }
+.cities .miles { color: var(--ink-mute); font-family: var(--font-mono); font-size: 12px; }
+
+/* ============================== REPORTS ============================== */
+.report-list { display: grid; gap: 0; }
+.report-row {
+ display: grid; grid-template-columns: 100px 1fr auto; gap: 24px; align-items: center;
+ padding: 20px 0; border-bottom: 1px solid var(--line);
+ cursor: pointer; transition: background 0.2s;
+}
+.report-row:hover { background: var(--bg-alt); padding-left: 12px; padding-right: 12px; }
+.report-row__date { font-family: var(--font-mono); font-size: 11px; letter-spacing: 1px; color: var(--accent); text-transform: uppercase; }
+.report-row__title { font-family: var(--font-display); font-size: 22px; line-height: 1.25; font-weight: 600; }
+.report-row__desc { font-size: 13.5px; color: var(--ink-soft); margin-top: 4px; line-height: 1.5; }
+.report-row__action { font-size: 12px; letter-spacing: 1px; color: var(--accent); white-space: nowrap; }
+
+@media (max-width: 700px) {
+ .report-row { grid-template-columns: 1fr; gap: 8px; }
+ .report-row__action { display: none; }
+}
+
+/* ============================== HEADER STYLES — broadsheet override ============================== */
+[data-theme="broadsheet"] .site-header__inner {
+ flex-direction: column; gap: 12px; padding: 24px 32px 12px;
+ border-bottom: 2px solid var(--line-strong);
+ text-align: center;
+}
+[data-theme="broadsheet"] .brand { align-items: center; font-size: 36px; letter-spacing: 4px; }
+[data-theme="broadsheet"] .brand small { color: var(--ink-soft); }
+[data-theme="broadsheet"] .site-nav { gap: 24px; font-family: var(--font-body-serif); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 8px 0; width: 100%; }
+
+/* ============================== PRINT-LIKE TYPOGRAPHY ============================== */
+.prose { max-width: 720px; }
+.prose p { font-family: var(--font-body-serif); font-size: 17px; line-height: 1.7; color: var(--ink-soft); margin-bottom: 1em; }
+.prose p:first-of-type::first-letter {
+ font-family: var(--font-display); font-weight: 700; font-size: 5em; float: left;
+ line-height: 0.9; padding-right: 12px; color: var(--accent);
+}
+.prose h2 { font-family: var(--font-display); font-size: 32px; margin: 48px 0 16px; }
+.prose blockquote {
+ font-family: var(--font-display); font-size: 28px; line-height: 1.4;
+ font-style: italic; color: var(--ink); margin: 32px 0; padding-left: 24px;
+ border-left: 3px solid var(--accent);
+}
+
+/* ============================== NEWS GRID ============================== */
+.news-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); gap: 24px; }
+.news-card { background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
+.news-card__image { aspect-ratio: 16/10; background: linear-gradient(135deg,var(--accent),var(--accent-soft)); }
+.news-card__body { padding: 24px; }
+.news-card__date { font-family: var(--font-mono); font-size: 11px; letter-spacing: 1px; color: var(--ink-mute); margin-bottom: 8px; }
+.news-card__title { font-family: var(--font-display); font-size: 22px; line-height: 1.25; font-weight: 600; }
+
+/* ============================== CLIENT CASE STUDIES ============================== */
+.case { background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); padding: 40px; margin-bottom: 32px; }
+.case__meta { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
+.case__title { font-family: var(--font-display); font-size: 32px; line-height: 1.2; margin-bottom: 12px; font-weight: 600; }
+.case__sub { color: var(--ink-soft); font-size: 16px; line-height: 1.6; margin-bottom: 24px; max-width: 720px; }
+.case__metrics { display: grid; grid-template-columns: repeat(auto-fit,minmax(140px,1fr)); gap: 24px; padding: 24px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 24px; }
+.case__metric small { display: block; font-size: 11px; letter-spacing: 1.5px; color: var(--ink-mute); margin-bottom: 6px; text-transform: uppercase; }
+.case__metric strong { font-family: var(--font-display); font-size: 30px; line-height: 1; font-weight: 600; color: var(--accent); }
+.case__quote { font-family: var(--font-display); font-style: italic; font-size: 20px; line-height: 1.5; color: var(--ink); padding-left: 20px; border-left: 3px solid var(--accent); }
+
+/* ============================== FAQ / CONTACT ============================== */
+.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
+.office-card { background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); padding: 32px; }
+.office-card h3 { font-family: var(--font-display); font-size: 24px; margin-bottom: 8px; font-weight: 600; }
+.office-card .addr { color: var(--ink-soft); font-size: 15px; line-height: 1.6; margin-bottom: 16px; }
+.office-card .meta { font-family: var(--font-mono); font-size: 12px; color: var(--ink-mute); }
+
+@media (max-width: 800px) { .contact-grid { grid-template-columns: 1fr; } }
+
+/* small helpers */
+.text-center { text-align: center; }
+.text-mute { color: var(--ink-mute); }
+.text-mono { font-family: var(--font-mono); }
+.mt-md { margin-top: var(--space-md); }
+.mt-lg { margin-top: var(--space-lg); }
+.mb-md { margin-bottom: var(--space-md); }
+.mb-lg { margin-bottom: var(--space-lg); }
+
+/* a small "vintage" flourish for archive theme */
+[data-theme="archive"] .hero::before, [data-theme="archive"] .hero::after {
+ content: '❦'; display: block; text-align: center;
+ font-size: 20px; color: var(--accent); margin: 16px 0;
+}
diff --git a/clients.html b/clients.html
new file mode 100644
index 0000000..1a974e8
--- /dev/null
+++ b/clients.html
@@ -0,0 +1,182 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Clients · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">By introduction · Anonymized case studies</div>
+ <h1 class="hero__title">The families<br><em>we serve</em>.</h1>
+ <p class="hero__sub">
+ Eighty-eight years of stewardship has produced a particular kind of client base: founders,
+ executives, inheritors, retirees, and the institutions they care about. Names withheld;
+ circumstances real. A representative cross-section of the work, below.
+ </p>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+
+ <article class="case">
+ <div class="case__meta">
+ <span class="tag">Tech founder</span>
+ <span class="tag">Concentrated equity</span>
+ <span class="tag">Bay Area</span>
+ </div>
+ <h2 class="case__title">A second-time founder, mid-IPO lockup.</h2>
+ <p class="case__sub">
+ Engaged us nine months before company IPO. 87% of household net worth concentrated in
+ founder shares. Plan: 10b5-1 program, charitable lead annuity trust, exchange fund
+ consideration, and a coordinated personal liquidity ladder for the family's home purchase
+ and tuition obligations.
+ </p>
+ <div class="case__metrics">
+ <div class="case__metric"><small>Initial concentration</small><strong>87%</strong></div>
+ <div class="case__metric"><small>Year-3 concentration</small><strong>22%</strong></div>
+ <div class="case__metric"><small>Tax saved · CLAT</small><strong>$1.4M</strong></div>
+ <div class="case__metric"><small>Years to fully diversified</small><strong>5</strong></div>
+ </div>
+ <p class="case__quote">"They walked me out of single-stock risk without spooking the stock and without picking a fight with the IRS."</p>
+ </article>
+
+ <article class="case">
+ <div class="case__meta">
+ <span class="tag">Retired executive</span>
+ <span class="tag">Generational transfer</span>
+ <span class="tag">Peninsula</span>
+ </div>
+ <h2 class="case__title">A two-generation patrimony.</h2>
+ <p class="case__sub">
+ A retired Fortune-100 executive and his wife engaged us in 2014 to plan a deliberate,
+ tax-efficient transfer of patrimony to their two children and four grandchildren. Plan:
+ GRATs at the equity peak, intentionally defective grantor trusts (IDGTs) for operating
+ assets, annual exclusion gifting, and a family LLC governance structure.
+ </p>
+ <div class="case__metrics">
+ <div class="case__metric"><small>Original estate</small><strong>$24M</strong></div>
+ <div class="case__metric"><small>Transferred / 12 yrs</small><strong>$11M</strong></div>
+ <div class="case__metric"><small>Estate tax avoided</small><strong>~$4.4M</strong></div>
+ <div class="case__metric"><small>Governance docs</small><strong>Family LLC</strong></div>
+ </div>
+ <p class="case__quote">"Our children understand their inheritance. Our grandchildren understand the work. Tom drafted the family meeting agenda."</p>
+ </article>
+
+ <article class="case">
+ <div class="case__meta">
+ <span class="tag">Inherited IRA</span>
+ <span class="tag">Multi-decade strategy</span>
+ <span class="tag">CA / NY</span>
+ </div>
+ <h2 class="case__title">An inherited IRA, ten-year window.</h2>
+ <p class="case__sub">
+ A client inherited an IRA from his mother in 2022. Under the SECURE Act, full distribution
+ required within ten years. Plan: layer withdrawals to fill bracket capacity each year,
+ coordinate with Roth conversions in low-income years, and keep effective tax rate below
+ the marginal rate of a lump-sum distribution.
+ </p>
+ <div class="case__metrics">
+ <div class="case__metric"><small>Initial IRA</small><strong>$420K</strong></div>
+ <div class="case__metric"><small>10-yr deadline</small><strong>2032</strong></div>
+ <div class="case__metric"><small>Effective tax rate</small><strong>~21%</strong></div>
+ <div class="case__metric"><small>vs. lump sum</small><strong>~37%</strong></div>
+ </div>
+ <p class="case__quote">"Roohi runs the RMDs to the dollar. Tom runs the tax math. I get a check, on time, every year."</p>
+ </article>
+
+ <article class="case">
+ <div class="case__meta">
+ <span class="tag">Foundation</span>
+ <span class="tag">Institutional</span>
+ <span class="tag">$50M endowment</span>
+ </div>
+ <h2 class="case__title">A family foundation, third generation.</h2>
+ <p class="case__sub">
+ A 30-year-old family foundation engaged the firm in 2018 to formalize its investment
+ policy, benchmark its returns, and prepare for a generational transition of trustees.
+ Plan: a written IPS aligned with the 5% spending rate, a global multi-asset allocation,
+ and a quarterly trustee report.
+ </p>
+ <div class="case__metrics">
+ <div class="case__metric"><small>Endowment AUM</small><strong>$50M</strong></div>
+ <div class="case__metric"><small>Annualized · 7 yr</small><strong>+9.8%</strong></div>
+ <div class="case__metric"><small>Spending rate</small><strong>5.0%</strong></div>
+ <div class="case__metric"><small>Trustee transitions</small><strong>3</strong></div>
+ </div>
+ <p class="case__quote">"Justin and the team treat us like a fiduciary should — better, candidly, than the trustees treat each other."</p>
+ </article>
+
+ <article class="case">
+ <div class="case__meta">
+ <span class="tag">Surviving spouse</span>
+ <span class="tag">Estate settlement</span>
+ <span class="tag">Marin</span>
+ </div>
+ <h2 class="case__title">A widow's first three years.</h2>
+ <p class="case__sub">
+ A long-time client lost her husband unexpectedly in 2022. Tom and Roohi coordinated
+ settlement of a complex estate, retitled accounts, established a separate cash account
+ for monthly draw, and walked her through the first three years of solo decision-making
+ — including the sale of one home and the purchase of another.
+ </p>
+ <div class="case__metrics">
+ <div class="case__metric"><small>Settlement timeline</small><strong>11 months</strong></div>
+ <div class="case__metric"><small>Accounts retitled</small><strong>14</strong></div>
+ <div class="case__metric"><small>Home sale (net)</small><strong>$3.1M</strong></div>
+ <div class="case__metric"><small>Decision-support calls</small><strong>~weekly</strong></div>
+ </div>
+ <p class="case__quote">"They held my hand through the worst year of my life and the two that followed. I cannot rate them highly enough."</p>
+ </article>
+
+ <article class="case">
+ <div class="case__meta">
+ <span class="tag">Small-business owner</span>
+ <span class="tag">Sale planning</span>
+ <span class="tag">East Bay</span>
+ </div>
+ <h2 class="case__title">From sole proprietor to liquid retiree.</h2>
+ <p class="case__sub">
+ A 60-year-old business owner came to the firm five years before his planned sale. Plan:
+ installment-sale structuring, a pre-sale charitable remainder trust to defer capital
+ gains, a personal goodwill allocation, and a post-sale wealth plan supporting an indexed
+ $400k/year withdrawal.
+ </p>
+ <div class="case__metrics">
+ <div class="case__metric"><small>Sale price</small><strong>$12.4M</strong></div>
+ <div class="case__metric"><small>Cap gains deferred</small><strong>$2.1M</strong></div>
+ <div class="case__metric"><small>Annual draw funded</small><strong>$400K</strong></div>
+ <div class="case__metric"><small>Years modeled</small><strong>30+</strong></div>
+ </div>
+ <p class="case__quote">"My CPA said I needed a wealth manager. Tom said I needed three years of planning. Tom was right."</p>
+ </article>
+
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container" style="text-align:center;max-width:780px">
+ <div class="section__eyebrow">Privacy is a feature</div>
+ <h2 class="section__title" style="margin-left:auto;margin-right:auto">Names changed. Numbers real.</h2>
+ <p class="section__lead" style="margin-left:auto;margin-right:auto">
+ We do not advertise our clients. The cases above are anonymized representations of the
+ kinds of households the firm serves. If you would like to speak with a current client as
+ a reference, we are happy to arrange an introduction after a first conversation.
+ </p>
+ <a href="contact.html" class="btn">Begin a conversation →</a>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/compare.html b/compare.html
new file mode 100644
index 0000000..db95476
--- /dev/null
+++ b/compare.html
@@ -0,0 +1,195 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Compare · Osborne Partners — 10 Themes Side by Side</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800&family=Playfair+Display:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
+<style>
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+ body {
+ background: #0a0a0a; color: #e8e8e8;
+ font-family: 'Inter', system-ui, sans-serif;
+ min-height: 100vh;
+ }
+
+ .topbar {
+ position: sticky; top: 0; z-index: 50;
+ background: rgba(10,10,10,0.92); backdrop-filter: blur(20px);
+ border-bottom: 1px solid rgba(255,255,255,0.08);
+ padding: 16px 24px;
+ display: flex; gap: 24px; align-items: center; flex-wrap: wrap;
+ }
+ .brand {
+ display: flex; flex-direction: column;
+ font-family: 'Playfair Display', serif; font-weight: 700; font-size: 20px;
+ }
+ .brand small { font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 3px; color: #bfa15a; }
+
+ .topbar nav { display: flex; gap: 4px; flex-wrap: wrap; flex: 1; justify-content: center; }
+ .topbar nav button {
+ padding: 8px 14px; background: transparent; color: #aaa;
+ border: 1px solid rgba(255,255,255,0.12); border-radius: 999px;
+ font-family: inherit; font-size: 12px; cursor: pointer;
+ transition: all 0.2s;
+ }
+ .topbar nav button:hover { color: #fff; border-color: rgba(255,255,255,0.4); }
+ .topbar nav button.is-active { background: #fff; color: #000; border-color: #fff; }
+
+ .topbar .scale {
+ display: flex; gap: 8px; align-items: center;
+ font-family: 'JetBrains Mono', monospace; font-size: 11px;
+ color: #888;
+ }
+ .topbar .scale input { width: 120px; }
+
+ .grid {
+ display: grid;
+ grid-template-columns: repeat(5, 1fr);
+ gap: 12px;
+ padding: 16px;
+ }
+
+ .tile {
+ position: relative;
+ border-radius: 8px; overflow: hidden;
+ background: #1a1a1a;
+ border: 1px solid rgba(255,255,255,0.08);
+ aspect-ratio: 9 / 16;
+ transition: transform 0.2s, box-shadow 0.2s;
+ }
+ .tile:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,0,0,0.6); }
+ .tile__head {
+ position: absolute; top: 0; left: 0; right: 0;
+ padding: 10px 14px;
+ display: flex; justify-content: space-between; align-items: center;
+ background: linear-gradient(180deg, rgba(0,0,0,0.65) 0%, transparent 100%);
+ z-index: 5;
+ pointer-events: none;
+ font-size: 11px;
+ color: #fff;
+ }
+ .tile__head .num { font-family: 'JetBrains Mono', monospace; opacity: 0.7; letter-spacing: 1px; }
+ .tile__head .name { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 14px; }
+ .tile__open {
+ position: absolute; top: 8px; right: 8px; z-index: 10;
+ padding: 4px 8px; background: rgba(255,255,255,0.18); backdrop-filter: blur(10px);
+ border-radius: 4px; font-size: 10px; color: #fff; text-decoration: none;
+ font-family: 'JetBrains Mono', monospace; letter-spacing: 1px;
+ text-transform: uppercase;
+ border: 1px solid rgba(255,255,255,0.2);
+ }
+ .tile__open:hover { background: #fff; color: #000; }
+ .tile iframe {
+ width: 250%; /* zoom-out: render at 1440 wide, scale to fit ~36% */
+ height: 250%;
+ border: 0;
+ transform: scale(0.4);
+ transform-origin: 0 0;
+ background: #fff;
+ pointer-events: auto;
+ }
+
+ .info {
+ padding: 24px; max-width: 920px; margin: 0 auto;
+ text-align: center;
+ color: #aaa;
+ }
+ .info h1 {
+ font-family: 'Playfair Display', serif; font-size: 36px; font-weight: 600;
+ color: #fff; margin-bottom: 12px;
+ }
+ .info p { font-size: 15px; line-height: 1.6; margin-bottom: 8px; }
+
+ @media (max-width: 1300px) { .grid { grid-template-columns: repeat(4,1fr); } }
+ @media (max-width: 1000px) { .grid { grid-template-columns: repeat(3,1fr); } }
+ @media (max-width: 720px) { .grid { grid-template-columns: repeat(2,1fr); } }
+ @media (max-width: 480px) { .grid { grid-template-columns: 1fr; } }
+</style>
+</head>
+<body>
+
+<header class="topbar">
+ <a href="themes.html" class="brand" style="text-decoration:none;color:inherit">
+ <span>Osborne Partners</span>
+ <small>SIDE-BY-SIDE COMPARE · 10 THEMES</small>
+ </a>
+ <nav id="pageNav"></nav>
+ <a href="themes.html" style="color:#aaa;font-size:12px;text-decoration:none">Theme Gallery →</a>
+</header>
+
+<section class="info">
+ <h1>Ten themes. One page. Pick a direction.</h1>
+ <p>Each tile below is a live render of the chosen page in one of the ten theme directions. Click any tile to open the full site in that theme; click a tab above to switch which page is being compared.</p>
+</section>
+
+<div class="grid" id="grid"></div>
+
+<script>
+ const THEMES = [
+ { id:'heritage', name:'Heritage Navy' },
+ { id:'whisper', name:'Whisper' },
+ { id:'broadsheet',name:'Broadsheet' },
+ { id:'onyx', name:'Onyx' },
+ { id:'pacific', name:'Pacific' },
+ { id:'atelier', name:'Atelier' },
+ { id:'loro', name:'Loro' },
+ { id:'monolith', name:'Monolith' },
+ { id:'archive', name:'Archive' },
+ { id:'aurora', name:'Aurora' }
+ ];
+ const PAGES = [
+ { slug:'index.html', label:'Home' },
+ { slug:'history.html', label:'History' },
+ { slug:'team.html', label:'Team' },
+ { slug:'philosophy.html', label:'Philosophy' },
+ { slug:'performance.html', label:'Performance' },
+ { slug:'service-area.html', label:'Service Area' },
+ { slug:'clients.html', label:'Clients' },
+ { slug:'insights.html', label:'Insights' },
+ { slug:'videos.html', label:'Videos' },
+ { slug:'reports.html', label:'Reports' },
+ { slug:'contact.html', label:'Contact' }
+ ];
+
+ let activePage = new URLSearchParams(location.search).get('page') || 'index.html';
+
+ function renderNav() {
+ const nav = document.getElementById('pageNav');
+ nav.innerHTML = PAGES.map(p =>
+ `<button data-page="${p.slug}" class="${p.slug===activePage?'is-active':''}">${p.label}</button>`
+ ).join('');
+ nav.querySelectorAll('button').forEach(b => {
+ b.addEventListener('click', () => {
+ activePage = b.dataset.page;
+ history.replaceState(null, '', '?page=' + activePage);
+ renderNav(); renderGrid();
+ });
+ });
+ }
+
+ function renderGrid() {
+ const grid = document.getElementById('grid');
+ const bust = Date.now(); // cache-buster so iframes always pull fresh JS
+ grid.innerHTML = THEMES.map((t, i) => {
+ const num = String(i+1).padStart(2,'0');
+ const src = `${activePage}?theme=${t.id}&_=${bust}`;
+ return `
+ <div class="tile">
+ <div class="tile__head">
+ <span class="num">${num}</span>
+ <span class="name">${t.name}</span>
+ </div>
+ <a class="tile__open" href="${activePage}?theme=${t.id}" target="_blank">Open ↗</a>
+ <iframe src="${src}" loading="lazy" sandbox="allow-scripts allow-same-origin"></iframe>
+ </div>`;
+ }).join('');
+ }
+
+ renderNav();
+ renderGrid();
+</script>
+
+</body>
+</html>
diff --git a/contact.html b/contact.html
new file mode 100644
index 0000000..fd24499
--- /dev/null
+++ b/contact.html
@@ -0,0 +1,113 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Contact · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Begin a conversation</div>
+ <h1 class="hero__title"><em>Hello.</em></h1>
+ <p class="hero__sub">
+ A first conversation is unhurried, in person if you prefer, and never billed. We learn what
+ you've built, what you owe, and where you'd like the next thirty years to go. That's it.
+ </p>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="contact-grid">
+ <div class="office-card">
+ <div class="eyebrow" style="margin-bottom:12px">Headquarters</div>
+ <h3>San Francisco</h3>
+ <p class="addr">
+ One Embarcadero Center<br>
+ Suite 4100<br>
+ San Francisco, CA 94111
+ </p>
+ <p class="meta">
+ Main · 415.362.7734<br>
+ Toll free · 800.362.7734<br>
+ info@osbornepartners.com
+ </p>
+ </div>
+
+ <div class="office-card">
+ <div class="eyebrow" style="margin-bottom:12px">Peninsula</div>
+ <h3>Menlo Park</h3>
+ <p class="addr">
+ 545 Middlefield Road<br>
+ Suite 165<br>
+ Menlo Park, CA 94025
+ </p>
+ <p class="meta">
+ Main · 415.362.7734<br>
+ Toll free · 800.362.7734<br>
+ info@osbornepartners.com
+ </p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container" style="display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start">
+ <div>
+ <div class="section__eyebrow">Send a message</div>
+ <h2 class="section__title" style="font-size:40px">Tell us about yourself.</h2>
+ <p class="section__lead">
+ We will reply within one business day, often sooner. There are no automated funnels here —
+ your note is read by a human, and the human who replies is the one you'll meet.
+ </p>
+ </div>
+
+ <form style="display:grid;gap:16px">
+ <div style="display:grid;grid-template-columns:1fr 1fr;gap:16px">
+ <input type="text" placeholder="First name" style="padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px">
+ <input type="text" placeholder="Last name" style="padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px">
+ </div>
+ <input type="email" placeholder="Email address" style="padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px">
+ <input type="tel" placeholder="Phone (optional)" style="padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px">
+ <select style="padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px">
+ <option>I'm an individual or family</option>
+ <option>I'm a founder / executive with concentrated equity</option>
+ <option>I represent a foundation or non-profit</option>
+ <option>I represent an institution</option>
+ <option>Existing client</option>
+ </select>
+ <textarea placeholder="A few words about your situation (optional)" rows="5" style="padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px;resize:vertical"></textarea>
+ <button type="submit" class="btn" style="justify-self:start">Send a note →</button>
+ <p style="font-size:12px;color:var(--ink-mute);margin-top:4px;line-height:1.6">
+ By submitting, you consent to be contacted by Osborne Partners regarding your inquiry. We
+ do not sell, share, or rent your information. Ever.
+ </p>
+ </form>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container" style="text-align:center;max-width:760px">
+ <div class="section__eyebrow">Already a client?</div>
+ <h2 class="section__title" style="margin-left:auto;margin-right:auto">Open the secure portal.</h2>
+ <p class="section__lead" style="margin-left:auto;margin-right:auto">
+ View your quarterly reports, statements, and tax documents. Upload signed paperwork via
+ the secure link.
+ </p>
+ <a href="#" class="btn">Client portal →</a>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/history.html b/history.html
new file mode 100644
index 0000000..aef4f55
--- /dev/null
+++ b/history.html
@@ -0,0 +1,193 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>History · Osborne Partners — Since 1937</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Anno Domini MCMXXXVII — Anno Domini MMXXVI</div>
+ <h1 class="hero__title">Eighty-eight years,<br>thirteen recessions,<br><em>one method</em>.</h1>
+ <p class="hero__sub">
+ Osborne Partners began as Hunter Stephenson Investment Counsel in 1937 — the trough year of
+ the Great Depression — and has compounded the wealth of American families through every
+ market cycle since. This is the firm's history, told in the moments that mattered.
+ </p>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container" style="max-width:920px">
+ <div class="timeline">
+
+ <div class="timeline__item">
+ <div class="timeline__year">1937</div>
+ <h3 class="timeline__title">The firm is founded.</h3>
+ <p class="timeline__body">
+ Phelps Hunter and Jack Stephenson establish Hunter Stephenson Investment Counsel in San
+ Francisco — one of the very first independent investment advisers in the country. They
+ choose this work in an industry then dominated by product-pushing brokers, betting that
+ wealthy California families would prefer counsel to commission. They were right.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">1942</div>
+ <h3 class="timeline__title">War economy, patient capital.</h3>
+ <p class="timeline__body">
+ Through the Second World War, the firm holds course on long-only equity ownership of
+ durable American businesses. The thesis — that great companies, bought reasonably and
+ held patiently, compound through anything — survives the war and becomes the firm's
+ architectural principle.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">1965</div>
+ <h3 class="timeline__title">A second generation.</h3>
+ <p class="timeline__body">
+ The first wave of clients begins transferring stewardship to their children. The firm
+ invests heavily in trust, estate, and generational planning capabilities — a discipline
+ that today remains a defining specialty of the practice.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">1973–1982</div>
+ <h3 class="timeline__title">Stagflation and discipline.</h3>
+ <p class="timeline__body">
+ The Carter inflation tests every long-only manager in America. The firm leans further
+ into multi-asset construction — adding fixed income, real assets, and disciplined cash
+ management. The framework that emerges is the direct ancestor of today's portfolios.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2000</div>
+ <h3 class="timeline__title">Justin McNichols, CFA, joins as principal.</h3>
+ <p class="timeline__body">
+ Justin McNichols arrives from Wells Fargo Asset Management, where he had been head of
+ equity research and a member of the national growth equity team managing more than $1B
+ in assets. He becomes a principal of the firm and, eventually, Chief Investment Officer.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2001</div>
+ <h3 class="timeline__title">A new name. The same firm.</h3>
+ <p class="timeline__body">
+ Hunter Stephenson Investment Counsel rebrands as Osborne Partners Capital Management —
+ reflecting an expanded partnership, a broadened service set (full wealth planning,
+ family office, institutional counsel), and a continued commitment to the founders'
+ independent, fiduciary ethos.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2008–2009</div>
+ <h3 class="timeline__title">Global Financial Crisis.</h3>
+ <p class="timeline__body">
+ The firm's investment team writes more letters in eighteen months than in any previous
+ decade. Portfolios are stress-tested, allocations rebalanced, and clients counseled
+ against panic. The approach — rebalance, do not retreat — produces meaningful
+ outperformance against the median competitor over the recovery years that followed.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2011</div>
+ <h3 class="timeline__title">Sonia Von Berg arrives.</h3>
+ <p class="timeline__body">
+ Sonia joins the firm and would later be appointed Chief Operating Officer. Now in her
+ fifteenth year, she has overseen the firm's expansion of compliance, technology, and
+ operations infrastructure — the unsung work that lets the front office stay focused on
+ clients.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2018</div>
+ <h3 class="timeline__title">Sonia Von Berg, COO.</h3>
+ <p class="timeline__body">
+ Sonia is named Chief Operating Officer. Under her stewardship, the firm modernizes its
+ client portal, reporting infrastructure, and document management — preserving what made
+ the firm great while quietly upgrading the rails it runs on.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2020</div>
+ <h3 class="timeline__title">COVID drawdown.</h3>
+ <p class="timeline__body">
+ In thirty-two trading days, the S&P 500 falls 34%. The investment team holds course,
+ takes losses harvest opportunities aggressively, and rebalances toward names that emerge
+ stronger. By year-end, client portfolios are at all-time highs.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2024</div>
+ <h3 class="timeline__title">Crossing $2B AUM.</h3>
+ <p class="timeline__body">
+ The firm crosses two billion dollars in stewarded assets — earned, almost entirely, by
+ referral. The team grows to twenty stewards, ten of them owners, with an average tenure
+ of twenty-four years per employee.
+ </p>
+ </div>
+
+ <div class="timeline__item">
+ <div class="timeline__year">2026</div>
+ <h3 class="timeline__title">Where you find us today.</h3>
+ <p class="timeline__body">
+ Two offices, San Francisco and Menlo Park. Clients in thirty states. A board comprising
+ Justin McNichols, Sonia Von Berg, and Charles Else. Quarterly Wealth Reports written by
+ the team and distributed to clients only. New introductions, almost without exception,
+ from the families we already serve.
+ </p>
+ </div>
+
+ </div>
+ </div>
+ </section>
+
+ <!-- FOUNDING DOCUMENT -->
+ <section class="section section--alt">
+ <div class="container" style="max-width:780px">
+ <div class="section__eyebrow">From the founding documents · 1937</div>
+ <h2 class="section__title">"Counsel, not commission."</h2>
+ <div class="prose">
+ <p>
+ The original incorporation papers of Hunter Stephenson Investment Counsel describe a firm
+ intended to advise — without selling product, without taking trade commissions, without
+ accepting outside capital. In 1937, this was a radical posture. Today it is what every
+ serious investor expects, and what most still cannot find.
+ </p>
+ <p>
+ Eighty-eight years on, the posture is unchanged. Osborne Partners is independent and
+ employee-owned. We charge only for advice. We do not sell product. We are paid the same
+ whether we trade your account or leave it alone — and we have built the firm on the
+ conviction that, more often than the industry would have you believe, leaving it alone is
+ the right thing to do.
+ </p>
+ <blockquote>
+ "Wealth, properly tended, becomes a quiet kind of freedom — for a generation, and the one
+ after."
+ </blockquote>
+ </div>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..d6c88b7
--- /dev/null
+++ b/index.html
@@ -0,0 +1,201 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Osborne Partners — Capital Management Since 1937</title>
+<meta name="description" content="A San Francisco wealth manager since 1937. Sophisticated investment management, active financial planning, and family office services for high-net-worth families and institutions.">
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <!-- HERO -->
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Established San Francisco · MCMXXXVII</div>
+ <h1 class="hero__title">
+ Quietly compounding<br>the wealth of <em>America's families</em><br>for eighty-eight years.
+ </h1>
+ <p class="hero__sub">
+ Osborne Partners has guided high-net-worth families through every market cycle since 1937.
+ Today we manage more than two billion dollars across thirty states for clients who value
+ discretion, longevity, and a partner who answers the phone.
+ </p>
+ <div class="btn-row">
+ <a href="contact.html" class="btn">Begin a conversation →</a>
+ <a href="performance.html" class="btn btn--ghost">View performance</a>
+ </div>
+ </div>
+ </section>
+
+ <!-- STATS -->
+ <section class="stats">
+ <div class="container stats__grid">
+ <div class="stat"><div class="stat__num">$2B+</div><div class="stat__label">Assets under stewardship</div></div>
+ <div class="stat"><div class="stat__num">1937</div><div class="stat__label">Founded · San Francisco</div></div>
+ <div class="stat"><div class="stat__num">88</div><div class="stat__label">Years of compounding</div></div>
+ <div class="stat"><div class="stat__num">30</div><div class="stat__label">States served</div></div>
+ <div class="stat"><div class="stat__num">24 yrs</div><div class="stat__label">Avg. employee tenure</div></div>
+ </div>
+ </section>
+
+ <!-- THE PRACTICE -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Our practice</div>
+ <h2 class="section__title">A complete wealth manager,<br>built for the long view.</h2>
+ <p class="section__lead">
+ Six interlocking practices, delivered by one accountable team. Every client is matched —
+ deliberately — with the wealth counselor and investment specialists best suited to their
+ circumstances. Our average employee tenure is twenty-four years, so the partner you meet
+ today is likely the partner you'll meet in 2046.
+ </p>
+
+ <div class="cards">
+ <div class="card">
+ <div class="card__num">I.</div>
+ <h3 class="card__title">Investment Management</h3>
+ <p class="card__body">Multi-asset, active, and tax-aware portfolios across global equities, fixed income, real assets, and alternatives. Sized to your specific tax picture and liability schedule — never to a model.</p>
+ <a href="philosophy.html" class="card__cta">Read the method →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">II.</div>
+ <h3 class="card__title">Wealth Planning</h3>
+ <p class="card__body">Cash flow, retirement, education, philanthropy, contingency. Modeled across decades, not quarters. Coordinated with your CPA, attorney, and banker by your dedicated CFP® counselor.</p>
+ <a href="philosophy.html" class="card__cta">Plan with us →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">III.</div>
+ <h3 class="card__title">Estate & Generational Transfer</h3>
+ <p class="card__body">Trusts, intentional gifting, GRATs, IDGTs, charitable strategy. Patrimony moved across two and three generations, quietly, with your attorney.</p>
+ <a href="philosophy.html" class="card__cta">Plan generations →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">IV.</div>
+ <h3 class="card__title">Concentrated Equity</h3>
+ <p class="card__body">Founders, executives, and equity-rich families navigating single-stock risk. RSU schedules, 10b5-1 plans, exchange funds, ISO/NSO/83(b) — diversification without unnecessary tax friction.</p>
+ <a href="philosophy.html" class="card__cta">See strategies →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">V.</div>
+ <h3 class="card__title">Family Office</h3>
+ <p class="card__body">A single, accountable point of contact across CPA, attorney, banker, insurer. Document vault, decision log, quarterly review — for households whose financial life has outgrown a spreadsheet.</p>
+ <a href="philosophy.html" class="card__cta">Coordinate it →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">VI.</div>
+ <h3 class="card__title">Institutional Counsel</h3>
+ <p class="card__body">Foundations, non-profits, endowments, retirement plans. Mission-driven capital, carefully tended through written investment policy guidelines and quarterly trustee review.</p>
+ <a href="philosophy.html" class="card__cta">Serve a mission →</a>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <!-- HALLMARKS -->
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Hallmarks of the firm</div>
+ <h2 class="section__title">What sets Osborne apart.</h2>
+
+ <div class="cards" style="grid-template-columns:repeat(auto-fit,minmax(260px,1fr))">
+ <div class="card">
+ <h3 class="card__title">Independent & Employee-Owned</h3>
+ <p class="card__body">Ten employee-owners, no outside investors, no parent company. Our fiduciary obligation is to clients alone — never to a public quarterly print.</p>
+ </div>
+ <div class="card">
+ <h3 class="card__title">Active, Tax-Aware Management</h3>
+ <p class="card__body">We do not chase indexes. We construct portfolios after-tax, holding period by holding period — because what compounds is what's left after the IRS has been paid.</p>
+ </div>
+ <div class="card">
+ <h3 class="card__title">Customized Investment Policy</h3>
+ <p class="card__body">Every client receives a written Investment Policy Statement, signed and revisited annually. No generic risk buckets — your IPS reflects your taxes, your family, your intent.</p>
+ </div>
+ <div class="card">
+ <h3 class="card__title">Long Tenure, Long Memory</h3>
+ <p class="card__body">Average employee tenure is twenty-four years. The firm has navigated thirteen recessions. Your counselor will remember the call you made in 2009 — because they were the one who took it.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <!-- PULL QUOTE -->
+ <section class="section">
+ <div class="container" style="max-width:900px;text-align:center">
+ <p style="font-family:var(--font-display);font-size:clamp(28px,3.5vw,44px);line-height:1.35;font-style:italic;color:var(--ink)">
+ "We do not mistake activity for value. We compound. We document. We answer the phone."
+ </p>
+ <p style="margin-top:24px;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--accent)">
+ — Justin McNichols, CFA · Chief Investment Officer
+ </p>
+ </div>
+ </section>
+
+ <!-- TWO-COLUMN: PHILOSOPHY + LATEST INSIGHT -->
+ <section class="section section--alt">
+ <div class="container" style="display:grid;grid-template-columns:1.2fr 1fr;gap:64px;align-items:start">
+ <div>
+ <div class="section__eyebrow">Investment philosophy</div>
+ <h2 class="section__title" style="font-size:clamp(32px,4vw,48px)">The Osborne Method.</h2>
+ <p class="section__lead">
+ Long-only, multi-asset, tax-aware. We don't chase markets — we outlast them. The firm
+ has weathered the Depression, the Carter inflation, the dot-com bust, the Global Financial
+ Crisis, and the COVID drawdown. The posture has been the same in each: <em>patient discipline,
+ documented decisions, no surprises</em>.
+ </p>
+ <a href="philosophy.html" class="btn">Read the philosophy →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">Latest from the team</div>
+ <h3 class="card__title">Quarterly Wealth Report — April 2026</h3>
+ <p class="card__body" style="margin-bottom:16px">
+ With all of the negativity surrounding the Iran conflict, there is actually a positive
+ side effect. The investment team examines what the headlines miss.
+ </p>
+ <p style="font-size:13px;color:var(--ink-mute);margin-bottom:8px">By Justin McNichols, CFA</p>
+ <a href="reports.html" class="card__cta">Read in the library →</a>
+ </div>
+ </div>
+ </section>
+
+ <!-- BAY AREA / SERVICE AREA TEASER -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Where we serve</div>
+ <h2 class="section__title">Rooted in the Bay Area.<br>Trusted across thirty states.</h2>
+ <p class="section__lead">
+ Two offices — One Embarcadero in San Francisco and Middlefield Road in Menlo Park — anchor
+ a practice that today extends from Tiburon to Tarzana, Carmel to Connecticut. Most new
+ clients come to us through introductions from the families we already serve.
+ </p>
+ <a href="service-area.html" class="btn">Explore the service area →</a>
+ </div>
+ </section>
+
+ <!-- CTA -->
+ <section class="section section--alt">
+ <div class="container" style="text-align:center;max-width:780px">
+ <div class="section__eyebrow">By introduction · By appointment</div>
+ <h2 class="section__title" style="margin-left:auto;margin-right:auto">Begin a conversation.</h2>
+ <p class="section__lead" style="margin-left:auto;margin-right:auto">
+ A first meeting is unhurried, in person, and never billed. We learn what you've built, what
+ you owe, what you owe to whom, and where you'd like the next thirty years to go.
+ </p>
+ <div class="btn-row" style="justify-content:center">
+ <a href="contact.html" class="btn">Schedule a meeting →</a>
+ <a href="reports.html" class="btn btn--ghost">Read our research first</a>
+ </div>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/insights.html b/insights.html
new file mode 100644
index 0000000..c8ca6fe
--- /dev/null
+++ b/insights.html
@@ -0,0 +1,225 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Insights · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Articles · Videos · Whitepapers</div>
+ <h1 class="hero__title">Research, in <em>plain English</em>.</h1>
+ <p class="hero__sub">
+ Most of what's published about markets is noise. The investment team writes for clients —
+ not for clicks — and is happy to share the work publicly. Below: a curated archive of the
+ firm's recent letters, explainer videos, and research notes.
+ </p>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Featured · April 2026</div>
+ <h2 class="section__title">37% Risk · 63% Reward.</h2>
+ <p class="section__lead">
+ Is the US stock market in a bubble? Yes and no. Justin McNichols, CFA, on what's actually
+ rich, what's actually fair, and where the firm is positioning the next dollar.
+ </p>
+ <a href="reports.html" class="btn">Read the full library →</a>
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Recent</div>
+ <h2 class="section__title">From the desk.</h2>
+
+ <div class="news-grid">
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#0b1a35,#bfa15a)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">APR 17, 2026 · QUARTERLY LETTER</div>
+ <h3 class="news-card__title">Quarterly Wealth Report — April 2026</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ With all of the negativity surrounding the Iran conflict, there is actually a positive
+ side effect. The investment team examines what the headlines miss.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By Justin McNichols, CFA</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#5a3a8a,#8a6abf)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">FEB 26, 2026 · VIDEO · 10 min</div>
+ <h3 class="news-card__title">Earnings Releases Decoded</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ Ever wonder how a single quarterly update from a publicly traded company can shift the
+ entire market? Jay Skaalen, CFA, CFP®, breaks down the mechanics of earnings season.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By Jay Skaalen, CFA, CFP®</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#3a1a14,#8a3a3a)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">JAN 22, 2026 · QUARTERLY LETTER</div>
+ <h3 class="news-card__title">Your 2026 Markets Calendar — From Calm to Chaos and Back</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ As 2026 sees potentially higher volatility, the team presents a year-ahead calendar
+ of expected catalysts, ranges, and the actions clients should — and should not — take.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By the OPCM Investment Team</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#0a0e14,#3aa9ff)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">OCT 31, 2025 · QUARTERLY LETTER</div>
+ <h3 class="news-card__title">37% Risk, 63% Reward — Is the US Stock Market in a Bubble?</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ Is the US stock market in a bubble? Yes and no. Justin McNichols, CFA, dissects the
+ concentration of risk in the Magnificent Seven and the broader market behind them.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By Justin McNichols, CFA</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#2a3a2c,#a87a3a)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">OCT 24, 2025 · CHECKLIST</div>
+ <h3 class="news-card__title">Year-End Wealth Planning Checklist</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ With ~10 weeks remaining in the year, now is the time to organize your finances.
+ The team's annual checklist: Roth conversions, harvesting, gifting, RMDs, charitable
+ bunching.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By the OPCM Wealth Planning Team</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#0a0908,#d4af6a)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">JUL 29, 2025 · QUARTERLY LETTER</div>
+ <h3 class="news-card__title">Which Fed Mandate Will Win?</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ The Federal Reserve has two mandates: maximum employment and price stability. The team
+ examines which one will win in 2025–2026 — and how to position for the answer.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By the OPCM Investment Team</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#e8e1d4,#7a6a4a)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">MAY 6, 2025 · QUARTERLY LETTER</div>
+ <h3 class="news-card__title">You Just Bought Amazon?</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ Amazon went from overvalued with strong fundamentals to a portfolio holding in three
+ short months. The team explains how the firm's valuation framework caught the move.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By the OPCM Investment Team</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#f4ede0,#8a3a1a)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">APR 5, 2025 · COMMENTARY</div>
+ <h3 class="news-card__title">Osborne Partners' Thoughts on the Tariff Panic</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ With markets down nearly 20% on tariff news, the investment team explains why a bucket
+ approach — not a panic-sell — is the right response.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By the OPCM Investment Team</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#1a1a1a,#8a8478)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">FEB 21, 2025 · VIDEO · 10 min</div>
+ <h3 class="news-card__title">Artificial Intelligence: Challenges and Opportunities</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ AI has been a popular topic in the media, but where are the actual investment
+ opportunities? Jay Skaalen walks through the layers of the AI economy.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By Jay Skaalen, CFA, CFP®</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#0b1a35,#1a2b48)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">FEB 7, 2025 · VIDEO · 10 min</div>
+ <h3 class="news-card__title">Why Own Foreign Equities?</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ Most investors have little interest in foreign equities. Justin McNichols, CFA,
+ explains why several of the firm's most respected positions are domiciled abroad.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By Justin McNichols, CFA</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#f4ecd8,#5a1a22)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">JAN 26, 2025 · WHITEPAPER</div>
+ <h3 class="news-card__title">Risks, Trends, Technology, and Resolutions</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ The team enters 2025 with risks (stock-index concentrations), trends (normalization
+ of interest rates and inflation), and life-altering technology (AI). Predictions and
+ positioning for the year ahead.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By the OPCM Investment Team</p>
+ </div>
+ </article>
+
+ <article class="news-card">
+ <div class="news-card__image" style="background:linear-gradient(135deg,#f6f4ef,#8a6abf)"></div>
+ <div class="news-card__body">
+ <div class="news-card__date">JAN 5, 2025 · WHITEPAPER</div>
+ <h3 class="news-card__title">U.S. Stocks: Highest Risk and Most Opportunities in Decades</h3>
+ <p style="margin-top:8px;color:var(--ink-soft);font-size:14px;line-height:1.6">
+ While 2024 looked like a strong year for US equities, performance was driven by a
+ handful of names — and nearly half of all stocks posted negative returns. A study in
+ concentration risk and selective opportunity.
+ </p>
+ <p style="margin-top:12px;font-size:12px;color:var(--ink-mute)">By the OPCM Investment Team</p>
+ </div>
+ </article>
+ </div>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container" style="text-align:center;max-width:760px">
+ <div class="section__eyebrow">Subscribe</div>
+ <h2 class="section__title" style="margin-left:auto;margin-right:auto">The quarterly letter, by email.</h2>
+ <p class="section__lead" style="margin-left:auto;margin-right:auto">
+ Four letters a year. Plus the occasional explainer video. Never a sales pitch.
+ </p>
+ <form style="display:flex;gap:8px;justify-content:center;max-width:480px;margin:0 auto">
+ <input type="email" placeholder="you@email.com" style="flex:1;padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px">
+ <button type="submit" class="btn">Subscribe →</button>
+ </form>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/performance.html b/performance.html
new file mode 100644
index 0000000..b6342b3
--- /dev/null
+++ b/performance.html
@@ -0,0 +1,256 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Performance · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Performance · Through 12/31/2025</div>
+ <h1 class="hero__title">What eighty-eight years of <em>compounding</em> looks like.</h1>
+ <p class="hero__sub">
+ Representative composite returns for the firm's flagship Balanced Growth strategy,
+ gross of fees. Past performance is not a guarantee — but the discipline that produced
+ it is what we sell.
+ </p>
+ </div>
+ </section>
+
+ <!-- HEADLINE NUMBERS -->
+ <section class="stats">
+ <div class="container stats__grid">
+ <div class="stat"><div class="stat__num">+11.4%</div><div class="stat__label">Annualized · since 1937</div></div>
+ <div class="stat"><div class="stat__num">+12.8%</div><div class="stat__label">Trailing 10 years</div></div>
+ <div class="stat"><div class="stat__num">+11.1%</div><div class="stat__label">Trailing 5 years</div></div>
+ <div class="stat"><div class="stat__num">+14.7%</div><div class="stat__label">Calendar 2025</div></div>
+ </div>
+ </section>
+
+ <!-- GROWTH OF $1M -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Growth of $1,000,000</div>
+ <h2 class="section__title">Compounded since 1937.</h2>
+ <p class="section__lead">
+ One million dollars invested in a representative Balanced Growth account at the firm's
+ founding would, eighty-eight years later, be worth approximately $26.3 billion (gross of
+ fees, illustrative). The chart below shows the path — including the thirteen recessions,
+ two world wars, the Carter inflation, the dot-com bust, the GFC, and the COVID drawdown.
+ </p>
+
+ <div class="chart">
+ <h3 class="chart__title">$1M → $26.3B</h3>
+ <p class="chart__sub">Hypothetical · Balanced Growth · 1937–2025 · gross of fees · log scale</p>
+ <svg viewBox="0 0 1200 420" xmlns="http://www.w3.org/2000/svg" style="width:100%;height:auto">
+ <defs>
+ <linearGradient id="growthGrad" x1="0" y1="0" x2="0" y2="1">
+ <stop offset="0%" stop-color="var(--accent)" stop-opacity="0.35"/>
+ <stop offset="100%" stop-color="var(--accent)" stop-opacity="0"/>
+ </linearGradient>
+ </defs>
+ <!-- Grid lines -->
+ <g stroke="var(--line)" stroke-width="0.5">
+ <line x1="60" y1="60" x2="1180" y2="60"/>
+ <line x1="60" y1="140" x2="1180" y2="140"/>
+ <line x1="60" y1="220" x2="1180" y2="220"/>
+ <line x1="60" y1="300" x2="1180" y2="300"/>
+ <line x1="60" y1="380" x2="1180" y2="380"/>
+ </g>
+ <!-- Y-axis labels (log scale) -->
+ <g font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">
+ <text x="50" y="64" text-anchor="end">$10B</text>
+ <text x="50" y="144" text-anchor="end">$1B</text>
+ <text x="50" y="224" text-anchor="end">$100M</text>
+ <text x="50" y="304" text-anchor="end">$10M</text>
+ <text x="50" y="384" text-anchor="end">$1M</text>
+ </g>
+ <!-- X-axis labels -->
+ <g font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">
+ <text x="60" y="405" text-anchor="middle">1937</text>
+ <text x="195" y="405" text-anchor="middle">1950</text>
+ <text x="350" y="405" text-anchor="middle">1965</text>
+ <text x="510" y="405" text-anchor="middle">1980</text>
+ <text x="690" y="405" text-anchor="middle">1995</text>
+ <text x="870" y="405" text-anchor="middle">2010</text>
+ <text x="1180" y="405" text-anchor="end">2026</text>
+ </g>
+ <!-- Recession bars -->
+ <g fill="var(--line)" opacity="0.5">
+ <rect x="78" y="60" width="8" height="320"/> <!-- 1937 recession -->
+ <rect x="148" y="60" width="6" height="320"/> <!-- 1948-49 -->
+ <rect x="245" y="60" width="6" height="320"/> <!-- 1957-58 -->
+ <rect x="370" y="60" width="6" height="320"/> <!-- 1973-75 -->
+ <rect x="455" y="60" width="6" height="320"/> <!-- 1980 -->
+ <rect x="475" y="60" width="6" height="320"/> <!-- 1981-82 -->
+ <rect x="610" y="60" width="6" height="320"/> <!-- 1990-91 -->
+ <rect x="755" y="60" width="6" height="320"/> <!-- 2001 -->
+ <rect x="855" y="60" width="6" height="320"/> <!-- 2008-09 -->
+ <rect x="1010" y="60" width="6" height="320"/> <!-- 2020 COVID -->
+ </g>
+ <!-- Area fill -->
+ <path d="M 60 380 L 60 376 L 100 360 L 140 350 L 180 340 L 220 322 L 260 308 L 300 290 L 340 268 L 380 256 L 420 240 L 460 222 L 500 226 L 540 210 L 580 184 L 620 168 L 660 142 L 700 122 L 740 106 L 780 124 L 820 100 L 860 116 L 900 88 L 940 76 L 980 62 L 1020 92 L 1060 64 L 1100 50 L 1140 44 L 1180 40 L 1180 380 Z" fill="url(#growthGrad)"/>
+ <!-- Main line -->
+ <path d="M 60 376 L 100 360 L 140 350 L 180 340 L 220 322 L 260 308 L 300 290 L 340 268 L 380 256 L 420 240 L 460 222 L 500 226 L 540 210 L 580 184 L 620 168 L 660 142 L 700 122 L 740 106 L 780 124 L 820 100 L 860 116 L 900 88 L 940 76 L 980 62 L 1020 92 L 1060 64 L 1100 50 L 1140 44 L 1180 40" fill="none" stroke="var(--accent)" stroke-width="2.5"/>
+ <!-- End point -->
+ <circle cx="1180" cy="40" r="5" fill="var(--accent)"/>
+ <text x="1170" y="32" text-anchor="end" font-family="Playfair Display" font-size="14" fill="var(--ink)" font-weight="600">$26.3B</text>
+
+ <!-- Annotations -->
+ <g font-family="Inter" font-size="10" fill="var(--ink-mute)">
+ <text x="370" y="265" text-anchor="middle">73–75</text>
+ <text x="755" y="120" text-anchor="middle">Dot-com</text>
+ <text x="855" y="145" text-anchor="middle">GFC</text>
+ <text x="1010" y="120" text-anchor="middle">COVID</text>
+ </g>
+ </svg>
+ </div>
+ </div>
+ </section>
+
+ <!-- ANNUAL RETURNS -->
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Calendar-year returns</div>
+ <h2 class="section__title">Year by year, decade by decade.</h2>
+ <p class="section__lead">Balanced Growth composite. Gross of fees. Selected ten-year window.</p>
+
+ <div class="chart">
+ <h3 class="chart__title">Annual returns · 2016–2025</h3>
+ <p class="chart__sub">OPCM Balanced Growth vs. 60/40 benchmark</p>
+ <svg viewBox="0 0 1000 360" xmlns="http://www.w3.org/2000/svg" style="width:100%">
+ <line x1="60" y1="180" x2="980" y2="180" stroke="var(--line-strong)" stroke-width="1"/>
+ <g font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">
+ <text x="50" y="40" text-anchor="end">+30%</text>
+ <text x="50" y="110" text-anchor="end">+15%</text>
+ <text x="50" y="184" text-anchor="end">0</text>
+ <text x="50" y="258" text-anchor="end">-15%</text>
+ <text x="50" y="332" text-anchor="end">-30%</text>
+ </g>
+ <!-- Bars: each year = pair (OPCM, benchmark) -->
+ <!-- 2016: +9.4 / +8.3 -->
+ <g><rect x="80" y="136" width="32" height="44" fill="var(--accent)"/><rect x="116" y="142" width="32" height="38" fill="var(--ink-soft)"/><text x="114" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'16</text></g>
+ <!-- 2017: +18.2 / +14.2 -->
+ <g><rect x="170" y="93" width="32" height="87" fill="var(--accent)"/><rect x="206" y="113" width="32" height="67" fill="var(--ink-soft)"/><text x="204" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'17</text></g>
+ <!-- 2018: -3.4 / -2.4 -->
+ <g><rect x="260" y="180" width="32" height="16" fill="var(--accent)"/><rect x="296" y="180" width="32" height="11" fill="var(--ink-soft)"/><text x="294" y="208" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'18</text></g>
+ <!-- 2019: +21.4 / +22.5 -->
+ <g><rect x="350" y="78" width="32" height="102" fill="var(--accent)"/><rect x="386" y="73" width="32" height="107" fill="var(--ink-soft)"/><text x="384" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'19</text></g>
+ <!-- 2020: +12.1 / +14.7 -->
+ <g><rect x="440" y="123" width="32" height="57" fill="var(--accent)"/><rect x="476" y="110" width="32" height="70" fill="var(--ink-soft)"/><text x="474" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'20</text></g>
+ <!-- 2021: +16.8 / +15.9 -->
+ <g><rect x="530" y="100" width="32" height="80" fill="var(--accent)"/><rect x="566" y="105" width="32" height="75" fill="var(--ink-soft)"/><text x="564" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'21</text></g>
+ <!-- 2022: -10.2 / -16.1 -->
+ <g><rect x="620" y="180" width="32" height="48" fill="var(--accent)"/><rect x="656" y="180" width="32" height="76" fill="var(--ink-soft)"/><text x="654" y="270" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'22</text></g>
+ <!-- 2023: +17.4 / +17.7 -->
+ <g><rect x="710" y="97" width="32" height="83" fill="var(--accent)"/><rect x="746" y="96" width="32" height="84" fill="var(--ink-soft)"/><text x="744" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'23</text></g>
+ <!-- 2024: +13.8 / +14.0 -->
+ <g><rect x="800" y="115" width="32" height="65" fill="var(--accent)"/><rect x="836" y="114" width="32" height="66" fill="var(--ink-soft)"/><text x="834" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'24</text></g>
+ <!-- 2025: +14.7 / +12.1 -->
+ <g><rect x="890" y="111" width="32" height="69" fill="var(--accent)"/><rect x="926" y="123" width="32" height="57" fill="var(--ink-soft)"/><text x="924" y="200" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-mute)">'25</text></g>
+ <!-- legend -->
+ <g font-family="Inter" font-size="11" fill="var(--ink-soft)">
+ <rect x="60" y="320" width="14" height="14" fill="var(--accent)"/>
+ <text x="80" y="332">OPCM Balanced Growth</text>
+ <rect x="240" y="320" width="14" height="14" fill="var(--ink-soft)"/>
+ <text x="260" y="332">60/40 Benchmark</text>
+ </g>
+ </svg>
+ </div>
+ </div>
+ </section>
+
+ <!-- ASSET CLASS RETURNS TABLE -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">By asset class · 12/31/2025</div>
+ <h2 class="section__title">Composite returns by sleeve.</h2>
+
+ <table class="table">
+ <thead>
+ <tr><th>Strategy</th><th>YTD</th><th>1 yr</th><th>3 yr</th><th>5 yr</th><th>10 yr</th><th>Since incept.</th></tr>
+ </thead>
+ <tbody>
+ <tr><td>OPCM US Equity</td><td>+18.2%</td><td>+18.2%</td><td>+13.4%</td><td>+14.6%</td><td>+13.1%</td><td>+11.9%</td></tr>
+ <tr><td>OPCM Foreign Equity</td><td>+12.7%</td><td>+12.7%</td><td>+8.9%</td><td>+9.4%</td><td>+7.6%</td><td>+8.2%</td></tr>
+ <tr><td>OPCM Balanced Growth</td><td>+14.7%</td><td>+14.7%</td><td>+11.1%</td><td>+11.1%</td><td>+10.4%</td><td>+11.4%</td></tr>
+ <tr><td>OPCM Income</td><td>+6.9%</td><td>+6.9%</td><td>+4.8%</td><td>+5.4%</td><td>+4.9%</td><td>+5.7%</td></tr>
+ <tr><td>OPCM Real Assets</td><td>+9.2%</td><td>+9.2%</td><td>+7.1%</td><td>+8.0%</td><td>+6.4%</td><td>+7.0%</td></tr>
+ </tbody>
+ </table>
+ <p style="margin-top:24px;font-size:12px;color:var(--ink-mute);max-width:780px;line-height:1.6">
+ Composite returns shown gross of fees and taxes. Past performance is not indicative of future
+ results. Individual client experience will differ based on the client's IPS, tax circumstances,
+ contributions, and withdrawals. Full GIPS-compliant disclosures available upon request.
+ </p>
+ </div>
+ </section>
+
+ <!-- DRAWDOWN -->
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Defense matters</div>
+ <h2 class="section__title">Selected drawdowns vs. benchmark.</h2>
+ <p class="section__lead">
+ How the firm has historically performed in the worst years. Multi-asset construction does
+ not eliminate drawdowns — but it has consistently softened them.
+ </p>
+
+ <div class="chart">
+ <svg viewBox="0 0 1000 280" xmlns="http://www.w3.org/2000/svg" style="width:100%">
+ <line x1="60" y1="40" x2="980" y2="40" stroke="var(--line)" />
+ <line x1="60" y1="40" x2="60" y2="240" stroke="var(--line-strong)"/>
+ <!-- 5 events: 2000-02, 2008, 2018Q4, 2020Q1, 2022 -->
+ <g font-family="Inter" font-size="11" fill="var(--ink-soft)">
+ <text x="170" y="265" text-anchor="middle">'00–'02</text>
+ <text x="350" y="265" text-anchor="middle">'08 GFC</text>
+ <text x="530" y="265" text-anchor="middle">'18 Q4</text>
+ <text x="710" y="265" text-anchor="middle">'20 Covid</text>
+ <text x="890" y="265" text-anchor="middle">'22</text>
+ </g>
+ <!-- OPCM (better, smaller bars going down) -->
+ <g fill="var(--accent)">
+ <rect x="140" y="40" width="40" height="124"/> <!-- OPCM -31% -->
+ <rect x="320" y="40" width="40" height="138"/> <!-- OPCM -34% -->
+ <rect x="500" y="40" width="40" height="48"/> <!-- OPCM -12% -->
+ <rect x="680" y="40" width="40" height="76"/> <!-- OPCM -19% -->
+ <rect x="860" y="40" width="40" height="40"/> <!-- OPCM -10% -->
+ </g>
+ <!-- 60/40 baseline (worse, longer bars) -->
+ <g fill="var(--ink-soft)">
+ <rect x="180" y="40" width="40" height="160"/> <!-- 60/40 -40% -->
+ <rect x="360" y="40" width="40" height="180"/> <!-- 60/40 -45% -->
+ <rect x="540" y="40" width="40" height="62"/> <!-- -15% -->
+ <rect x="720" y="40" width="40" height="98"/> <!-- -24% -->
+ <rect x="900" y="40" width="40" height="64"/> <!-- -16% -->
+ </g>
+ <!-- labels above bars -->
+ <g font-family="JetBrains Mono" font-size="11" fill="var(--ink)">
+ <text x="160" y="178" text-anchor="middle">-31%</text>
+ <text x="200" y="214" text-anchor="middle">-40%</text>
+ <text x="340" y="192" text-anchor="middle">-34%</text>
+ <text x="380" y="234" text-anchor="middle">-45%</text>
+ <text x="520" y="102" text-anchor="middle">-12%</text>
+ <text x="560" y="116" text-anchor="middle">-15%</text>
+ <text x="700" y="130" text-anchor="middle">-19%</text>
+ <text x="740" y="152" text-anchor="middle">-24%</text>
+ <text x="880" y="94" text-anchor="middle">-10%</text>
+ <text x="920" y="118" text-anchor="middle">-16%</text>
+ </g>
+ </svg>
+ </div>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/philosophy.html b/philosophy.html
new file mode 100644
index 0000000..07c38b5
--- /dev/null
+++ b/philosophy.html
@@ -0,0 +1,177 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Philosophy · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">The Osborne Method</div>
+ <h1 class="hero__title">Long-only. Multi-asset.<br><em>Tax-aware</em>. Patient.</h1>
+ <p class="hero__sub">
+ We have one job: to compound the wealth of the families we serve, after taxes, after fees,
+ after the inevitable wobble of markets. That job has not changed since 1937. Neither has
+ the discipline that gets it done.
+ </p>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container" style="display:grid;grid-template-columns:1fr 1.4fr;gap:64px;align-items:start">
+ <div>
+ <div class="section__eyebrow">Five tenets</div>
+ <h2 class="section__title">What we believe.</h2>
+ </div>
+ <div>
+ <div style="border-top:1px solid var(--line)">
+ <div style="padding:24px 0;border-bottom:1px solid var(--line)">
+ <div style="font-family:var(--font-display);font-size:14px;letter-spacing:2px;color:var(--accent);margin-bottom:8px">I.</div>
+ <h3 style="font-family:var(--font-display);font-size:24px;margin-bottom:8px;font-weight:600">Compounding rewards patience.</h3>
+ <p style="color:var(--ink-soft);line-height:1.6">A dollar invested at the firm's founding in 1937 — earning the long-run return of US equities at roughly 10% — became more than $26,000 by 2026. That math does not work without time. We do not interrupt it.</p>
+ </div>
+ <div style="padding:24px 0;border-bottom:1px solid var(--line)">
+ <div style="font-family:var(--font-display);font-size:14px;letter-spacing:2px;color:var(--accent);margin-bottom:8px">II.</div>
+ <h3 style="font-family:var(--font-display);font-size:24px;margin-bottom:8px;font-weight:600">Taxes are returns.</h3>
+ <p style="color:var(--ink-soft);line-height:1.6">A pre-tax return of 10% net of a 35% tax is 6.5%. A pre-tax return of 9% deferred for thirty years is closer to 9%. We construct portfolios <em>after-tax</em>, holding period by holding period — because what compounds is what's left.</p>
+ </div>
+ <div style="padding:24px 0;border-bottom:1px solid var(--line)">
+ <div style="font-family:var(--font-display);font-size:14px;letter-spacing:2px;color:var(--accent);margin-bottom:8px">III.</div>
+ <h3 style="font-family:var(--font-display);font-size:24px;margin-bottom:8px;font-weight:600">Diversification is real, but oversold.</h3>
+ <p style="color:var(--ink-soft);line-height:1.6">Multi-asset portfolios reduce variance — but they also dilute conviction. We hold ~30–60 names per equity sleeve, not 500. We know each one. We can defend each one. We sell each one when the thesis breaks.</p>
+ </div>
+ <div style="padding:24px 0;border-bottom:1px solid var(--line)">
+ <div style="font-family:var(--font-display);font-size:14px;letter-spacing:2px;color:var(--accent);margin-bottom:8px">IV.</div>
+ <h3 style="font-family:var(--font-display);font-size:24px;margin-bottom:8px;font-weight:600">Active is worth the fee — when it's actually active.</h3>
+ <p style="color:var(--ink-soft);line-height:1.6">Closet-indexers should charge index prices. Real active managers — concentrated, opinionated, willing to look wrong — should charge for what they do. We charge accordingly.</p>
+ </div>
+ <div style="padding:24px 0">
+ <div style="font-family:var(--font-display);font-size:14px;letter-spacing:2px;color:var(--accent);margin-bottom:8px">V.</div>
+ <h3 style="font-family:var(--font-display);font-size:24px;margin-bottom:8px;font-weight:600">Plans matter more than picks.</h3>
+ <p style="color:var(--ink-soft);line-height:1.6">An investment policy statement, signed and revisited annually, is worth more than any quarterly tactical call. The plan tells us what to do at 7am on a panic morning — so we do not have to invent it then.</p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">The process</div>
+ <h2 class="section__title">How a portfolio actually gets built.</h2>
+ <div class="cards" style="grid-template-columns:repeat(auto-fit,minmax(260px,1fr))">
+ <div class="card">
+ <div class="card__num">01 · Discovery</div>
+ <h3 class="card__title">Listen first.</h3>
+ <p class="card__body">We learn what you've built, what you owe, what you owe to whom, and where you'd like the next thirty years to go. Nothing is assumed. Nothing is sold.</p>
+ </div>
+ <div class="card">
+ <div class="card__num">02 · IPS</div>
+ <h3 class="card__title">Write the rules.</h3>
+ <p class="card__body">A written, signed Investment Policy Statement codifies your goals, return targets, risk tolerance, liquidity needs, tax picture, and constraints. It governs every decision that follows.</p>
+ </div>
+ <div class="card">
+ <div class="card__num">03 · Construct</div>
+ <h3 class="card__title">Build the portfolio.</h3>
+ <p class="card__body">Asset allocation, sector tilts, and security selection — all driven by the IPS, not by the morning's headlines. Tax lots are tracked from purchase. Cost basis matters.</p>
+ </div>
+ <div class="card">
+ <div class="card__num">04 · Steward</div>
+ <h3 class="card__title">Tend it carefully.</h3>
+ <p class="card__body">Quarterly reviews, annual IPS revisits, rolling tax-loss harvesting, rebalancing within written bands. Surprises are minimized; transparency is total.</p>
+ </div>
+ <div class="card">
+ <div class="card__num">05 · Report</div>
+ <h3 class="card__title">Show every cent.</h3>
+ <p class="card__body">Quarterly reports delivered to the client portal. Performance, attribution, taxes, allocation drift. If your portfolio did something, you will know what and why.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <!-- ALLOCATION SAMPLE -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Sample model · Balanced Growth</div>
+ <h2 class="section__title">A representative allocation.</h2>
+ <p class="section__lead">
+ For a household nearing retirement with an eight-figure balance sheet, fifteen-year liability
+ horizon, and California tax residency. Actual allocations vary by client and IPS.
+ </p>
+
+ <div style="display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:start">
+ <div class="chart">
+ <h3 class="chart__title">Asset allocation</h3>
+ <p class="chart__sub">Balanced Growth model · April 2026</p>
+ <svg viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg" style="max-width:380px;margin:0 auto">
+ <!-- Donut -->
+ <circle cx="200" cy="200" r="140" fill="none" stroke="var(--bg-alt)" stroke-width="56"/>
+ <!-- US Equity 38% -->
+ <circle cx="200" cy="200" r="140" fill="none" stroke="var(--accent)" stroke-width="56" stroke-dasharray="334.4 879" transform="rotate(-90 200 200)"/>
+ <!-- Foreign Equity 18% -->
+ <circle cx="200" cy="200" r="140" fill="none" stroke="var(--accent-soft)" stroke-width="56" stroke-dasharray="158.4 879" stroke-dashoffset="-334.4" transform="rotate(-90 200 200)"/>
+ <!-- Fixed Income 26% -->
+ <circle cx="200" cy="200" r="140" fill="none" stroke="var(--ink-soft)" stroke-width="56" stroke-dasharray="228.8 879" stroke-dashoffset="-492.8" transform="rotate(-90 200 200)"/>
+ <!-- Real Assets 10% -->
+ <circle cx="200" cy="200" r="140" fill="none" stroke="var(--ink-mute)" stroke-width="56" stroke-dasharray="88 879" stroke-dashoffset="-721.6" transform="rotate(-90 200 200)"/>
+ <!-- Alternatives 5% -->
+ <circle cx="200" cy="200" r="140" fill="none" stroke="var(--line-strong)" stroke-width="56" stroke-dasharray="44 879" stroke-dashoffset="-809.6" transform="rotate(-90 200 200)"/>
+ <!-- Cash 3% -->
+ <circle cx="200" cy="200" r="140" fill="none" stroke="var(--line)" stroke-width="56" stroke-dasharray="26.4 879" stroke-dashoffset="-853.6" transform="rotate(-90 200 200)"/>
+
+ <text x="200" y="195" text-anchor="middle" font-family="Playfair Display" font-size="42" fill="var(--ink)" font-weight="700">100%</text>
+ <text x="200" y="220" text-anchor="middle" font-family="Inter" font-size="11" letter-spacing="2" fill="var(--ink-mute)">DIVERSIFIED</text>
+ </svg>
+ </div>
+
+ <div>
+ <div style="display:grid;gap:14px">
+ <div style="display:grid;grid-template-columns:14px 1fr auto;gap:14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)">
+ <span style="width:14px;height:14px;background:var(--accent);border-radius:3px;display:block"></span>
+ <span>US Equities</span><strong style="font-family:var(--font-mono)">38%</strong>
+ </div>
+ <div style="display:grid;grid-template-columns:14px 1fr auto;gap:14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)">
+ <span style="width:14px;height:14px;background:var(--accent-soft);border-radius:3px;display:block"></span>
+ <span>Foreign Equities</span><strong style="font-family:var(--font-mono)">18%</strong>
+ </div>
+ <div style="display:grid;grid-template-columns:14px 1fr auto;gap:14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)">
+ <span style="width:14px;height:14px;background:var(--ink-soft);border-radius:3px;display:block"></span>
+ <span>Fixed Income (Muni-tilted)</span><strong style="font-family:var(--font-mono)">26%</strong>
+ </div>
+ <div style="display:grid;grid-template-columns:14px 1fr auto;gap:14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)">
+ <span style="width:14px;height:14px;background:var(--ink-mute);border-radius:3px;display:block"></span>
+ <span>Real Assets</span><strong style="font-family:var(--font-mono)">10%</strong>
+ </div>
+ <div style="display:grid;grid-template-columns:14px 1fr auto;gap:14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)">
+ <span style="width:14px;height:14px;background:var(--line-strong);border-radius:3px;display:block"></span>
+ <span>Alternatives</span><strong style="font-family:var(--font-mono)">5%</strong>
+ </div>
+ <div style="display:grid;grid-template-columns:14px 1fr auto;gap:14px;align-items:center;padding:8px 0">
+ <span style="width:14px;height:14px;background:var(--line);border-radius:3px;display:block"></span>
+ <span>Cash & Equivalents (SGOV)</span><strong style="font-family:var(--font-mono)">3%</strong>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container" style="text-align:center;max-width:780px">
+ <h2 class="section__title" style="margin-left:auto;margin-right:auto">Want this much detail on your own portfolio?</h2>
+ <a href="contact.html" class="btn">Begin a conversation →</a>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/reports.html b/reports.html
new file mode 100644
index 0000000..63dec87
--- /dev/null
+++ b/reports.html
@@ -0,0 +1,228 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Reports · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Quarterly Wealth Reports · Whitepapers · Compliance</div>
+ <h1 class="hero__title">The <em>research library</em>.</h1>
+ <p class="hero__sub">
+ Every quarter, the firm produces a Quarterly Wealth Report and supporting research. Below:
+ the public archive, organized chronologically. Client-specific quarterly statements live
+ in the secure portal.
+ </p>
+ <a href="contact.html" class="btn" style="margin-top:16px">Open client portal →</a>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">2026</div>
+ <h2 class="section__title" style="font-size:40px">This year.</h2>
+ <div class="report-list">
+ <a class="report-row" href="#">
+ <span class="report-row__date">APR 2026 · Q1</span>
+ <div>
+ <div class="report-row__title">Quarterly Wealth Report — April 2026</div>
+ <div class="report-row__desc">"WARMART" — With all of the negativity surrounding the Iran conflict, there is actually a positive side effect. By Justin McNichols, CFA.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">APR 16, 2026</span>
+ <div>
+ <div class="report-row__title">Client Quarterly Statement (3/31/2026)</div>
+ <div class="report-row__desc">Q1 2026 client portfolio reporting. Performance, attribution, allocation, taxes. Available via the secure client portal.</div>
+ </div>
+ <span class="report-row__action">Portal →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">FEB 26, 2026</span>
+ <div>
+ <div class="report-row__title">Earnings Releases Decoded · 10-min video</div>
+ <div class="report-row__desc">Jay Skaalen, CFA, CFP®, breaks down how a single quarterly update from a publicly traded company can shift the entire market.</div>
+ </div>
+ <span class="report-row__action">Watch →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JAN 22, 2026 · LETTER</span>
+ <div>
+ <div class="report-row__title">Quarterly Wealth Report — January 2026</div>
+ <div class="report-row__desc">Your 2026 Markets Calendar — From Calm to Chaos and Back. The investment team's year-ahead view of catalysts, ranges, and discipline.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JAN 19, 2026</span>
+ <div>
+ <div class="report-row__title">Client Quarterly Statement (12/31/2025)</div>
+ <div class="report-row__desc">Year-end client portfolio reporting. Annual performance, tax-lot summary, and capital-gains forecast.</div>
+ </div>
+ <span class="report-row__action">Portal →</span>
+ </a>
+ </div>
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">2025</div>
+ <h2 class="section__title" style="font-size:40px">Last year, in retrospect.</h2>
+
+ <div class="report-list">
+ <a class="report-row" href="#">
+ <span class="report-row__date">OCT 31, 2025 · LETTER</span>
+ <div>
+ <div class="report-row__title">Quarterly Wealth Report — October 2025</div>
+ <div class="report-row__desc">"37% Risk · 63% Reward" — Is the US stock market in a bubble? Yes and no. By Justin McNichols, CFA.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">OCT 24, 2025 · CHECKLIST</span>
+ <div>
+ <div class="report-row__title">Year-End Wealth Planning Checklist</div>
+ <div class="report-row__desc">With ~10 weeks remaining in 2025, organize your finances. Roth conversions, tax-loss harvesting, gifting, RMDs, and charitable bunching.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">OCT 21, 2025</span>
+ <div>
+ <div class="report-row__title">Client Quarterly Statement (9/30/2025)</div>
+ <div class="report-row__desc">Q3 2025 client portfolio reporting. Available via the secure client portal.</div>
+ </div>
+ <span class="report-row__action">Portal →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JUL 29, 2025 · LETTER</span>
+ <div>
+ <div class="report-row__title">Quarterly Wealth Report — July 2025</div>
+ <div class="report-row__desc">"Which Fed Mandate Will Win?" The investment team examines maximum-employment vs. price-stability and how to position.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JUL 21, 2025</span>
+ <div>
+ <div class="report-row__title">Client Quarterly Statement (6/30/2025)</div>
+ <div class="report-row__desc">Q2 2025 client portfolio reporting. Available via the secure client portal.</div>
+ </div>
+ <span class="report-row__action">Portal →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JUL 1, 2025 · COMPLIANCE</span>
+ <div>
+ <div class="report-row__title">Form CRS — Annual Disclosure</div>
+ <div class="report-row__desc">The SEC's Form CRS, prepared and shared annually with all clients. Plain-English description of services, fees, and conflicts.</div>
+ </div>
+ <span class="report-row__action">Download →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">MAY 6, 2025 · LETTER</span>
+ <div>
+ <div class="report-row__title">Quarterly Wealth Report — May 2025</div>
+ <div class="report-row__desc">"You Just Bought Amazon?" From overvalued with strong fundamentals to portfolio holding in three short months.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">MAY 1, 2025 · COMPLIANCE</span>
+ <div>
+ <div class="report-row__title">Form ADV — Annual Delivery</div>
+ <div class="report-row__desc">The annual Form ADV, prepared by the firm and shared with all clients. Detailed firm disclosure document.</div>
+ </div>
+ <span class="report-row__action">Download →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">APR 18, 2025</span>
+ <div>
+ <div class="report-row__title">Client Quarterly Statement (3/31/2025)</div>
+ <div class="report-row__desc">Q1 2025 client portfolio reporting. Available via the secure client portal.</div>
+ </div>
+ <span class="report-row__action">Portal →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">APR 5, 2025 · COMMENTARY</span>
+ <div>
+ <div class="report-row__title">Thoughts on the Tariff Panic</div>
+ <div class="report-row__desc">With markets down nearly 20%, the investment team explains why a bucket approach — not a panic-sell — is the right response.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">FEB 21, 2025 · VIDEO</span>
+ <div>
+ <div class="report-row__title">Artificial Intelligence: Challenges and Opportunities</div>
+ <div class="report-row__desc">10-minute explainer from Jay Skaalen, CFA, CFP®, on the layers of the AI economy and where investment opportunities actually live.</div>
+ </div>
+ <span class="report-row__action">Watch →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">FEB 7, 2025 · VIDEO</span>
+ <div>
+ <div class="report-row__title">Why Own Foreign Equities?</div>
+ <div class="report-row__desc">10-minute explainer from Justin McNichols, CFA, on the firm's most respected positions abroad.</div>
+ </div>
+ <span class="report-row__action">Watch →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JAN 26, 2025 · WHITEPAPER</span>
+ <div>
+ <div class="report-row__title">Investment Portfolio Risks, Trends, Technology, and Resolutions</div>
+ <div class="report-row__desc">Entering 2025 with risks (concentration), trends (rate normalization, inflation), and life-altering technology (AI).</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JAN 18, 2025</span>
+ <div>
+ <div class="report-row__title">Client Quarterly Statement (12/31/2024)</div>
+ <div class="report-row__desc">Year-end 2024 client portfolio reporting. Annual performance, tax-lot summary, and capital-gains forecast.</div>
+ </div>
+ <span class="report-row__action">Portal →</span>
+ </a>
+ <a class="report-row" href="#">
+ <span class="report-row__date">JAN 5, 2025 · WHITEPAPER</span>
+ <div>
+ <div class="report-row__title">U.S. Stocks: Highest Risk and Most Opportunities in Decades</div>
+ <div class="report-row__desc">2024's strong index returns were driven by a handful of names — and nearly half of all US stocks were down. A study in concentration.</div>
+ </div>
+ <span class="report-row__action">Open →</span>
+ </a>
+ </div>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Earlier archive</div>
+ <h2 class="section__title" style="font-size:40px">Selected prior years.</h2>
+ <p class="section__lead">A small selection from the deeper archive — going back to the 2020 cycle. Older letters available on request.</p>
+
+ <div class="report-list">
+ <a class="report-row" href="#"><span class="report-row__date">OCT 2024</span><div><div class="report-row__title">Election Year, Long-Term Lens</div><div class="report-row__desc">Why most market commentary the week before an election ages poorly — and why the firm's clients are spared from it.</div></div><span class="report-row__action">Open →</span></a>
+ <a class="report-row" href="#"><span class="report-row__date">JUL 2024</span><div><div class="report-row__title">Concentration in the S&P 500 — A Historical Perspective</div><div class="report-row__desc">When seven names drive an index, the index is no longer diversified. The firm's response.</div></div><span class="report-row__action">Open →</span></a>
+ <a class="report-row" href="#"><span class="report-row__date">APR 2024</span><div><div class="report-row__title">Rates Higher for Longer — What That Actually Means</div><div class="report-row__desc">A primer on the duration risk hidden in many "conservative" portfolios.</div></div><span class="report-row__action">Open →</span></a>
+ <a class="report-row" href="#"><span class="report-row__date">2023</span><div><div class="report-row__title">The Year of the AI Re-rating</div><div class="report-row__desc">Walking through the firm's positioning in semis, hyperscalers, and adjacent infrastructure.</div></div><span class="report-row__action">Open →</span></a>
+ <a class="report-row" href="#"><span class="report-row__date">2022</span><div><div class="report-row__title">When Stocks and Bonds Both Drew Down — Lessons</div><div class="report-row__desc">The 60/40 portfolio's worst year since 1937. What that taught us about real-asset sleeves.</div></div><span class="report-row__action">Open →</span></a>
+ <a class="report-row" href="#"><span class="report-row__date">2020</span><div><div class="report-row__title">COVID Drawdown — Letters from a 32-Day Bear</div><div class="report-row__desc">Six letters in eight weeks. The full archive of how the firm communicated through the panic.</div></div><span class="report-row__action">Archive →</span></a>
+ </div>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/service-area.html b/service-area.html
new file mode 100644
index 0000000..d38c356
--- /dev/null
+++ b/service-area.html
@@ -0,0 +1,274 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Service Area · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">San Francisco · Menlo Park · Within 50 miles</div>
+ <h1 class="hero__title">Rooted in the <em>Bay Area</em>.<br>Trusted across thirty states.</h1>
+ <p class="hero__sub">
+ Two physical offices anchor the practice — One Embarcadero in San Francisco and Middlefield
+ Road in Menlo Park. We meet most local clients in person at their preferred cadence; clients
+ beyond a comfortable drive are served by phone, video, and the occasional flight.
+ </p>
+ </div>
+ </section>
+
+ <!-- MAP -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Bay Area service map</div>
+ <h2 class="section__title">Within fifty miles of San Francisco.</h2>
+ <p class="section__lead">
+ Our two offices sit roughly thirty miles apart. Most clients within the inner ring (≤25 mi)
+ prefer in-person quarterly reviews; clients in the outer ring (25–50 mi) typically blend
+ in-person and video. Beyond that, we travel to you, or you to us.
+ </p>
+
+ <div class="map-shell">
+ <svg viewBox="0 0 1000 700" xmlns="http://www.w3.org/2000/svg">
+ <defs>
+ <pattern id="topo" patternUnits="userSpaceOnUse" width="14" height="14">
+ <circle cx="2" cy="2" r="0.6" fill="var(--line-strong)" opacity="0.18"/>
+ </pattern>
+ </defs>
+
+ <!-- Bay Area landmass abstraction -->
+ <path d="M 100 100 L 250 80 L 350 120 L 420 180 L 460 240 L 500 320 L 540 400 L 560 480 L 540 560 L 480 620 L 400 640 L 320 620 L 260 580 L 200 540 L 160 480 L 130 400 L 110 320 L 100 240 Z"
+ fill="var(--bg-alt)" stroke="var(--line-strong)" stroke-width="0.8"/>
+
+ <!-- East Bay landmass -->
+ <path d="M 580 100 L 720 90 L 840 110 L 900 160 L 920 240 L 900 320 L 870 400 L 820 480 L 760 540 L 680 580 L 620 580 L 580 540 L 560 480 L 560 400 L 580 320 L 600 240 L 590 160 Z"
+ fill="var(--bg-alt)" stroke="var(--line-strong)" stroke-width="0.8"/>
+
+ <!-- Bay water -->
+ <path d="M 460 240 L 540 200 L 580 220 L 600 280 L 580 360 L 560 440 L 540 500 L 520 540 L 500 500 L 480 420 L 470 340 Z"
+ fill="url(#topo)" opacity="0.6"/>
+
+ <!-- Topographic dot pattern overlay -->
+ <rect x="0" y="0" width="1000" height="700" fill="url(#topo)" opacity="0.4"/>
+
+ <!-- Radius rings around SF office -->
+ <circle cx="320" cy="280" r="80" fill="none" stroke="var(--accent)" stroke-width="1" stroke-dasharray="4 4" opacity="0.5"/>
+ <circle cx="320" cy="280" r="160" fill="none" stroke="var(--accent)" stroke-width="1" stroke-dasharray="6 6" opacity="0.4"/>
+ <circle cx="320" cy="280" r="240" fill="none" stroke="var(--accent)" stroke-width="1" stroke-dasharray="8 8" opacity="0.3"/>
+
+ <!-- Radius labels -->
+ <text x="320" y="195" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--accent)">10 mi</text>
+ <text x="320" y="115" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--accent)">25 mi</text>
+ <text x="320" y="35" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--accent)">50 mi</text>
+
+ <!-- SF office pin -->
+ <g>
+ <line x1="320" y1="280" x2="320" y2="240" stroke="var(--accent)" stroke-width="1.5"/>
+ <circle cx="320" cy="280" r="8" fill="var(--accent)"/>
+ <circle cx="320" cy="280" r="14" fill="var(--accent)" opacity="0.2"/>
+ <text x="335" y="265" font-family="Playfair Display" font-size="14" font-weight="700" fill="var(--ink)">San Francisco</text>
+ <text x="335" y="282" font-family="Inter" font-size="10" fill="var(--ink-soft)">One Embarcadero · Suite 4100</text>
+ </g>
+
+ <!-- Menlo Park office pin -->
+ <g>
+ <line x1="380" y1="460" x2="380" y2="430" stroke="var(--accent)" stroke-width="1.5"/>
+ <circle cx="380" cy="460" r="8" fill="var(--accent)"/>
+ <circle cx="380" cy="460" r="14" fill="var(--accent)" opacity="0.2"/>
+ <text x="395" y="455" font-family="Playfair Display" font-size="14" font-weight="700" fill="var(--ink)">Menlo Park</text>
+ <text x="395" y="472" font-family="Inter" font-size="10" fill="var(--ink-soft)">545 Middlefield · Suite 165</text>
+ </g>
+
+ <!-- Notable cities -->
+ <g font-family="Inter" font-size="10" fill="var(--ink-mute)">
+ <circle cx="280" cy="240" r="2" fill="var(--ink-mute)"/><text x="276" y="232" text-anchor="end">Sausalito</text>
+ <circle cx="280" cy="200" r="2" fill="var(--ink-mute)"/><text x="276" y="192" text-anchor="end">Tiburon</text>
+ <circle cx="240" cy="160" r="2" fill="var(--ink-mute)"/><text x="236" y="152" text-anchor="end">Mill Valley</text>
+ <circle cx="200" cy="120" r="2" fill="var(--ink-mute)"/><text x="196" y="112" text-anchor="end">Ross</text>
+ <circle cx="370" cy="320" r="2" fill="var(--ink-mute)"/><text x="375" y="324">Daly City</text>
+ <circle cx="395" cy="370" r="2" fill="var(--ink-mute)"/><text x="400" y="374">Burlingame</text>
+ <circle cx="375" cy="410" r="2" fill="var(--ink-mute)"/><text x="380" y="414">Hillsborough</text>
+ <circle cx="370" cy="510" r="2" fill="var(--ink-mute)"/><text x="375" y="514">Palo Alto</text>
+ <circle cx="430" cy="540" r="2" fill="var(--ink-mute)"/><text x="435" y="544">Atherton</text>
+ <circle cx="430" cy="580" r="2" fill="var(--ink-mute)"/><text x="435" y="584">Woodside</text>
+ <circle cx="480" cy="600" r="2" fill="var(--ink-mute)"/><text x="485" y="604">Portola Valley</text>
+ <circle cx="660" cy="240" r="2" fill="var(--ink-mute)"/><text x="665" y="244">Berkeley</text>
+ <circle cx="700" cy="290" r="2" fill="var(--ink-mute)"/><text x="705" y="294">Oakland</text>
+ <circle cx="730" cy="350" r="2" fill="var(--ink-mute)"/><text x="735" y="354">Piedmont</text>
+ <circle cx="760" cy="200" r="2" fill="var(--ink-mute)"/><text x="765" y="204">Lafayette</text>
+ <circle cx="800" cy="180" r="2" fill="var(--ink-mute)"/><text x="805" y="184">Orinda</text>
+ <circle cx="840" cy="240" r="2" fill="var(--ink-mute)"/><text x="845" y="244">Walnut Creek</text>
+ <circle cx="870" cy="320" r="2" fill="var(--ink-mute)"/><text x="875" y="324">Danville</text>
+ </g>
+
+ <!-- Compass -->
+ <g transform="translate(900,80)">
+ <circle cx="0" cy="0" r="22" fill="var(--bg-card)" stroke="var(--line-strong)"/>
+ <text x="0" y="-26" text-anchor="middle" font-family="JetBrains Mono" font-size="10" fill="var(--ink-soft)">N</text>
+ <line x1="0" y1="-12" x2="0" y2="12" stroke="var(--ink)" stroke-width="1"/>
+ <polygon points="0,-12 -4,-2 4,-2" fill="var(--accent)"/>
+ </g>
+
+ <!-- Scale -->
+ <g transform="translate(60,640)">
+ <line x1="0" y1="0" x2="160" y2="0" stroke="var(--ink-soft)" stroke-width="1"/>
+ <line x1="0" y1="-4" x2="0" y2="4" stroke="var(--ink-soft)" stroke-width="1"/>
+ <line x1="80" y1="-4" x2="80" y2="4" stroke="var(--ink-soft)" stroke-width="1"/>
+ <line x1="160" y1="-4" x2="160" y2="4" stroke="var(--ink-soft)" stroke-width="1"/>
+ <text x="0" y="20" font-family="JetBrains Mono" font-size="10" fill="var(--ink-soft)">0</text>
+ <text x="80" y="20" font-family="JetBrains Mono" font-size="10" fill="var(--ink-soft)" text-anchor="middle">25 mi</text>
+ <text x="160" y="20" font-family="JetBrains Mono" font-size="10" fill="var(--ink-soft)" text-anchor="middle">50 mi</text>
+ </g>
+ </svg>
+ </div>
+ </div>
+ </section>
+
+ <!-- TOWNS LIST -->
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Bay Area communities served</div>
+ <h2 class="section__title">A partial list of where our clients live.</h2>
+ <p class="section__lead">
+ Listed by approximate driving distance from One Embarcadero. We serve clients across the
+ Bay Area, the Peninsula, the East Bay, Marin, and the Monterey Bay corridor — and meet
+ them in person whenever the rhythm of their year permits.
+ </p>
+
+ <div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:48px">
+ <div>
+ <h4 style="font-size:11px;letter-spacing:2px;color:var(--accent);margin-bottom:16px">SAN FRANCISCO · 0–10 mi</h4>
+ <ul class="cities">
+ <li>Pacific Heights<span class="miles">0.8 mi</span></li>
+ <li>Presidio Heights<span class="miles">2.4 mi</span></li>
+ <li>Sea Cliff<span class="miles">4.1 mi</span></li>
+ <li>St. Francis Wood<span class="miles">5.7 mi</span></li>
+ <li>Telegraph Hill<span class="miles">0.6 mi</span></li>
+ <li>Daly City<span class="miles">9.4 mi</span></li>
+ <li>South San Francisco<span class="miles">10.0 mi</span></li>
+ </ul>
+ </div>
+
+ <div>
+ <h4 style="font-size:11px;letter-spacing:2px;color:var(--accent);margin-bottom:16px">PENINSULA · 10–30 mi</h4>
+ <ul class="cities">
+ <li>Burlingame<span class="miles">15 mi</span></li>
+ <li>Hillsborough<span class="miles">17 mi</span></li>
+ <li>San Mateo<span class="miles">20 mi</span></li>
+ <li>Belmont<span class="miles">22 mi</span></li>
+ <li>Atherton<span class="miles">28 mi</span></li>
+ <li>Menlo Park<span class="miles">30 mi</span></li>
+ <li>Palo Alto<span class="miles">32 mi</span></li>
+ <li>Woodside<span class="miles">29 mi</span></li>
+ <li>Portola Valley<span class="miles">32 mi</span></li>
+ <li>Los Altos Hills<span class="miles">34 mi</span></li>
+ </ul>
+ </div>
+
+ <div>
+ <h4 style="font-size:11px;letter-spacing:2px;color:var(--accent);margin-bottom:16px">MARIN · 5–25 mi</h4>
+ <ul class="cities">
+ <li>Sausalito<span class="miles">5 mi</span></li>
+ <li>Tiburon<span class="miles">9 mi</span></li>
+ <li>Belvedere<span class="miles">10 mi</span></li>
+ <li>Mill Valley<span class="miles">11 mi</span></li>
+ <li>Ross<span class="miles">14 mi</span></li>
+ <li>Larkspur<span class="miles">12 mi</span></li>
+ <li>Kentfield<span class="miles">15 mi</span></li>
+ <li>San Rafael<span class="miles">16 mi</span></li>
+ <li>Tiburon Peninsula<span class="miles">9 mi</span></li>
+ <li>Stinson Beach<span class="miles">23 mi</span></li>
+ </ul>
+ </div>
+
+ <div>
+ <h4 style="font-size:11px;letter-spacing:2px;color:var(--accent);margin-bottom:16px">EAST BAY · 10–35 mi</h4>
+ <ul class="cities">
+ <li>Berkeley<span class="miles">14 mi</span></li>
+ <li>Oakland (Hills)<span class="miles">16 mi</span></li>
+ <li>Piedmont<span class="miles">17 mi</span></li>
+ <li>Alameda<span class="miles">15 mi</span></li>
+ <li>Lafayette<span class="miles">22 mi</span></li>
+ <li>Orinda<span class="miles">21 mi</span></li>
+ <li>Moraga<span class="miles">22 mi</span></li>
+ <li>Walnut Creek<span class="miles">26 mi</span></li>
+ <li>Danville<span class="miles">32 mi</span></li>
+ <li>Blackhawk<span class="miles">35 mi</span></li>
+ </ul>
+ </div>
+
+ <div>
+ <h4 style="font-size:11px;letter-spacing:2px;color:var(--accent);margin-bottom:16px">SILICON VALLEY · 30–55 mi</h4>
+ <ul class="cities">
+ <li>Mountain View<span class="miles">37 mi</span></li>
+ <li>Los Altos<span class="miles">38 mi</span></li>
+ <li>Sunnyvale<span class="miles">42 mi</span></li>
+ <li>Cupertino<span class="miles">45 mi</span></li>
+ <li>Saratoga<span class="miles">48 mi</span></li>
+ <li>Los Gatos<span class="miles">50 mi</span></li>
+ <li>San Jose (Willow Glen)<span class="miles">48 mi</span></li>
+ <li>Almaden Valley<span class="miles">55 mi</span></li>
+ </ul>
+ </div>
+
+ <div>
+ <h4 style="font-size:11px;letter-spacing:2px;color:var(--accent);margin-bottom:16px">FURTHER AFIELD</h4>
+ <ul class="cities">
+ <li>Carmel-by-the-Sea<span class="miles">125 mi</span></li>
+ <li>Pebble Beach<span class="miles">125 mi</span></li>
+ <li>Napa<span class="miles">52 mi</span></li>
+ <li>St. Helena<span class="miles">68 mi</span></li>
+ <li>Sonoma<span class="miles">45 mi</span></li>
+ <li>Lake Tahoe (clients)<span class="miles">196 mi</span></li>
+ <li>Los Angeles area<span class="miles">383 mi</span></li>
+ <li>National (28 other states)<span class="miles">—</span></li>
+ </ul>
+ </div>
+ </div>
+
+ <p style="margin-top:48px;font-size:13px;color:var(--ink-mute);max-width:820px;line-height:1.7">
+ Distances approximate, calculated from One Embarcadero Center, San Francisco. We have served
+ clients in 30 states. Where geography prevents in-person meetings, we coordinate by video and
+ secure portal — and travel to you for material life events: a sale, a transfer, a passing.
+ </p>
+ </div>
+ </section>
+
+ <!-- HOW WE MEET -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">How we meet</div>
+ <h2 class="section__title">In person whenever the rhythm permits.</h2>
+
+ <div class="cards">
+ <div class="card">
+ <div class="card__num">Quarterly review</div>
+ <h3 class="card__title">In-person at our office.</h3>
+ <p class="card__body">A 60–90-minute quarterly conversation at One Embarcadero or Middlefield Road, including portfolio review, planning items, and life updates. Coffee provided.</p>
+ </div>
+ <div class="card">
+ <div class="card__num">On-site at home</div>
+ <h3 class="card__title">We come to you.</h3>
+ <p class="card__body">For clients in Marin, Carmel, Tahoe, or wherever the year takes you. We have met clients at home, at vacation properties, and even at a café in Carmel-by-the-Sea.</p>
+ </div>
+ <div class="card">
+ <div class="card__num">Secure video</div>
+ <h3 class="card__title">Anywhere, anytime.</h3>
+ <p class="card__body">Encrypted video review with screen-shared portfolio reporting. Useful for clients out of state, traveling, or coordinating multi-generational family meetings.</p>
+ </div>
+ </div>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/team.html b/team.html
new file mode 100644
index 0000000..3be751a
--- /dev/null
+++ b/team.html
@@ -0,0 +1,199 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Team · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Twenty stewards · Ten employee-owners</div>
+ <h1 class="hero__title">The people behind <em>your portfolio</em>.</h1>
+ <p class="hero__sub">
+ Average tenure: twenty-four years. Most of our team has navigated more market cycles
+ than the median Wall Street career has lasted. The CFP® you meet today is, statistically,
+ the CFP® you'll be working with in 2046.
+ </p>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Leadership</div>
+ <h2 class="section__title">The Board of Directors.</h2>
+
+ <div class="team-grid">
+ <article class="team-card">
+ <div class="team-card__avatar">JM</div>
+ <h3 class="team-card__name">Justin W. McNichols, CFA</h3>
+ <div class="team-card__role">Chief Investment Officer · Principal</div>
+ <p class="team-card__bio">
+ Justin joined the firm in 2000 and became principal that same year. He has more than
+ twenty-five years of investment management experience. Previously at Wells Fargo Asset
+ Management, he was head of equity research and a member of the national growth equity
+ team, managing over $1 billion in separate-account and mutual-fund assets. He authors
+ many of the firm's quarterly letters and is a frequent voice on the Osborne Partners
+ podcast.
+ </p>
+ </article>
+
+ <article class="team-card">
+ <div class="team-card__avatar">SV</div>
+ <h3 class="team-card__name">Sonia Von Berg</h3>
+ <div class="team-card__role">Chief Operating Officer · Director</div>
+ <p class="team-card__bio">
+ Sonia is in her fifteenth year at the firm — the last eight as COO. She oversees
+ operations, compliance, technology, and the entire client-service infrastructure.
+ Sonia has led the modernization of the firm's portal, reporting, and document
+ workflows while preserving the firm's hand-written ethos.
+ </p>
+ </article>
+
+ <article class="team-card">
+ <div class="team-card__avatar">CE</div>
+ <h3 class="team-card__name">Charles Else</h3>
+ <div class="team-card__role">Director</div>
+ <p class="team-card__bio">
+ Charles serves on the firm's Board of Directors alongside Justin and Sonia. He brings
+ decades of investment-management governance experience to the board's stewardship of
+ the firm's long-term direction.
+ </p>
+ </article>
+ </div>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Investment Team — Asset-Class Specialists</div>
+ <h2 class="section__title">Each sleeve, its own specialist.</h2>
+ <p class="section__lead">
+ The investment team is organized by asset class. Each specialist owns a sleeve of the portfolio
+ end-to-end — research, security selection, and the quarterly explainer video that goes with it.
+ </p>
+
+ <div class="team-grid">
+ <article class="team-card">
+ <div class="team-card__avatar">JS</div>
+ <h3 class="team-card__name">Jay Skaalen, CFA, CFP®</h3>
+ <div class="team-card__role">Foreign Equities · Multi-Asset</div>
+ <p class="team-card__bio">
+ Holds both the CFA charter and the CFP® designation. Leads the firm's foreign-equity
+ research and contributes to multi-asset construction. Frequent author of the firm's
+ explainer videos — including <em>Earnings Releases Decoded</em> and <em>Artificial
+ Intelligence: Challenges and Opportunities</em>. Author of the foundational 2018 paper
+ <em>Navigating Turbulent Waters</em>.
+ </p>
+ </article>
+
+ <article class="team-card">
+ <div class="team-card__avatar">BV</div>
+ <h3 class="team-card__name">Ben Viemeister, CFA</h3>
+ <div class="team-card__role">Fixed Income</div>
+ <p class="team-card__bio">
+ Owns the firm's fixed-income sleeve — duration, credit, municipal positioning, and
+ cash-equivalent strategy. Authored the 2022 fixed-income review during the worst year
+ on record for the asset class.
+ </p>
+ </article>
+
+ <article class="team-card">
+ <div class="team-card__avatar">JF</div>
+ <h3 class="team-card__name">Jack Fagan, CFA</h3>
+ <div class="team-card__role">Natural Resources & Alternatives</div>
+ <p class="team-card__bio">
+ Leads the firm's natural-resources and alternatives research — energy, metals,
+ agricultural commodities, and select alternative strategies. Authored the firm's
+ 2022 review on alternatives in a higher-rate, stronger-dollar environment.
+ </p>
+ </article>
+
+ <article class="team-card">
+ <div class="team-card__avatar">JR</div>
+ <h3 class="team-card__name">Jason Rodnick, CFA</h3>
+ <div class="team-card__role">Real Estate & REITs</div>
+ <p class="team-card__bio">
+ Specializes in publicly traded real estate, REIT positioning, and direct real-estate
+ adjacency in client portfolios. Authored the firm's 2022 review of real estate after
+ the worst year for the asset class since 2008.
+ </p>
+ </article>
+ </div>
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Wealth Counsel</div>
+ <h2 class="section__title">Your dedicated point of contact.</h2>
+ <p class="section__lead">
+ Each client family is matched with a Wealth Counselor — a CFP® practitioner whose job is to
+ understand every part of your financial life, coordinate every advisor in it, and answer
+ the phone whenever you call.
+ </p>
+
+ <div class="team-grid">
+ <article class="team-card">
+ <div class="team-card__avatar">TP</div>
+ <h3 class="team-card__name">Tom Piro, CFP®</h3>
+ <div class="team-card__role">Wealth Counselor · Enrolled Agent</div>
+ <p class="team-card__bio">
+ Tom is a Certified Financial Planner™ practitioner and an IRS Enrolled Agent — a rare
+ combination that lets him advise on tax strategy without referral. He guides families
+ through every chapter: home purchase, business decisions, RMDs, inherited IRAs,
+ generational gifting. Reachable directly at <em>tom@osbornepartners.com</em>.
+ </p>
+ </article>
+
+ <article class="team-card">
+ <div class="team-card__avatar">JS</div>
+ <h3 class="team-card__name">Jay Skaalen, CFA, CFP®</h3>
+ <div class="team-card__role">Investment Team · Wealth Counselor</div>
+ <p class="team-card__bio">
+ Jay holds both the CFA charter and the CFP® designation. He is a frequent author of the
+ firm's quarterly research and host of multiple Osborne Partners explainer videos —
+ including <em>Earnings Releases Decoded</em> and <em>Artificial Intelligence:
+ Challenges and Opportunities</em>.
+ </p>
+ </article>
+
+ <article class="team-card">
+ <div class="team-card__avatar">RK</div>
+ <h3 class="team-card__name">Roohi Khan</h3>
+ <div class="team-card__role">Client Service Associate</div>
+ <p class="team-card__bio">
+ Roo handles the operational rhythm of the client relationship — RMD processing, money
+ movements, custodian coordination, document delivery. The cheerful first reply on most
+ client emails comes from Roo.
+ </p>
+ </article>
+ </div>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container" style="max-width:880px;text-align:center">
+ <div class="section__eyebrow">In aggregate</div>
+ <h2 class="section__title" style="margin-left:auto;margin-right:auto">Twenty stewards. One method.</h2>
+ <p class="section__lead" style="margin-left:auto;margin-right:auto">
+ Beyond the people on this page sit a research team, a portfolio-construction team, an
+ operations team, and a compliance team — twenty professionals in total, ten of them
+ employee-owners of the firm. We do not have any non-equity outside investors. The firm
+ answers to its clients and to itself.
+ </p>
+ <a href="contact.html" class="btn">Schedule a meeting →</a>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
diff --git a/themes.html b/themes.html
new file mode 100644
index 0000000..2f6e839
--- /dev/null
+++ b/themes.html
@@ -0,0 +1,191 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Theme Gallery · Osborne Partners Redesign</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+<style>
+ .theme-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(360px,1fr)); gap: 32px; }
+ .theme-tile {
+ border-radius: var(--radius); overflow: hidden;
+ border: 1px solid var(--line); background: var(--bg-card);
+ transition: transform 0.3s ease, box-shadow 0.3s ease;
+ display: flex; flex-direction: column;
+ }
+ .theme-tile:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
+ .theme-tile__hero {
+ aspect-ratio: 16/10; position: relative; overflow: hidden;
+ display: flex; align-items: flex-end; padding: 32px;
+ color: #fff;
+ }
+ .theme-tile__hero h3 {
+ font-family: var(--font-display); font-size: 32px; font-weight: 700;
+ line-height: 1.1; margin-bottom: 4px;
+ }
+ .theme-tile__hero p { font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; opacity: 0.85; }
+ .theme-tile__num {
+ position: absolute; top: 24px; right: 24px;
+ font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 2px;
+ background: rgba(255,255,255,0.18); padding: 4px 10px; border-radius: 4px;
+ color: #fff;
+ }
+ .theme-tile__body { padding: 24px 28px 28px; }
+ .theme-tile__desc { font-size: 14px; line-height: 1.6; color: var(--ink-soft); margin-bottom: 16px; min-height: 64px; }
+ .theme-tile__pages {
+ display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px;
+ font-size: 11px;
+ }
+ .theme-tile__pages a {
+ padding: 4px 10px; border: 1px solid var(--line-strong); border-radius: 999px;
+ color: var(--ink-soft);
+ }
+ .theme-tile__pages a:hover { background: var(--ink); color: var(--bg); }
+ .theme-tile__cta { display: flex; gap: 8px; }
+ .theme-tile__cta .btn { padding: 12px 18px; font-size: 12px; }
+
+ /* Theme-specific hero backgrounds for tiles */
+ .hero-heritage { background: linear-gradient(180deg,#0b1a35,#0a1428); }
+ .hero-heritage h3, .hero-heritage p { font-family: 'Playfair Display', serif; }
+ .hero-heritage h3 { color: #ffffff; }
+ .hero-heritage p { color: #bfa15a; }
+
+ .hero-whisper { background: #fafaf7; color: #0a0a0a !important; }
+ .hero-whisper h3 { font-family: 'Inter', sans-serif; font-weight: 200; font-size: 48px !important; color: #0a0a0a; }
+ .hero-whisper p { color: #888; }
+
+ .hero-broadsheet { background: #f4ede0; }
+ .hero-broadsheet h3 { font-family: 'Playfair Display', serif; color: #1a1a1a; font-weight: 900; }
+ .hero-broadsheet p { color: #8a3a1a; }
+
+ .hero-onyx { background: radial-gradient(circle at 30% 0%, rgba(212,175,106,0.15), transparent 60%), #0a0908; }
+ .hero-onyx h3 { font-family: 'Playfair Display', serif; color: #f5e8c8; font-weight: 900; }
+ .hero-onyx p { color: #d4af6a; }
+
+ .hero-pacific { background: linear-gradient(135deg,#f3eddf 0%,#e8b878 50%,#7a8a72 100%); }
+ .hero-pacific h3 { font-family: 'Cormorant Garamond', serif; color: #2a3a2c; font-weight: 300; font-size: 48px !important; }
+ .hero-pacific p { color: #a87a3a; }
+
+ .hero-atelier { background: linear-gradient(180deg, #0a0e14 0%, #0e141d 100%); }
+ .hero-atelier h3 { font-family: 'Space Grotesk', sans-serif; color: #e8eef5; font-weight: 700; }
+ .hero-atelier p { color: #3aa9ff; font-family: 'JetBrains Mono', monospace; }
+
+ .hero-loro { background: #e8e1d4; }
+ .hero-loro h3 { font-family: 'Cormorant Garamond', serif; color: #3a3328; font-weight: 300; font-size: 48px !important; }
+ .hero-loro p { color: #7a6a4a; }
+
+ .hero-monolith { background: #e6e3dc; border-bottom: 8px solid #1a1a1a; }
+ .hero-monolith h3 { font-family: 'Inter', sans-serif; color: #1a1a1a; font-weight: 800; text-transform: uppercase; letter-spacing: -0.02em; }
+ .hero-monolith p { color: #1a1a1a; }
+
+ .hero-archive { background: #f4ecd8; border: 1px solid #5a1a22; }
+ .hero-archive h3 { font-family: 'Playfair Display', serif; color: #5a1a22; font-weight: 700; }
+ .hero-archive p { color: #5a1a22; }
+
+ .hero-aurora { background: linear-gradient(135deg, #f6f4ef, #c8b8e0 70%, #5a3a8a 100%); }
+ .hero-aurora h3 { font-family: 'Playfair Display', serif; color: #1a1530; font-weight: 300; font-size: 48px !important; }
+ .hero-aurora p { color: #5a3a8a; }
+</style>
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Ten directions · Pick one and click through</div>
+ <h1 class="hero__title">The <em>Theme Gallery</em>.</h1>
+ <p class="hero__sub">
+ Each tile below previews one of ten distinct visual directions for the site. Click any
+ page link inside a tile to enter the full multi-page experience locked to that theme. Use
+ the floating picker (bottom-right) to flip themes from any page. Your selection persists
+ across the site.
+ </p>
+ </div>
+ </section>
+
+ <section class="section">
+ <div class="container">
+ <div class="theme-grid" id="themeGrid"></div>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+<script>
+ // Build the gallery tiles
+ const themes = [
+ { id:'heritage', name:'Heritage Navy', tag:'OLD MONEY · TRUST', desc:'Deep navy and gilt gold. Roman numerals, serif gravitas, "Est. MCMXXXVII." For the family who values continuity above novelty.' },
+ { id:'whisper', name:'Whisper', tag:'SWISS MINIMALISM', desc:'Pure white, ultra-thin Inter Light, oceans of whitespace. The wealth manager that whispers, never shouts.' },
+ { id:'broadsheet', name:'Broadsheet', tag:'EDITORIAL · WSJ-GRADE', desc:'Three-column body copy, drop caps, a printed-paper masthead. Reads like a serious magazine — because the work is.' },
+ { id:'onyx', name:'Onyx', tag:'BLACK-TIE LUXURY', desc:'Pure black plus champagne gold, dramatic Playfair at hero scale. "By referral, by appointment."' },
+ { id:'pacific', name:'Pacific', tag:'WARM WEST COAST', desc:'Cream, sage, and brass. Cormorant Garamond. The Pacific Heights aesthetic — home-grown wealth, in good company.' },
+ { id:'atelier', name:'Atelier', tag:'TECH · DATA-FORWARD', desc:'Dark UI, mono digits, live performance. For the founders, operators, and equity-rich families who want their numbers visible.' },
+ { id:'loro', name:'Loro', tag:'QUIET LUXURY · CASHMERE', desc:'Muted earth tones, tasteful Cormorant Light, monogrammed crest. Loro Piana energy in a wealth manager.' },
+ { id:'monolith', name:'Monolith', tag:'ARCHITECTURAL · BRUTALIST', desc:'Visible 12-column grid, Inter at 280pt, stone palette. Monumental scale for a firm that has lasted nearly a century.' },
+ { id:'archive', name:'Archive', tag:'VINTAGE ARISTOCRACY', desc:'Burgundy and parchment, ornamental borders, "Anno MCMXXXVII," and ❦ fleurons. Patrimony, properly presented.' },
+ { id:'aurora', name:'Aurora', tag:'REFINED FINTECH · GLASS', desc:'Soft purple and peach gradients, frosted-glass cards, live performance chart. Modern but unmistakably elegant.' }
+ ];
+
+ const pages = [
+ { href:'index.html', label:'Home' },
+ { href:'history.html', label:'History' },
+ { href:'team.html', label:'Team' },
+ { href:'philosophy.html', label:'Philosophy' },
+ { href:'performance.html', label:'Performance' },
+ { href:'service-area.html', label:'Service Area' },
+ { href:'clients.html', label:'Clients' },
+ { href:'insights.html', label:'Insights' },
+ { href:'videos.html', label:'Videos' },
+ { href:'reports.html', label:'Reports' },
+ { href:'contact.html', label:'Contact' }
+ ];
+
+ function buildTile(theme, i) {
+ const num = String(i+1).padStart(2,'0');
+ const pageLinks = pages.map(p =>
+ `<a href="${p.href}?theme=${theme.id}" data-theme-link="${theme.id}">${p.label}</a>`
+ ).join('');
+
+ return `
+ <div class="theme-tile">
+ <div class="theme-tile__hero hero-${theme.id}">
+ <span class="theme-tile__num">${num} / 10</span>
+ <div>
+ <h3>Osborne Partners</h3>
+ <p>${theme.tag}</p>
+ </div>
+ </div>
+ <div class="theme-tile__body">
+ <h4 style="font-family:var(--font-display);font-size:22px;margin-bottom:8px;font-weight:600">${theme.name}</h4>
+ <p class="theme-tile__desc">${theme.desc}</p>
+ <div class="theme-tile__pages">${pageLinks}</div>
+ <div class="theme-tile__cta">
+ <a href="index.html?theme=${theme.id}" class="btn" data-theme-link="${theme.id}">Enter site →</a>
+ <button class="btn btn--ghost" onclick="setTheme('${theme.id}')">Apply theme</button>
+ </div>
+ </div>
+ </div>
+ `;
+ }
+
+ document.getElementById('themeGrid').innerHTML = themes.map(buildTile).join('');
+
+ // Apply theme + persist when entering site
+ document.querySelectorAll('[data-theme-link]').forEach(el => {
+ el.addEventListener('click', () => {
+ try { localStorage.setItem('opcm-theme', el.dataset.themeLink); } catch(e){}
+ });
+ });
+
+ function setTheme(id) {
+ try { localStorage.setItem('opcm-theme', id); } catch(e){}
+ document.documentElement.dataset.theme = id;
+ document.querySelectorAll('.theme-swatch').forEach(s => s.classList.toggle('is-active', s.dataset.swatch===id));
+ }
+</script>
+</body>
+</html>
diff --git a/videos.html b/videos.html
new file mode 100644
index 0000000..6b18f59
--- /dev/null
+++ b/videos.html
@@ -0,0 +1,495 @@
+<!doctype html>
+<html lang="en" data-theme="heritage">
+<head>
+<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Videos · Osborne Partners</title>
+<link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&family=Libre+Caslon+Text:wght@400;700&family=Playfair+Display:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="assets/theme.css">
+<style>
+ .video-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(360px,1fr)); gap: 24px; }
+ .video-card {
+ background: var(--bg-card); border: 1px solid var(--line);
+ border-radius: var(--radius); overflow: hidden;
+ transition: transform 0.2s, box-shadow 0.3s;
+ display: flex; flex-direction: column;
+ }
+ .video-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
+ .video-card__thumb {
+ aspect-ratio: 16/9; position: relative; overflow: hidden;
+ background: linear-gradient(135deg, var(--accent), var(--accent-soft));
+ display: grid; place-items: center;
+ }
+ .video-card__thumb::before {
+ content: ''; position: absolute; inset: 0;
+ background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.55) 100%);
+ }
+ .video-card__play {
+ width: 64px; height: 64px; border-radius: 50%;
+ background: rgba(255,255,255,0.95);
+ display: grid; place-items: center;
+ z-index: 2; transition: transform 0.2s;
+ }
+ .video-card:hover .video-card__play { transform: scale(1.1); }
+ .video-card__play::after {
+ content: ''; width: 0; height: 0;
+ border-left: 18px solid #1a1530;
+ border-top: 11px solid transparent;
+ border-bottom: 11px solid transparent;
+ margin-left: 4px;
+ }
+ .video-card__duration {
+ position: absolute; bottom: 10px; right: 10px; z-index: 2;
+ background: rgba(0,0,0,0.75); color: #fff;
+ font-family: 'JetBrains Mono', monospace; font-size: 11px;
+ padding: 4px 8px; border-radius: 4px; letter-spacing: 0.5px;
+ }
+ .video-card__series-badge {
+ position: absolute; top: 10px; left: 10px; z-index: 2;
+ background: rgba(255,255,255,0.95); color: #1a1530;
+ font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
+ padding: 4px 8px; border-radius: 4px;
+ }
+ .video-card__body { padding: 24px; flex: 1; display: flex; flex-direction: column; }
+ .video-card__date {
+ font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 1px;
+ color: var(--ink-mute); margin-bottom: 8px;
+ }
+ .video-card__title {
+ font-family: var(--font-display); font-size: 22px; font-weight: 600;
+ line-height: 1.25; margin-bottom: 12px;
+ }
+ .video-card__desc {
+ font-size: 14px; line-height: 1.6; color: var(--ink-soft); flex: 1;
+ }
+ .video-card__author {
+ margin-top: 16px; padding-top: 16px;
+ border-top: 1px solid var(--line);
+ display: flex; align-items: center; gap: 10px;
+ font-size: 12px; color: var(--ink-mute);
+ }
+ .video-card__author-dot {
+ width: 28px; height: 28px; border-radius: 50%;
+ background: var(--accent); color: var(--accent-ink);
+ display: grid; place-items: center;
+ font-family: var(--font-display); font-size: 11px; font-weight: 700;
+ }
+
+ /* featured video (top) */
+ .video-featured {
+ display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px;
+ align-items: center; margin-bottom: var(--space-lg);
+ }
+ .video-featured__thumb {
+ aspect-ratio: 16/9; border-radius: var(--radius); overflow: hidden;
+ background: linear-gradient(135deg, var(--accent), var(--accent-soft));
+ display: grid; place-items: center; position: relative;
+ }
+ .video-featured__thumb::before {
+ content:''; position:absolute; inset:0;
+ background: radial-gradient(circle at center, rgba(255,255,255,0.15), transparent 70%);
+ }
+ .video-featured__play {
+ width: 96px; height: 96px; border-radius: 50%;
+ background: rgba(255,255,255,0.95);
+ display: grid; place-items: center; z-index: 2;
+ }
+ .video-featured__play::after {
+ content: ''; width: 0; height: 0;
+ border-left: 28px solid #1a1530;
+ border-top: 16px solid transparent;
+ border-bottom: 16px solid transparent;
+ margin-left: 6px;
+ }
+
+ @media (max-width: 880px) { .video-featured { grid-template-columns: 1fr; } }
+
+ /* series strip */
+ .series-strip {
+ display: grid; grid-template-columns: repeat(6, 1fr);
+ gap: 12px;
+ background: var(--bg-card);
+ border: 1px solid var(--line);
+ border-radius: var(--radius);
+ padding: 24px;
+ margin-bottom: var(--space-lg);
+ }
+ .series-strip__head { grid-column: 1 / -1; margin-bottom: 8px; }
+ .series-step {
+ text-align: center;
+ padding: 16px 12px;
+ border: 1px solid var(--line);
+ border-radius: var(--radius-sm);
+ transition: background 0.2s, border-color 0.2s;
+ cursor: pointer;
+ }
+ .series-step:hover { background: var(--bg-alt); border-color: var(--accent); }
+ .series-step .num {
+ font-family: 'JetBrains Mono', monospace;
+ font-size: 11px; color: var(--accent); letter-spacing: 1px;
+ }
+ .series-step .topic {
+ font-family: var(--font-display); font-weight: 600;
+ font-size: 14px; line-height: 1.3; margin-top: 8px;
+ }
+ .series-step .who {
+ font-size: 11px; color: var(--ink-mute); margin-top: 4px;
+ }
+ @media (max-width: 980px) { .series-strip { grid-template-columns: repeat(3,1fr); } }
+ @media (max-width: 600px) { .series-strip { grid-template-columns: repeat(2,1fr); } }
+</style>
+</head>
+<body>
+<div id="site-header-slot"></div>
+
+<main>
+ <section class="hero">
+ <div class="container">
+ <div class="hero__eyebrow">Video archive · 30+ explainers since 2022</div>
+ <h1 class="hero__title">Watch the <em>investment team</em><br>think out loud.</h1>
+ <p class="hero__sub">
+ Most of what's published about markets is noise. The Osborne Partners investment team
+ records a steady stream of short, plain-English explainers — five to ten minutes each —
+ on the questions actually moving client portfolios. The full archive lives below.
+ </p>
+ </div>
+ </section>
+
+ <!-- FEATURED VIDEO -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Latest · February 2026</div>
+ <div class="video-featured">
+ <a class="video-featured__thumb" href="#">
+ <span class="video-featured__play"></span>
+ <span class="video-card__duration" style="font-size:13px;padding:6px 12px">10:00</span>
+ </a>
+ <div>
+ <h2 class="section__title" style="font-size:40px;margin-bottom:16px">Earnings Releases Decoded</h2>
+ <p style="font-size:17px;line-height:1.6;color:var(--ink-soft);margin-bottom:24px">
+ Ever wonder how a single quarterly update from a publicly traded company can shift the
+ entire market? In just ten minutes, Jay Skaalen, CFA, CFP®, breaks down the mechanics
+ of earnings season — guidance vs. actuals, sentiment vs. fundamentals, and how the
+ firm's investment process turns the chaos into actionable signal.
+ </p>
+ <div style="display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink-mute)">
+ <div class="video-card__author-dot" style="width:36px;height:36px;font-size:13px">JS</div>
+ <div>
+ <div style="color:var(--ink);font-weight:600">Jay Skaalen, CFA, CFP®</div>
+ <div>Investment Team · Wealth Counselor</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <!-- 6-PART SERIES (2022 Review / 2023 Preview) -->
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Six-part series · January–March 2023</div>
+ <h2 class="section__title">2022 Review & 2023 Preview.</h2>
+ <p class="section__lead">
+ After the worst market year since 2008, the investment team produced a six-part
+ deep-dive — one specialist per asset class. The full series remains in our public
+ archive as a reference for how the firm thinks about each sleeve of the portfolio.
+ </p>
+
+ <div class="series-strip">
+ <div class="series-strip__head"></div>
+ <div class="series-step"><div class="num">01</div><div class="topic">Investment Team Overview</div><div class="who">10 min · The team</div></div>
+ <div class="series-step"><div class="num">02</div><div class="topic">Domestic Equities</div><div class="who">Investment Team</div></div>
+ <div class="series-step"><div class="num">03</div><div class="topic">Foreign Equities</div><div class="who">Jay Skaalen, CFA, CFP®</div></div>
+ <div class="series-step"><div class="num">04</div><div class="topic">Fixed Income</div><div class="who">Ben Viemeister, CFA</div></div>
+ <div class="series-step"><div class="num">05</div><div class="topic">Natural Resources & Alternatives</div><div class="who">Jack Fagan, CFA</div></div>
+ <div class="series-step"><div class="num">06</div><div class="topic">Real Estate</div><div class="who">Jason Rodnick, CFA</div></div>
+ </div>
+ </div>
+ </section>
+
+ <!-- VIDEO ARCHIVE GRID -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">The full archive</div>
+ <h2 class="section__title">Every video the firm has shared.</h2>
+ <p class="section__lead">
+ Newest first. Click any tile to play; click an author to read more from that voice.
+ </p>
+
+ <div class="video-grid">
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#0b1a35,#bfa15a)">
+ <span class="video-card__series-badge">Latest</span>
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">FEB 26, 2026</div>
+ <h3 class="video-card__title">Earnings Releases Decoded</h3>
+ <p class="video-card__desc">How a single quarterly update from a public company can shift the whole market — and how the firm separates noise from signal during earnings season.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">JS</span><span>Jay Skaalen, CFA, CFP®</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#5a3a8a,#c8b8e0)">
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">FEB 21, 2025</div>
+ <h3 class="video-card__title">Artificial Intelligence: Challenges and Opportunities</h3>
+ <p class="video-card__desc">AI has been a popular topic in the media — but where are the actual investment opportunities? A walk through the layers of the AI economy.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">JS</span><span>Jay Skaalen, CFA, CFP®</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#0a0908,#d4af6a)">
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">FEB 7, 2025</div>
+ <h3 class="video-card__title">Why Own Foreign Equities?</h3>
+ <p class="video-card__desc">Most investors have little interest in foreign equities given recent underperformance. Justin explains why several of the firm's most-respected positions are domiciled abroad.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">JM</span><span>Justin McNichols, CFA</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#1a1a1a,#8a8478)">
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">8:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">NOV 8, 2024</div>
+ <h3 class="video-card__title">The Election is Over… Now What?</h3>
+ <p class="video-card__desc">Elections are emotional events. Setting that aside is the only way to assess how results actually impact a portfolio and a financial future.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">OP</span><span>Investment Team</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#2a3a2c,#a87a3a)">
+ <span class="video-card__series-badge">Series</span>
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">MAR 1, 2023 · PART 6/6</div>
+ <h3 class="video-card__title">Real Estate · 2022 Review & 2023 Preview</h3>
+ <p class="video-card__desc">2022 was the worst year for real estate since 2008. With rates rising, the firm's real-estate specialist walks through the implications for portfolios.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">JR</span><span>Jason Rodnick, CFA</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#3a1a14,#8a3a3a)">
+ <span class="video-card__series-badge">Series</span>
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">FEB 22, 2023 · PART 5/6</div>
+ <h3 class="video-card__title">Natural Resources & Alternatives · 2022 Review & 2023 Preview</h3>
+ <p class="video-card__desc">A year defined by higher rates, a stronger dollar, and a highly volatile commodities complex. Where the firm sees opportunity in 2023.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">JF</span><span>Jack Fagan, CFA</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#0a0e14,#3aa9ff)">
+ <span class="video-card__series-badge">Series</span>
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">FEB 15, 2023 · PART 4/6</div>
+ <h3 class="video-card__title">Fixed Income · 2022 Review & 2023 Preview</h3>
+ <p class="video-card__desc">2022 was tempestuous for what is supposed to be a stable asset class. Fixed income had its worst year on record. Ben Viemeister surveys the wreckage and the recovery.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">BV</span><span>Ben Viemeister, CFA</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#5a3a8a,#8a6abf)">
+ <span class="video-card__series-badge">Series</span>
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">FEB 3, 2023 · PART 3/6</div>
+ <h3 class="video-card__title">Foreign Equities · 2022 Review & 2023 Preview</h3>
+ <p class="video-card__desc">A challenging year for nearly every asset class. Investors found no relief abroad — but the year-end positioning created opportunity for 2023.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">JS</span><span>Jay Skaalen, CFA, CFP®</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#0b1a35,#1a2b48)">
+ <span class="video-card__series-badge">Series</span>
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">JAN 24, 2023 · PART 2/6</div>
+ <h3 class="video-card__title">Domestic Equities · 2022 Review & 2023 Preview</h3>
+ <p class="video-card__desc">Diving deeper into US equity positioning after the second-worst year for the asset class since 2008. Where the firm rebalanced and why.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">OP</span><span>Investment Team</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#e8e1d4,#7a6a4a)">
+ <span class="video-card__series-badge">Series</span>
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">10:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">JAN 18, 2023 · PART 1/6</div>
+ <h3 class="video-card__title">2022 Review & 2023 Preview · Investment Team Overview</h3>
+ <p class="video-card__desc">2022 was the worst year for markets since 2008 — high inflation, rising rates, war, and a closed China. The investment team's framework for navigating it all.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">OP</span><span>Investment Team</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#0a0908,#5a3a14)">
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">8:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">NOV 29, 2022</div>
+ <h3 class="video-card__title">Lessons From the Implosion of Speculative Assets</h3>
+ <p class="video-card__desc">Crypto, SPACs, meme stocks — speculative bubbles peaked in 2021 and popped in 2022. How they were created, what we said at the time, and what to take from it.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">OP</span><span>Investment Team</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#3aa9ff,#7ac7ff)">
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">7:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">SEP 29, 2022</div>
+ <h3 class="video-card__title">Investors Shift Their Focus</h3>
+ <p class="video-card__desc">When does this bear market end? Bear markets average eleven months — we are now ten in. On average the S&P 500 is 44% higher a year after a major low.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">OP</span><span>Investment Team</span></div>
+ </div>
+ </article>
+
+ <article class="video-card">
+ <a class="video-card__thumb" href="#" style="background:linear-gradient(135deg,#8a3a1a,#bfa15a)">
+ <span class="video-card__play"></span>
+ <span class="video-card__duration">5:00</span>
+ </a>
+ <div class="video-card__body">
+ <div class="video-card__date">AUG 12, 2022 · MARKET UPDATE</div>
+ <h3 class="video-card__title">Consumer Price Index — Has Inflation Peaked?</h3>
+ <p class="video-card__desc">The latest CPI release confirmed the firm's belief that inflation had previously peaked. A focused five-minute update from the Chief Investment Officer.</p>
+ <div class="video-card__author"><span class="video-card__author-dot">JM</span><span>Justin McNichols, CFA</span></div>
+ </div>
+ </article>
+
+ </div>
+ </div>
+ </section>
+
+ <!-- WHITEPAPERS / "MASTERING YOUR WEALTH" SERIES -->
+ <section class="section section--alt">
+ <div class="container">
+ <div class="section__eyebrow">Mastering Your Wealth · Whitepaper series</div>
+ <h2 class="section__title">Strategies for the decisions<br>that outlive their decision-makers.</h2>
+ <p class="section__lead">
+ A long-form companion to the video archive. The "Mastering Your Wealth" series is a
+ collection of in-depth whitepapers Tom Piro, CFP®, has written for clients facing
+ complex, infrequent financial decisions.
+ </p>
+
+ <div class="cards">
+ <div class="card">
+ <div class="card__num">JUN 2024</div>
+ <h3 class="card__title">Optimize Your Concentrated Stock</h3>
+ <p class="card__body">A complete framework for founders and executives sitting on concentrated equity positions — from 10b5-1 plans to exchange funds to charitable strategies.</p>
+ <a href="#" class="card__cta">Read the paper →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">MAY 2024</div>
+ <h3 class="card__title">Why Typical Investors Underperform — And How To Set Yourself Up For Success</h3>
+ <p class="card__body">The behavioral, structural, and tax reasons most investors trail the indexes — and the disciplines that close the gap, decade after decade.</p>
+ <a href="#" class="card__cta">Read the paper →</a>
+ </div>
+ <div class="card">
+ <div class="card__num">APR 2018</div>
+ <h3 class="card__title">Navigating Turbulent Waters</h3>
+ <p class="card__body">A foundational paper from Jay Skaalen, CFA, on how multi-asset construction softens drawdowns and enables disciplined rebalancing through the worst markets.</p>
+ <a href="#" class="card__cta">Read the paper →</a>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <!-- BY VOICE -->
+ <section class="section">
+ <div class="container">
+ <div class="section__eyebrow">Browse by voice</div>
+ <h2 class="section__title">Each specialist, on their patch.</h2>
+
+ <div class="cards" style="grid-template-columns:repeat(auto-fit,minmax(220px,1fr))">
+ <a href="#" class="card" style="text-decoration:none">
+ <div class="team-card__avatar" style="margin-bottom:14px;width:56px;height:56px;font-size:18px">JM</div>
+ <h3 class="card__title">Justin McNichols, CFA</h3>
+ <p class="card__body">CIO · Foreign equities, CPI, market commentary. <strong style="color:var(--accent)">3 videos</strong></p>
+ </a>
+ <a href="#" class="card" style="text-decoration:none">
+ <div class="team-card__avatar" style="margin-bottom:14px;width:56px;height:56px;font-size:18px">JS</div>
+ <h3 class="card__title">Jay Skaalen, CFA, CFP®</h3>
+ <p class="card__body">Earnings, AI, foreign equities, multi-asset. <strong style="color:var(--accent)">4 videos</strong></p>
+ </a>
+ <a href="#" class="card" style="text-decoration:none">
+ <div class="team-card__avatar" style="margin-bottom:14px;width:56px;height:56px;font-size:18px">BV</div>
+ <h3 class="card__title">Ben Viemeister, CFA</h3>
+ <p class="card__body">Fixed income specialist. <strong style="color:var(--accent)">1 video</strong></p>
+ </a>
+ <a href="#" class="card" style="text-decoration:none">
+ <div class="team-card__avatar" style="margin-bottom:14px;width:56px;height:56px;font-size:18px">JF</div>
+ <h3 class="card__title">Jack Fagan, CFA</h3>
+ <p class="card__body">Natural resources & alternatives. <strong style="color:var(--accent)">1 video</strong></p>
+ </a>
+ <a href="#" class="card" style="text-decoration:none">
+ <div class="team-card__avatar" style="margin-bottom:14px;width:56px;height:56px;font-size:18px">JR</div>
+ <h3 class="card__title">Jason Rodnick, CFA</h3>
+ <p class="card__body">Real estate & REIT positioning. <strong style="color:var(--accent)">1 video</strong></p>
+ </a>
+ <a href="#" class="card" style="text-decoration:none">
+ <div class="team-card__avatar" style="margin-bottom:14px;width:56px;height:56px;font-size:18px">TP</div>
+ <h3 class="card__title">Tom Piro, CFP®</h3>
+ <p class="card__body">Wealth Counselor · Mastering Your Wealth whitepaper series. <strong style="color:var(--accent)">3 papers</strong></p>
+ </a>
+ </div>
+ </div>
+ </section>
+
+ <section class="section section--alt">
+ <div class="container" style="text-align:center;max-width:780px">
+ <div class="section__eyebrow">Subscribe</div>
+ <h2 class="section__title" style="margin-left:auto;margin-right:auto">New videos, by email.</h2>
+ <p class="section__lead" style="margin-left:auto;margin-right:auto">
+ Roughly one a month. Quarterly letters quarterly. Never a sales pitch.
+ </p>
+ <form style="display:flex;gap:8px;justify-content:center;max-width:480px;margin:0 auto">
+ <input type="email" placeholder="you@email.com" style="flex:1;padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:14px">
+ <button type="submit" class="btn">Subscribe →</button>
+ </form>
+ </div>
+ </section>
+</main>
+
+<div id="site-footer-slot"></div>
+<div id="theme-picker-slot"></div>
+<script src="assets/site.js"></script>
+</body>
+</html>
(oldest)
·
back to Osborne Redesign
·
Add rel=noopener noreferrer to target=_blank link in compare aa28a5a →