function Homepage(){
const {Button,Input,Select,Dialog,Toast}=window.HelixCyberDesignSystem_c2a1e7;
const [dlg,setDlg]=React.useState(false);
const [toast,setToast]=React.useState(false);
const [eng,setEng]=React.useState('');
const [email,setEmail]=React.useState('');
const [msg,setMsg]=React.useState('');
const open=()=>setDlg(true);
const submit=()=>{
const body=encodeURIComponent('From: '+(email||'(your email)')+'\nEngagement: '+(eng||'Not sure yet')+'\n\n'+msg);
window.location.href='mailto:contact@helixcyber.ai?subject='+encodeURIComponent('Briefing request')+'&body='+body;
setDlg(false);setToast(true);setTimeout(()=>setToast(false),5000);};
return <div>
<Nav onContact={open}/>
<Hero onContact={open}/>
<Capabilities/>
<Approach/>
<Footer onContact={open}/>
<Dialog open={dlg} label="/CONTACT" title="Request a briefing" onClose={()=>setDlg(false)}
footer={<><Button variant="ghost" onClick={()=>setDlg(false)}>Cancel</Button><Button onClick={submit}>Send</Button></>}>
<div style={{display:'flex',flexDirection:'column',gap:14}}>
<Input label="Work email" prefix="$" placeholder="you@company.com" value={email} onChange={e=>setEmail(e.target.value)}/>
<Select label="Engagement" options={['Audit','Red team','Retainer','Not sure yet']} value={eng} onChange={e=>setEng(e.target.value)}/>
<label style={{display:'flex',flexDirection:'column',gap:6}}><span style={{fontSize:11,letterSpacing:'var(--tracking-caps)',color:'var(--text-muted)',textTransform:'uppercase'}}>What you run / what worries you</span>
<textarea value={msg} onChange={e=>setMsg(e.target.value)} rows={4} placeholder="Stack, targets, timeline…" style={{background:'var(--bg-0)',border:'1px solid var(--border-default)',borderRadius:'var(--radius-1)',padding:'10px 12px',fontFamily:'var(--font-mono)',fontSize:13,color:'var(--text-body)',resize:'vertical',outline:'none'}}></textarea></label>
<span style={{fontSize:12,color:'var(--text-faint)'}}>Send opens your mail client addressed to contact@helixcyber.ai. Reply within one business day; PGP on request.</span>
</div></Dialog>
{toast&&<div style={{position:'fixed',bottom:24,right:24,zIndex:200}}><Toast tone="ok" onDismiss={()=>setToast(false)}>Opening your mail client — contact@helixcyber.ai</Toast></div>}
</div>;
}
window.Homepage=Homepage;