102 lines
6.1 KiB
HTML
102 lines
6.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Business Plans & Pitches — Zoe Cross</title>
|
|
<style>
|
|
:root {
|
|
--paper: #f4f2ec; --paper-raised: #fffefb; --ink: #1d2028; --ink-soft: #5c616e;
|
|
--indigo: #333e8f; --indigo-deep: #212a5e; --indigo-tint: #ebedf8; --gold: #9a6a12;
|
|
--good: #2e6b53; --line: #ded9cd; --shadow: 0 1px 2px rgba(29,32,40,.05), 0 12px 32px rgba(29,32,40,.08);
|
|
--serif: "Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
|
|
--sans: system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
|
|
--mono: "SF Mono","JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
|
|
}
|
|
@media (prefers-color-scheme: dark) {
|
|
:root { --paper:#15171c; --paper-raised:#1e212a; --ink:#ece9e2; --ink-soft:#9aa0ae;
|
|
--indigo:#98a2ef; --indigo-deep:#20264a; --indigo-tint:#242a44; --gold:#d7a44c;
|
|
--good:#6bbd97; --line:#2f333f; --shadow:0 1px 2px rgba(0,0,0,.4), 0 14px 34px rgba(0,0,0,.36); }
|
|
}
|
|
* { box-sizing: border-box; }
|
|
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans);
|
|
font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
|
|
.wrap { max-width: 900px; margin: 0 auto; padding: 0 26px; }
|
|
header.top { padding: 72px 0 34px; position: relative; }
|
|
header.top::after { content:""; position:absolute; left:26px; right:26px; bottom:0; height:1px;
|
|
background: linear-gradient(90deg, var(--indigo), transparent 60%); }
|
|
.kicker { font-size:12px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--indigo); display:flex; align-items:center; gap:9px; }
|
|
.kicker .mk { font-family:var(--serif); font-size:18px; }
|
|
h1 { font-family:var(--serif); font-weight:600; font-size: clamp(38px, 6.5vw, 60px); line-height:1.02; letter-spacing:-.02em; margin:18px 0 12px; }
|
|
h1 em { font-style:italic; color:var(--indigo); }
|
|
.sub { font-size:18px; color:var(--ink-soft); max-width:60ch; margin:0; }
|
|
.meta-line { margin-top:16px; font-family:var(--mono); font-size:12.5px; color:var(--ink-soft); display:flex; gap:16px; flex-wrap:wrap; }
|
|
.meta-line b { color:var(--ink); font-weight:600; }
|
|
|
|
.list { padding: 30px 0 20px; display:flex; flex-direction:column; gap:16px; }
|
|
.entry { display:grid; grid-template-columns: 1fr auto; gap:16px 20px; align-items:center;
|
|
background:var(--paper-raised); border:1px solid var(--line); border-radius:14px; padding:22px 24px; box-shadow:var(--shadow); }
|
|
@media (max-width:640px){ .entry { grid-template-columns:1fr; } }
|
|
.entry .body { min-width:0; }
|
|
.tags { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:9px; }
|
|
.tag { font-family:var(--mono); font-size:11px; letter-spacing:.03em; padding:3px 9px; border-radius:999px; border:1px solid var(--line); color:var(--ink-soft); }
|
|
.tag.type { color:var(--indigo); border-color:color-mix(in srgb, var(--indigo) 34%, var(--line)); }
|
|
.tag.live { color:var(--good); border-color:color-mix(in srgb, var(--good) 40%, var(--line)); display:inline-flex; align-items:center; gap:6px; }
|
|
.tag.live .dot { width:6px; height:6px; border-radius:50%; background:var(--good); }
|
|
.entry h2 { font-family:var(--serif); font-weight:600; font-size:24px; line-height:1.15; margin:0 0 5px; letter-spacing:-.01em; }
|
|
.entry p { margin:0; font-size:15px; color:var(--ink-soft); line-height:1.5; }
|
|
.entry .updated { margin-top:9px; font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); }
|
|
.actions { display:flex; gap:10px; align-items:center; }
|
|
@media (max-width:640px){ .actions { justify-content:flex-start; } }
|
|
.btn { font-family:var(--sans); font-size:14px; font-weight:600; text-decoration:none; border-radius:9px; padding:10px 15px; white-space:nowrap; display:inline-flex; align-items:center; gap:7px; transition:background .15s ease, color .15s ease, border-color .15s ease; }
|
|
.btn.open { background:var(--indigo); color:#fff; border:1px solid var(--indigo); }
|
|
.btn.open:hover { background:var(--indigo-deep); }
|
|
.btn.pdf { background:transparent; color:var(--indigo); border:1px solid color-mix(in srgb,var(--indigo) 45%,var(--line)); }
|
|
.btn.pdf:hover { background:var(--indigo-tint); }
|
|
|
|
footer { padding: 30px 0 70px; border-top:1px solid var(--line); margin-top:14px; }
|
|
.foot { font-size:13px; color:var(--ink-soft); line-height:1.6; }
|
|
a:focus-visible, .btn:focus-visible { outline:2px solid var(--indigo); outline-offset:3px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header class="top">
|
|
<div class="wrap">
|
|
<div class="kicker"><span class="mk">✎</span> Zoe Cross · Living Index</div>
|
|
<h1>Business Plans <em>&</em> Pitches</h1>
|
|
<p class="sub">Every plan and pitch, in one place — always the current version, each with its live page and a PDF to attach or print.</p>
|
|
<div class="meta-line"><span><b>1</b> document</span><span>Updated <b>27 Aug 2026</b></span><span>zoe-pitches.mosaic.site</span></div>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="wrap">
|
|
<div class="list">
|
|
|
|
<article class="entry">
|
|
<div class="body">
|
|
<div class="tags">
|
|
<span class="tag type">Business Plan</span>
|
|
<span class="tag">EdTech · AI</span>
|
|
<span class="tag live"><span class="dot"></span> Live</span>
|
|
</div>
|
|
<h2>Essay Helper</h2>
|
|
<p>The AI writing coach that never invents a source — problem, product, moat, market, model, roadmap, and the ask. Built on shipped, tested software.</p>
|
|
<div class="updated">Updated 27 Aug 2026</div>
|
|
</div>
|
|
<div class="actions">
|
|
<a class="btn open" href="./essay-helper/">Open →</a>
|
|
<a class="btn pdf" href="./essay-helper/Essay-Helper-Business-Case.pdf">PDF ↓</a>
|
|
</div>
|
|
</article>
|
|
|
|
</div>
|
|
</main>
|
|
|
|
<footer>
|
|
<div class="wrap">
|
|
<p class="foot">Confidential — internal planning documents. Product and engineering claims reflect current work; market and financial figures are illustrative planning assumptions.</p>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html>
|