// Finish page — celebration hero, 7-chapter recap, reader survey (Q&A → ece@nautilida.ai),
// post-submit thank-you state, waitlist + share CTAs.
const { useState: useStateFin, useEffect: useEffectFin } = React;
function PlaybookFinish(){
// Mark finished as soon as user lands here.
useEffectFin(()=>{ markFinished(); }, []);
return (
{/* Hero */}
loop complete.
YOU FINISHED THE
literacy.
Seven chapters. About 45 minutes of reading. Now the part where we ask one favour back: tell us what you'd actually want an AI team lead to do for your team. We read every reply.
{/* Chapter recap */}
RECAP // SEVEN ONE-LINERS
IF SOMETHING CARRIES — IT'S THESE
{RECAP_LINES.map(([num, title, line], i)=>(
))}
{/* Survey */}
{/* Closing CTA strip */}
START A LOOP{' '}
this Monday.
With or without Nauti. The first cohort is small. Tell us about your team and we'll come back with timing.
);
}
const RECAP_LINES = [
['01', 'WHAT IT IS', 'A coordination layer, not an assistant. Runs a rhythm, carries memory, hands the next move to the right owner.'],
['02', 'THE SHIFT', 'Visibility was the last decade. Coordination is this one. Dashboards show; team leads decide.'],
['03', 'THE LOOP', 'Mon brief → mid-week priorities → Fri recap → memory between weeks. Four parts, one rhythm.'],
['04', 'MEMORY', 'Three layers — conversation, pattern, loop-fed. Each one is what rules-based stacks couldn\'t deliver.'],
['05', 'WHERE IT FITS', 'Different category from ChatGPT/Claude (assistants) and Gong/Clari (visibility). Coordination over both.'],
['06', 'HARD QUESTIONS', 'GDPR, hallucinations, "can\'t Claude do this", confidential data — answered without dodging.'],
['07', "WHERE WE'RE GOING", 'Today the brain. Tomorrow the senses. Brain-first because senses without a substrate are theatre.'],
];
// ---------- Survey form ----------
function Survey(){
const [picks, setPicks] = useStateFin([]);
const [otherText, setOtherText] = useStateFin('');
const [email, setEmail] = useStateFin('');
const [role, setRole] = useStateFin('');
const [company, setCompany] = useStateFin('');
const [note, setNote] = useStateFin('');
const [sending, setSending] = useStateFin(false);
const [sent, setSent] = useStateFin(false);
const [errMsg, setErrMsg] = useStateFin('');
const togglePick = (opt)=>{
setPicks(prev => prev.includes(opt) ? prev.filter(x => x !== opt) : [...prev, opt]);
};
const handleSubmit = async (e)=>{
e.preventDefault();
if (sending) return;
if (!email){ setErrMsg('Email is required so we can come back to you.'); return; }
setSending(true); setErrMsg('');
const D = '@' + 'nautilida.ai';
const TO = 'ece' + D;
const CC = 'onur' + D;
try {
const res = await fetch('https://formsubmit.co/ajax/' + TO, {
method:'POST',
headers:{ 'Content-Type':'application/json', 'Accept':'application/json' },
body: JSON.stringify({
email, role, company,
'wants Nauti to': picks.join(', '),
'other capability': otherText,
'anything else': note,
_cc: CC,
_subject: '[Literacy] Reader survey — ' + email,
_replyto: email,
_template: 'table',
_captcha: 'false',
}),
});
const data = await res.json().catch(()=>({}));
if (!res.ok || (data.success !== 'true' && data.success !== true)){
throw new Error(data.message || 'Could not send. Please try again.');
}
setSent(true);
} catch (err){
setErrMsg(err.message || 'Could not send. Please try again.');
} finally {
setSending(false);
}
};
if (sent) return (
// REPLY RECEIVED
THANKS — we read every one.
Your answer landed in the team's inbox. If a piece of what you described is on our shortlist for the next sprint, we'll come back to {email} with what we're shipping and when.
Also join the waitlist →
);
const inputStyle = {
padding:'14px 16px',fontSize:15,border:'1.5px solid var(--ink)',borderRadius:10,
background:'rgba(255,255,255,.7)',color:'var(--ink)',
fontFamily:'"Geist", sans-serif',outline:'none',
boxShadow:'3px 3px 0 var(--violet)',
width:'100%',
};
return (