function goTo(id){const el=document.getElementById(id);if(el)window.scrollTo({top:el.getBoundingClientRect().top+window.scrollY-80,behavior:'smooth'});}
function Nav({onContact}){
const {Button}=window.HelixCyberDesignSystem_c2a1e7;
return <nav style={{display:'flex',alignItems:'center',justifyContent:'space-between',padding:'0 40px',height:64,borderBottom:'1px solid var(--border-default)',position:'sticky',top:0,background:'var(--bg-0)',zIndex:10}}>
<a href="index.html" style={{display:'flex',alignItems:'center',gap:10,color:'var(--text-body)',textDecoration:'none'}}><img src="assets/logo.svg" width="22" height="22" alt="HelixCyber"/><span style={{fontFamily:'var(--font-mono)',fontSize:14,fontWeight:500,letterSpacing:'-.02em'}}>HELIXCYBER</span></a>
<div style={{display:'flex',alignItems:'center',gap:24,fontSize:13}}>
{[['Services','network-security'],['Models','models'],['Compliance','compliance'],['FAQ','faq']].map(([l,id])=><a key={l} href={'#'+id} onClick={e=>{e.preventDefault();goTo(id);}} style={{color:'var(--text-muted)',textDecoration:'none'}}>{l}</a>)}
<a href="blog.html" style={{color:'var(--text-muted)',textDecoration:'none'}}>Notes</a>
<Button size="sm" onClick={onContact}>Request briefing</Button>
</div></nav>;
}
function Hero({onContact}){
const {Button}=window.HelixCyberDesignSystem_c2a1e7;
const tag=t=><span style={{display:'inline-block',border:'1px solid var(--border-default)',background:'var(--bg-0)',borderRadius:8,padding:'4px 10px',fontSize:12,color:'var(--text-muted)'}}>{t}</span>;
const check=t=><div style={{display:'flex',alignItems:'center',gap:8,fontSize:13,color:'var(--text-body)',marginBottom:10}}><span style={{color:'var(--ok)',fontSize:14}}>✓</span>{t}</div>;
return <header style={{padding:'40px 40px 56px'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto',display:'grid',gridTemplateColumns:'1.35fr .75fr',gap:16,alignItems:'stretch'}}>
<div style={{background:'var(--bg-1)',border:'1px solid var(--border-default)',borderRadius:'var(--radius-2)',padding:'40px 36px'}}>
<div style={{display:'flex',gap:8,marginBottom:20}}>{tag('Security')}{tag('Enterprises')}</div>
<h1 style={{fontFamily:'var(--font-mono)',fontSize:'var(--text-3xl)',fontWeight:500,letterSpacing:'-.04em',lineHeight:1.1,margin:'0 0 16px'}}>helixcyber</h1>
<p style={{fontSize:15,color:'var(--text-muted)',maxWidth:520,margin:'0 0 24px'}}>Reverse engineering, AI security, and agent audits for companies that run software agents — from firmware to model weights.</p>
<div style={{display:'flex',flexWrap:'wrap',gap:8,marginBottom:28}}>{tag('Firmware audits')}{tag('Agent policy')}{tag('RAG hardening')}{tag('Model supply chain')}</div>
<div style={{display:'flex',gap:10}}><Button size="lg" onClick={onContact}>Request briefing</Button><Button variant="secondary" size="lg" onClick={()=>goTo('approach')}>How we work</Button></div>
</div>
<div style={{background:'var(--bg-1)',border:'1px solid var(--border-default)',borderRadius:'var(--radius-2)',padding:'28px 24px',display:'flex',flexDirection:'column'}}>
<div style={{fontSize:14,fontWeight:600,marginBottom:18}}>What you get</div>
{check('Authorized reverse engineering')}
{check('Model and agent audits')}
{check('Evidence for SOC 2 / GDPR / PIPL')}
{check('Reply in 7 business days if qualified')}
<div style={{marginTop:'auto',paddingTop:20}}><Button size="lg" onClick={onContact} style={{width:'100%',justifyContent:'center'}}>Request briefing</Button></div>
</div>
</div></header>;
}
function Capabilities(){
const items=[
{id:'network-security',l:'/NETWORK-SECURITY',t:'Perimeter to payload',d:'Detection engineering, traffic analysis, and hardening for networks that carry machine-to-machine traffic.',b:['Detection engineering & SOC tuning','Protocol and traffic analysis','Perimeter hardening reviews']},
{id:'reverse-engineering',l:'/REVERSE-ENGINEERING',t:'Binary triage at depth',d:'Firmware, protocols, and closed-source dependencies taken apart before they ship into your stack.',b:['Firmware and binary audits','Proprietary protocol recovery','Third-party dependency vetting']},
{id:'ai-security',l:'/AI-SECURITY',t:'Model supply chain',d:'Provenance for weights and adapters, injection-resistance testing, and guardrail evaluation.',b:['Weight and adapter provenance','Prompt-injection resistance testing','Guardrail and policy evaluation']},
{id:'agents',l:'/AGENTS',t:'Agent recommendation',d:'Vetted agents and tool policies. We tell you which agents to trust, with what, and prove why.',b:['Agent capability audits','Tool-access policy design','Trust reports with evidence']}];
const {Card}=window.HelixCyberDesignSystem_c2a1e7;
return <section style={{padding:'96px 40px',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto'}}>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:32}}>WHAT WE DO</div>
<div style={{display:'grid',gridTemplateColumns:'1fr 1fr',gap:16}}>
{items.map(i=><div key={i.l} id={i.id}><Card label={i.l} title={i.t} hoverable style={{height:'100%',boxSizing:'border-box'}}><span style={{color:'var(--text-muted)',fontSize:13}}>{i.d}</span>
<ul style={{listStyle:'none',margin:'14px 0 0',padding:0,display:'flex',flexDirection:'column',gap:6}}>{i.b.map(x=><li key={x} style={{fontSize:12,color:'var(--text-muted)'}}><span style={{color:'var(--accent)',marginRight:8}}>↳</span>{x}</li>)}</ul></Card></div>)}
</div></div></section>;
}
function Approach(){
const steps=[['01','Map','We enumerate the surface: binaries, models, agents, and the traffic between them.'],['02','Break','We attack it the way an adversary would, and write down exactly what gave.'],['03','Hold','Continuous monitoring keeps the findings fixed. Regressions page us, not you.']];
return <section id="approach" style={{padding:'96px 40px',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto'}}>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:32}}>HOW WE ENGAGE</div>
<div style={{display:'grid',gridTemplateColumns:'1fr 1fr 1fr',gap:32}}>
{steps.map(([n,t,d])=><div key={n} style={{borderTop:'1px solid var(--border-default)',paddingTop:20}}>
<div style={{color:'var(--accent)',fontSize:12,marginBottom:12}}>{n}</div>
<div style={{fontWeight:700,fontSize:16,marginBottom:8}}>{t}</div>
<div style={{color:'var(--text-muted)',fontSize:13}}>{d}</div></div>)}
</div></div></section>;
}
function Providers(){
const items=[
{logo:'assets/logos/anthropic.svg',alt:'Anthropic',name:'Anthropic',models:['Claude Opus 5','Claude Fable 5','Claude Fable 5.1']},
{logo:'assets/logos/openai.svg',alt:'OpenAI',name:'OpenAI',models:['GPT-5.6 Sol','gpt-daybreak-blue']},
{logo:'assets/logos/google.svg',alt:'Google',name:'Google',models:['Gemini']},
{logo:'assets/logos/aws.svg',alt:'Amazon Web Services',name:'AWS Bedrock',models:['Claude on Bedrock','Daybreak Blue','Llama / Titan']},
{logo:'assets/logos/xai.svg',alt:'xAI',name:'xAI',models:['Grok 4.6']}
];
return <section id="models" style={{padding:'96px 40px',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto'}}>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:12}}>MODELS WE RUN</div>
<div style={{fontSize:'var(--text-xl)',fontWeight:700,marginBottom:12,maxWidth:640}}>Providers on the desk</div>
<p style={{fontSize:14,color:'var(--text-muted)',maxWidth:560,margin:'0 0 40px'}}>Authorized enterprise work only. Which model we assign depends on the lane — general, Mythos fallback, or verified-defender. <a href="post-re-models.html">How we pick</a>.</p>
<div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(200px,1fr))',gap:16}}>
{items.map(p=><div key={p.name} style={{border:'1px solid var(--border-default)',borderRadius:'var(--radius-2)',padding:'24px 20px',background:'var(--bg-1)'}}>
<div style={{display:'flex',alignItems:'center',gap:12,marginBottom:18}}>
<img src={p.logo} width="28" height="28" alt={p.alt}/>
<div style={{fontFamily:'var(--font-display)',fontSize:13,letterSpacing:'.06em'}}>{p.name}</div>
</div>
<ul style={{listStyle:'none',margin:0,padding:0,display:'flex',flexDirection:'column',gap:8}}>
{p.models.map(m=><li key={m} style={{fontSize:13,color:'var(--text-muted)'}}><span style={{color:'var(--accent)',marginRight:8}}>↳</span>{m}</li>)}
</ul>
</div>)}
</div>
</div></section>;
}
function Compliance(){
const regs=[
['US','SOC 2','HIPAA','CMMC','Cyber insurance evidence'],
['EU','GDPR','NIS2','ISO 27001'],
['CN','PIPL','MLPS','DSL'],
['AI','ISO 42001','EU AI Act','model provenance']
];
return <section id="compliance" style={{padding:'96px 40px',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto'}}>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:12}}>COMPLIANCE</div>
<div style={{fontSize:'var(--text-xl)',fontWeight:700,marginBottom:12,maxWidth:640}}>Evidence mapped to the regimes you already report</div>
<p style={{fontSize:14,color:'var(--text-muted)',maxWidth:560,margin:'0 0 40px'}}>We do not sell a certificate. We produce the technical evidence auditors, insurers, and security questionnaires ask for — access, model provenance, agent tool policy, backup of findings, incident notes.</p>
<div style={{display:'grid',gridTemplateColumns:'repeat(auto-fit,minmax(220px,1fr))',gap:16}}>
{regs.map(([region,...pills])=><div key={region} style={{border:'1px solid var(--border-default)',borderRadius:'var(--radius-2)',padding:'20px 18px',background:'var(--bg-1)'}}>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--accent)',marginBottom:14}}>{region}</div>
<div style={{display:'flex',flexWrap:'wrap',gap:8}}>
{pills.map(p=><span key={p} style={{fontSize:12,color:'var(--text-muted)',border:'1px solid var(--border-default)',padding:'6px 10px'}}>{p}</span>)}
</div></div>)}
</div>
</div></section>;
}
function Industries(){
const items=[['Healthcare','HIPAA-aware agent and PHI-adjacent systems'],['Finance','SOC 2 evidence, model and vendor reviews'],['Manufacturing','firmware, CMMC-aware binary supply chain'],['Software','agent harness, RAG, tool-policy audits'],['Defense / gov','closed-source and firmware under authorization']];
return <section id="industries" style={{padding:'96px 40px',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto'}}>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:12}}>INDUSTRIES</div>
<div style={{fontSize:'var(--text-xl)',fontWeight:700,marginBottom:40,maxWidth:640}}>Where downtime and model risk are the same problem</div>
<div style={{display:'grid',gridTemplateColumns:'1fr 1fr',gap:0,borderTop:'1px solid var(--border-default)'}}>
{items.map(([t,d],i)=><div key={t} style={{padding:'20px 0',borderBottom:'1px solid var(--border-subtle)',paddingRight:i%2?0:32}}>
<div style={{fontSize:14,fontWeight:700,marginBottom:6}}>{t}</div>
<div style={{fontSize:13,color:'var(--text-muted)'}}>{d}</div>
</div>)}
</div>
</div></section>;
}
function Faq(){
const qa=[
['What does HelixCyber do?','Enterprise reverse engineering, AI security, agent audits, RAG hardening, and detection engineering for companies that run software agents.'],
['Which models do you run?','Anthropic (Opus 5, Fable 5/5.1), OpenAI (GPT-5.6 Sol, gpt-daybreak-blue), Google Gemini, AWS Bedrock, and xAI Grok 4.6. Assignment depends on the lane.'],
['Can you help with HIPAA, CMMC, SOC 2, GDPR, or PIPL?','We produce technical evidence those reviews ask for: access, model provenance, tool policy, findings, and recovery notes. We are not your auditor of record.'],
['Do you replace internal IT?','No. We sit on the security and reverse-engineering work. Internal IT keeps tickets and identity. We can co-run with a security team.'],
['How do we start?','Request a briefing. We map binaries, models, and agents, then propose an audit, red team, or retainer. Qualified inquiries receive a reply within seven business days to confirm next steps.']
];
return <section id="faq" style={{padding:'96px 40px',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto'}}>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:12}}>FAQ</div>
<div style={{fontSize:'var(--text-xl)',fontWeight:700,marginBottom:40}}>Common questions</div>
<div style={{display:'flex',flexDirection:'column',gap:0}}>
{qa.map(([q,a])=><div key={q} style={{padding:'20px 0',borderTop:'1px solid var(--border-subtle)'}}>
<h3 style={{fontSize:15,fontWeight:700,margin:'0 0 8px'}}>{q}</h3>
<p style={{fontSize:13,color:'var(--text-muted)',margin:0,maxWidth:720}}>{a}</p>
</div>)}
</div>
</div></section>;
}
function Footer({onContact}){
const {Button}=window.HelixCyberDesignSystem_c2a1e7;
return <footer>
<div id="contact" style={{padding:'96px 40px',borderBottom:'1px solid var(--border-subtle)'}}>
<div style={{maxWidth:'var(--container)',margin:'0 auto',display:'grid',gridTemplateColumns:'1fr 1fr',gap:48,alignItems:'center'}}>
<div>
<div style={{fontFamily:'var(--font-display)',fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:20}}>CONTACT</div>
<div style={{fontSize:'var(--text-xl)',fontWeight:700,marginBottom:16}}>Ready when the audit isn't optional.</div>
<div style={{fontSize:13,color:'var(--text-muted)',marginBottom:28,maxWidth:440}}>Tell us what you run and what worries you. Qualified inquiries receive a reply within seven business days, under NDA if you need one.</div>
<Button size="lg" onClick={onContact}>Request briefing</Button>
</div>
<div style={{display:'flex',flexDirection:'column',gap:18,fontSize:13,borderLeft:'1px solid var(--border-default)',paddingLeft:48}}>
<div><div style={{fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:4}}>BRIEFINGS & ENGAGEMENTS</div><a href="mailto:contact@helixcyber.ai">contact@helixcyber.ai</a></div>
<div><div style={{fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-faint)',marginBottom:4}}>VULNERABILITY DISCLOSURE</div><a href="mailto:security@helixcyber.ai">security@helixcyber.ai</a><div style={{fontSize:12,color:'var(--text-faint)',marginTop:4}}>Coordinated disclosure honored. PGP key available on request; encrypted reports preferred.</div></div>
<div style={{fontSize:12,color:'var(--text-faint)'}}><span style={{color:'var(--accent)'}}>$</span> qualified-reply &lt; 7 business days <span style={{color:'var(--ok)'}}>[ok]</span></div>
</div></div></div>
<div style={{padding:'32px 40px',display:'flex',alignItems:'center',justifyContent:'space-between',fontSize:12,color:'var(--text-faint)'}}>
<div style={{display:'flex',alignItems:'center',gap:10}}><img src="assets/logo.svg" width="16" height="16" alt="HelixCyber"/><span>© 2026 HelixCyber</span></div>
<div style={{display:'flex',gap:24}}><a href="mailto:contact@helixcyber.ai" style={{color:'var(--text-faint)'}}>contact@helixcyber.ai</a><a href="mailto:security@helixcyber.ai" style={{color:'var(--text-faint)'}}>/disclosure</a><a href="#contact" onClick={e=>{e.preventDefault();goTo('contact');}} style={{color:'var(--text-faint)'}}>/contact</a></div>
</div></footer>;
}
Object.assign(window,{Nav,Hero,Capabilities,Approach,Providers,Compliance,Industries,Faq,Footer});
