30 lines
5.0 KiB
HTML
30 lines
5.0 KiB
HTML
<!doctype html><html lang="en"><head><meta charset="utf-8">
|
||
<link rel="stylesheet" href="../styles.css"><style>
|
||
.g{display:grid;grid-template-columns:1fr 1fr;gap:14px}
|
||
.c{padding:20px 22px 22px}
|
||
.il{width:120px;height:84px;margin:0 0 12px -6px}
|
||
.c h3{font-family:var(--display);font-weight:600;font-size:21px;letter-spacing:-.02em;line-height:1.15;margin-bottom:8px}
|
||
.c p{font-size:15px;line-height:1.5;color:var(--muted)}
|
||
</style></head><body><div class="canvas" id="shot"><div class="g"><div class="card c"><div class="il"><svg viewBox="0 0 120 84" fill="none" stroke="#1c5d4c" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><g transform="rotate(-8 60 50)"><rect x="26" y="34" width="62" height="40" rx="3" fill="#fff"/></g><g transform="rotate(5 60 46)"><rect x="30" y="26" width="62" height="40" rx="3" fill="#fff"/></g><rect x="28" y="14" width="62" height="44" rx="3" fill="#fff"/><path d="M36 23h30" stroke="#b4791f" stroke-width="3"/><path d="M36 31h46M36 37h46M36 43h32M36 49h40" stroke="#d8d1c4"/><rect x="72" y="20" width="12" height="8" rx="1.5" stroke-width="1.6"/></svg></div><h3>Too much noise</h3><p>Each week brings a new tool and a new prediction, and very little of it fits a real client file.</p></div><div class="card c"><div class="il"><svg viewBox="0 0 120 84" fill="none" stroke="#1c5d4c" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="18" y="12" width="84" height="60" rx="5" fill="#fff"/><path d="M18 24h84"/><circle cx="26" cy="18" r="1.8" fill="#d8d1c4" stroke="none"/><circle cx="32" cy="18" r="1.8" fill="#d8d1c4" stroke="none"/><circle cx="38" cy="18" r="1.8" fill="#d8d1c4" stroke="none"/><path d="M28 34h22M28 41h16M28 48h20M28 55h12" stroke="#d8d1c4"/><rect x="62" y="42" width="26" height="21" rx="3" fill="#fff" stroke="#b4791f" stroke-width="2.4"/><path d="M67 42v-5a8 8 0 0 1 16 0v5" stroke="#b4791f" stroke-width="2.4"/><path d="M75 50v5" stroke="#b4791f" stroke-width="2.4"/></svg></div><h3>Processes you don’t control</h3><p>When your process lives inside a vendor’s product, a price change or a feature change can undo it.</p></div><div class="card c"><div class="il"><svg viewBox="0 0 120 84" fill="none" stroke="#1c5d4c" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="54" cy="44" r="30" fill="#fff"/><path d="M54 17v5" transform="rotate(0 54 44)" stroke="#1c5d4c"/><path d="M54 18.5v3" transform="rotate(30 54 44)" stroke="#d8d1c4"/><path d="M54 18.5v3" transform="rotate(60 54 44)" stroke="#d8d1c4"/><path d="M54 17v5" transform="rotate(90 54 44)" stroke="#1c5d4c"/><path d="M54 18.5v3" transform="rotate(120 54 44)" stroke="#d8d1c4"/><path d="M54 18.5v3" transform="rotate(150 54 44)" stroke="#d8d1c4"/><path d="M54 17v5" transform="rotate(180 54 44)" stroke="#1c5d4c"/><path d="M54 18.5v3" transform="rotate(210 54 44)" stroke="#d8d1c4"/><path d="M54 18.5v3" transform="rotate(240 54 44)" stroke="#d8d1c4"/><path d="M54 17v5" transform="rotate(270 54 44)" stroke="#1c5d4c"/><path d="M54 18.5v3" transform="rotate(300 54 44)" stroke="#d8d1c4"/><path d="M54 18.5v3" transform="rotate(330 54 44)" stroke="#d8d1c4"/><path d="M54 44 44.5 28.5" stroke-width="3"/><path d="M54 44V21" stroke-width="2.2"/><circle cx="54" cy="44" r="2.4" fill="#1c5d4c" stroke="none"/><path d="M99 14a9 9 0 1 0 8 13 7 7 0 0 1-8-13z" fill="#fbf1e0" stroke="#b4791f"/></svg></div><h3>No time to learn</h3><p>The job already takes up the evenings, and learning AI on top of it feels like a second job.</p></div><div class="card c"><div class="il"><svg viewBox="0 0 120 84" fill="none" stroke="#1c5d4c" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M38 50V24a8 8 0 0 1 8-8h28a8 8 0 0 1 8 8v26" fill="#fff"/><path d="M30 44a6 6 0 0 1 12 0v8h36v-8a6 6 0 0 1 12 0v18a3 3 0 0 1-3 3H33a3 3 0 0 1-3-3z" fill="#fff"/><path d="M42 52h36"/><path d="M36 65v8M84 65v8"/><path d="M48 30h24" stroke="#d8d1c4"/><path d="M14 73h92" stroke="#d8d1c4"/></svg></div><h3>Clients are changing</h3><p>Firms and clients are changing how they work faster than most playbooks are updated.</p></div></div></div>
|
||
<script>
|
||
window.__ready = (async () => {
|
||
let empty = 0;
|
||
for (const s of document.querySelectorAll('.slot[data-src]')) {
|
||
let ok = false;
|
||
for (const ext of ['jpg', 'jpeg', 'png', 'webp']) {
|
||
const url = s.dataset.src + '.' + ext;
|
||
ok = await new Promise(r => { const i = new Image(); i.onload = () => r(true); i.onerror = () => r(false); i.src = url; });
|
||
if (ok) { s.style.backgroundImage = 'url("' + url + '")'; s.classList.add('filled'); break; }
|
||
}
|
||
if (!ok) empty++;
|
||
}
|
||
await document.fonts.ready;
|
||
for (const el of document.querySelectorAll('[data-fit]')) {
|
||
let fs = parseFloat(getComputedStyle(el).fontSize);
|
||
const max = el.dataset.fit ? parseFloat(el.dataset.fit) : el.parentElement.clientWidth;
|
||
while (el.scrollWidth > max && fs > 10) { fs -= 0.5; el.style.fontSize = fs + 'px'; }
|
||
}
|
||
if (window.afterLayout) await window.afterLayout();
|
||
return empty;
|
||
})();
|
||
</script></body></html> |