// Bundled components — Baycon AI marketing site (simplified — process & AI tools focus + i18n)
const { useState, useEffect, useMemo, useRef, useContext } = React;
// ============================================================
// Language context + translations
// ============================================================
const LangCtx = React.createContext('en');
window.LangCtx = LangCtx;
const TRANSLATIONS = {
en: {
// Nav
nav_help: 'How I help', nav_examples: 'Examples', nav_how: 'How it works',
nav_blog: 'Blog', nav_contact: 'Get in touch →',
// Hero
hero_eyebrow: 'Bringing home the Baycon · Bay Area AI consulting',
hero_aria: 'AI that earns its keep.',
hero_l1: 'AI that', hero_em: 'earns', hero_end: ' its keep.',
hero_sub: "I find the work that's slowing your business down, build AI into the way you already work, and train your team to run it without me. No hype — just fewer hours spent on the boring stuff.",
hero_cta1: 'Book a discovery call →', hero_cta2: 'See how it works ↓',
hero_stats: [
{ v: '3–4 wks', l: 'first call to working AI' },
{ v: '100%', l: 'yours to keep & run' },
{ v: 'Fixed-fee', l: 'scoped in writing, no surprises' },
],
marquee: [
'Wealth advisors', 'Accounting firms', 'Boutique law', 'Marketing & creative',
'Founder-led teams', 'San Francisco', 'Peninsula', 'Silicon Valley',
'East Bay', 'Marin', 'Remote across the US',
],
// Capabilities — how I help
cap_kicker: 'How I help',
cap_h1: 'Where AI ', cap_h_em: 'earns its keep.',
cap_lead: "I don't sell software. I find the parts of your business that quietly eat time, build AI into the tools you already use, and leave your team able to run it on their own.",
cap_cards: [
{
verb: 'Find', name: 'The bottlenecks',
blurb: 'We map how work actually moves through your business — and where it gets stuck, repeated, or copy-pasted by hand.',
items: [
'A clear picture of where the time goes',
'The handful of tasks AI can genuinely take over',
"An honest take on what's worth automating — and what isn't",
],
},
{
verb: 'Build', name: 'AI into your work',
blurb: 'Working automations and assistants wired into the tools you already use — not another app for your team to learn and babysit.',
items: [
'Workflows connected to your existing tools',
'Assistants trained on how your firm actually works',
'Everything documented as it gets built',
],
},
{
verb: 'Train', name: 'Your team to run it',
blurb: "When I'm done, your team owns it. Clear docs, live training, and a prompt library so it keeps working long after I leave.",
items: [
'Live training for the people who use it',
'A prompt library written for your business',
"Support through the first weeks — then it's yours",
],
},
],
// Examples — what it looks like
ex_kicker: 'What that looks like',
ex_h1: 'Real work, ', ex_h_em: 'quietly automated.',
ex_lead: 'A few of the things AI can take off your plate. Yours will look different — these are just here to make it concrete.',
ex_items: [
{ tag: 'Onboarding', title: 'Client onboarding that runs itself', body: 'A new client comes in, the paperwork drafts itself, folders and tasks get created, and nothing slips through the cracks.' },
{ tag: 'Proposals', title: 'Proposals drafted in minutes', body: 'Pull the details, draft the proposal in your voice and format, ready for you to review and send the same day.' },
{ tag: 'Inbox & docs', title: 'Email and documents triaged', body: 'Incoming requests sorted, summarized, and routed — so your team starts the day with a clear, prioritized list.' },
{ tag: 'Knowledge', title: 'An assistant that knows your firm', body: 'A private assistant trained on your processes and documents, answering the questions your team asks all day long.' },
],
ex_note: "Every build is fixed-fee and scoped in writing — you'll know exactly what you're getting before we start.",
// Process
proc_kicker: 'How it works',
proc_h1: 'From hello to ', proc_h_em: 'handoff', proc_h_end: '.',
proc_steps: [
{ title: 'Discovery call', body: 'A 30-minute conversation to understand your business and find where AI helps. No charge, no pitch.' },
{ title: 'Scoped proposal', body: 'A short written plan: what we build, by when, and a fixed price. No hourly billing.' },
{ title: 'Work begins', body: 'I build it into your tools and keep you in the loop the whole way — you see the work, never a black box.' },
{ title: 'Handoff', body: 'Your team owns what we build. Documentation and training come with every engagement.' },
],
proc_places_pre: 'In person across ',
proc_places: ['San Francisco', 'the Peninsula', 'Silicon Valley', 'the East Bay', 'Marin'],
proc_places_note: "The build itself is remote, asynchronous, and visible — you'll see what's being made, not a black box.",
// Contact
contact_kicker: 'Get in touch',
contact_h1: "Let's see if there's a ", contact_h_em: 'fit', contact_h_end: '.',
contact_lead: "The first conversation is a 30-minute discovery call — no charge, no pitch. Tell me what you're trying to do; I'll tell you whether AI helps and what the shortest path looks like.",
contact_meta: 'San Francisco Bay Area · Remote across the US',
contact_f_name: 'Name', contact_f_company: 'Company', contact_f_email: 'Email',
contact_f_phone: 'Phone (optional)', contact_f_interest: 'Interested in', contact_f_context: 'A little context',
contact_opts: [
"Not sure yet — let's talk",
'Automating a workflow',
'A custom AI assistant',
'Training my team on AI',
],
contact_submit: 'Send inquiry →',
contact_note: 'Submitting opens your email client with your message ready to send to ai@bayconai.com',
contact_opened: ' — opened.',
// Footer
footer_tag: 'Bay Area AI consulting that actually sticks. Built into your business, not bolted on.',
footer_col_explore: 'Explore', footer_col_contact: 'Contact', footer_col_legal: 'Legal',
footer_explore_links: ['How I help', 'What it looks like', 'How it works', 'Get in touch'],
footer_copyright: '© Baycon AI', footer_region: 'Serving the Bay Area · Remote across the US',
},
pt: {
// Nav
nav_help: 'Como ajudo', nav_examples: 'Exemplos', nav_how: 'Como funciona',
nav_blog: 'Blog', nav_contact: 'Fale conosco →',
// Hero
hero_eyebrow: 'Trazendo o Baycon para casa · Consultoria de IA na Bay Area',
hero_aria: 'IA que se paga.',
hero_l1: 'IA que', hero_em: 'se paga', hero_end: '.',
hero_sub: 'Eu encontro o trabalho que está atrasando o seu negócio, integro a IA à forma como você já trabalha e treino sua equipe para operar sem mim. Sem hype — apenas menos horas gastas no trabalho chato.',
hero_cta1: 'Agende uma conversa →', hero_cta2: 'Veja como funciona ↓',
hero_stats: [
{ v: '3–4 sem', l: 'da conversa à IA funcionando' },
{ v: '100%', l: 'fica com você para operar' },
{ v: 'Taxa fixa', l: 'escopo por escrito, sem surpresas' },
],
marquee: [
'Assessores de patrimônio', 'Escritórios de contabilidade', 'Advocacia boutique',
'Marketing e criação', 'Equipes de fundadores', 'São Francisco', 'Península',
'Vale do Silício', 'East Bay', 'Marin', 'Remoto nos EUA',
],
// Capabilities
cap_kicker: 'Como ajudo',
cap_h1: 'Onde a IA ', cap_h_em: 'se paga.',
cap_lead: 'Eu não vendo software. Eu encontro as partes do seu negócio que consomem tempo silenciosamente, integro a IA às ferramentas que você já usa e deixo sua equipe capaz de operar sozinha.',
cap_cards: [
{
verb: 'Encontrar', name: 'Os gargalos',
blurb: 'Mapeamos como o trabalho realmente flui pelo seu negócio — e onde ele trava, se repete ou é copiado e colado à mão.',
items: [
'Uma visão clara de para onde vai o tempo',
'As poucas tarefas que a IA pode realmente assumir',
'Uma opinião honesta sobre o que vale automatizar — e o que não vale',
],
},
{
verb: 'Construir', name: 'A IA no seu trabalho',
blurb: 'Automações e assistentes funcionando, conectados às ferramentas que você já usa — não mais um aplicativo para a equipe aprender e cuidar.',
items: [
'Fluxos conectados às suas ferramentas existentes',
'Assistentes treinados em como sua empresa realmente trabalha',
'Tudo documentado conforme é construído',
],
},
{
verb: 'Treinar', name: 'Sua equipe para operar',
blurb: 'Quando termino, sua equipe assume. Documentação clara, treinamento ao vivo e uma biblioteca de prompts para continuar funcionando muito depois de eu sair.',
items: [
'Treinamento ao vivo para quem vai usar',
'Uma biblioteca de prompts escrita para o seu negócio',
'Suporte nas primeiras semanas — depois é seu',
],
},
],
// Examples
ex_kicker: 'Como isso se parece',
ex_h1: 'Trabalho real, ', ex_h_em: 'automatizado em silêncio.',
ex_lead: 'Algumas das coisas que a IA pode tirar do seu prato. O seu caso será diferente — estes exemplos servem apenas para deixar concreto.',
ex_items: [
{ tag: 'Onboarding', title: 'Onboarding de clientes que se resolve sozinho', body: 'Um novo cliente chega, a papelada se redige sozinha, as pastas e tarefas são criadas e nada escapa.' },
{ tag: 'Propostas', title: 'Propostas redigidas em minutos', body: 'Reúne os detalhes, redige a proposta na sua voz e formato, pronta para você revisar e enviar no mesmo dia.' },
{ tag: 'Caixa e docs', title: 'E-mails e documentos triados', body: 'Solicitações recebidas organizadas, resumidas e encaminhadas — para sua equipe começar o dia com uma lista clara e priorizada.' },
{ tag: 'Conhecimento', title: 'Um assistente que conhece sua empresa', body: 'Um assistente privado treinado nos seus processos e documentos, respondendo às perguntas que sua equipe faz o dia inteiro.' },
],
ex_note: 'Todo projeto tem taxa fixa e escopo por escrito — você sabe exatamente o que vai receber antes de começarmos.',
// Process
proc_kicker: 'Como funciona',
proc_h1: 'Do olá à ', proc_h_em: 'entrega', proc_h_end: '.',
proc_steps: [
{ title: 'Conversa inicial', body: 'Uma conversa de 30 minutos para entender seu negócio e achar onde a IA ajuda. Sem custo, sem pitch.' },
{ title: 'Proposta com escopo', body: 'Um plano curto por escrito: o que construímos, até quando e um preço fixo. Sem cobrança por hora.' },
{ title: 'O trabalho começa', body: 'Eu integro às suas ferramentas e mantenho você por dentro o tempo todo — você vê o trabalho, nunca uma caixa preta.' },
{ title: 'Entrega', body: 'Sua equipe fica com o que construímos. Documentação e treinamento vêm com todo engajamento.' },
],
proc_places_pre: 'Presencial em ',
proc_places: ['São Francisco', 'Península', 'Vale do Silício', 'East Bay', 'Marin'],
proc_places_note: 'A construção em si é remota, assíncrona e visível — você verá o que está sendo feito, não uma caixa preta.',
// Contact
contact_kicker: 'Fale conosco',
contact_h1: 'Vamos ver se há um ', contact_h_em: 'encaixe', contact_h_end: '.',
contact_lead: 'A primeira conversa é uma chamada de descoberta de 30 minutos — sem custo, sem pitch. Me diga o que você está tentando fazer; eu te digo se a IA ajuda e qual é o caminho mais curto.',
contact_meta: 'Bay Area, São Francisco · Remoto nos EUA',
contact_f_name: 'Nome', contact_f_company: 'Empresa', contact_f_email: 'Email',
contact_f_phone: 'Telefone (opcional)', contact_f_interest: 'Interesse em', contact_f_context: 'Um pouco de contexto',
contact_opts: [
'Ainda não sei — vamos conversar',
'Automatizar um fluxo de trabalho',
'Um assistente de IA personalizado',
'Treinar minha equipe em IA',
],
contact_submit: 'Enviar consulta →',
contact_note: 'Ao enviar, seu cliente de email abrirá com a mensagem pronta para enviar a ai@bayconai.com',
contact_opened: ' — aberto.',
// Footer
footer_tag: 'Consultoria de IA na Bay Area que realmente funciona. Integrada ao seu negócio, não apenas colada.',
footer_col_explore: 'Navegar', footer_col_contact: 'Contato', footer_col_legal: 'Legal',
footer_explore_links: ['Como ajudo', 'Como isso se parece', 'Como funciona', 'Fale conosco'],
footer_copyright: '© Baycon AI', footer_region: 'Servindo a Bay Area · Remoto nos EUA',
},
};
function useT() {
const lang = useContext(LangCtx);
return (key) => {
const v = TRANSLATIONS[lang] && TRANSLATIONS[lang][key];
return v !== undefined ? v : TRANSLATIONS.en[key];
};
}
window.useT = useT;
// ============================================================
// Language Toggle (lives inside the header)
// ============================================================
function LangToggle({ lang, setLang }) {
return (
setLang('pt')}
title="Português (Brasil)"
aria-pressed={lang === 'pt'}
>
🇧🇷
PT
setLang('en')}
title="English"
aria-pressed={lang === 'en'}
>
🇺🇸
EN
);
}
window.LangToggle = LangToggle;
// ============================================================
// Reveal — fade-up on scroll into view
// ============================================================
function Reveal({ className = '', delay = 0, children }) {
const ref = useRef(null);
const [inView, setInView] = useState(false);
useEffect(() => {
const el = ref.current;
if (!el) return;
if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
setInView(true);
return;
}
const io = new IntersectionObserver(
([e]) => { if (e.isIntersecting) { setInView(true); io.disconnect(); } },
{ threshold: 0.12, rootMargin: '0px 0px -6% 0px' }
);
io.observe(el);
return () => io.disconnect();
}, []);
return (
{children}
);
}
window.Reveal = Reveal;
// ============================================================
// Section scaffold
// ============================================================
function Section({ id, num, eyebrow, heading, lead, children, className = '', dark = false }) {
return (
{num}
{eyebrow}
{heading && {heading} }
{lead && {lead}
}
{children}
);
}
window.Section = Section;
// ============================================================
// Header
// ============================================================
function Header({ lang, setLang }) {
const t = useT();
const [past, setPast] = useState(false);
const [open, setOpen] = useState(false);
useEffect(() => {
const onScroll = () => setPast(window.scrollY > window.innerHeight * 0.7);
onScroll();
window.addEventListener('scroll', onScroll, { passive: true });
return () => window.removeEventListener('scroll', onScroll);
}, []);
const links = [
['#capabilities', t('nav_help')],
['#examples', t('nav_examples')],
['#process', t('nav_how')],
['/blog', t('nav_blog')],
];
return (
);
}
window.Header = Header;
// ============================================================
// Marquee
// ============================================================
function Marquee() {
const t = useT();
const items = t('marquee');
const group = (key) => (
{items.map((txt, i) => (
{txt}◆
))}
);
return (
);
}
window.Marquee = Marquee;
// ============================================================
// Hero
// ============================================================
function Hero() {
const t = useT();
return (
{t('hero_eyebrow')}
{t('hero_l1')}
{t('hero_em')}
{t('hero_end')}
{t('hero_sub')}
{t('hero_stats').map((s, i) => (
{s.v}
{s.l}
))}
);
}
window.Hero = Hero;
// ============================================================
// Capabilities — how I help (Find / Build / Train)
// ============================================================
function Capabilities() {
const t = useT();
return (
{t('cap_h1')}{t('cap_h_em')} }
lead={t('cap_lead')}>
{t('cap_cards').map((c, i) => (
{String(i + 1).padStart(2, '0')}
{c.verb}
{c.name}
{c.blurb}
{c.items.map(it => {it} )}
))}
);
}
window.Capabilities = Capabilities;
// ============================================================
// Examples — what it looks like
// ============================================================
function Examples() {
const t = useT();
return (
{t('ex_h1')}{t('ex_h_em')} }
lead={t('ex_lead')}>
{t('ex_items').map((e, i) => (
{e.tag}
{e.title}
{e.body}
))}
↳
{t('ex_note')}
);
}
window.Examples = Examples;
// ============================================================
// Process band — hello to handoff + Bay Area
// ============================================================
function Process() {
const t = useT();
const places = t('proc_places');
return (
{t('proc_h1')}{t('proc_h_em')} {t('proc_h_end')}}
className="bk-process">
{t('proc_steps').map((s, i) => (
{String(i + 1).padStart(2, '0')}
{s.title}
{s.body}
))}
{t('proc_places_pre')}
{places.map((p, i) => (
{p}{i < places.length - 1 && — }
))}
{'. '}
{t('proc_places_note')}
);
}
window.Process = Process;
// ============================================================
// ContactSection (dark)
// ============================================================
function ContactSection() {
const t = useT();
const [form, setForm] = useState({
name: '', company: '', email: '', phone: '',
interest: '', context: '',
});
const [submitted, setSubmitted] = useState(false);
const set = (k) => (e) => setForm(s => ({ ...s, [k]: e.target.value }));
const opts = t('contact_opts');
const interest = form.interest || opts[0];
const onSubmit = (e) => {
e.preventDefault();
const subject = encodeURIComponent('Baycon AI Inquiry');
const body = encodeURIComponent(
`Name: ${form.name}
Company: ${form.company}
Email: ${form.email}
Phone: ${form.phone}
Interested in: ${interest}
${form.context}`);
window.location.href = `mailto:ai@bayconai.com?subject=${subject}&body=${body}`;
setSubmitted(true);
};
return (
);
}
window.ContactSection = ContactSection;
// ============================================================
// Footer (dark)
// ============================================================
function Footer() {
const t = useT();
const exploreLinks = t('footer_explore_links');
const exploreHrefs = ['#capabilities', '#examples', '#process', '#contact'];
return (
);
}
window.Footer = Footer;
