const { Link: Link_tc } = ReactRouterDOM;

function TrustCenter() {
  useSEO({
    title: 'Trust Center | Cyrion AI Security & Compliance',
    description: "Cyrion AI's Trust Center: SOC 2, ISO 27001, GDPR and CREST posture, data handling practices, subprocessors, and our responsible disclosure policy.",
    path: '/trust-center',
  });
  return (
    <div data-screen-label="trust-center">
      <section className="page-hero">
        <div className="page">
          <div className="breadcrumb" style={{ marginBottom: 20 }}><Link_tc to="/">Home</Link_tc><span>/</span><span className="ink">Trust Center</span></div>
          <div className="eyebrow" style={{ marginBottom: 18 }}><span className="dot" />Trust Center</div>
          <h1 className="h1" style={{ maxWidth: 820 }}>Security is the product. Here's how we prove it.</h1>
          <p className="body-lg" style={{ maxWidth: 640, marginTop: 22 }}>Everything below reflects how Cyrion itself is built, operated and audited — the same rigor we apply when testing your environment.</p>
          <div className="row" style={{ gap: 10, marginTop: 28, flexWrap: 'wrap' }}>
            <span className="pill"><span className="swatch" />SOC 2 Type II · in progress</span>
            <span className="pill"><span className="swatch" />ISO 27001 · aligned</span>
            <span className="pill"><span className="swatch" />GDPR · ready</span>
            <span className="pill"><span className="swatch" />CREST · approved</span>
          </div>
        </div>
      </section>

      <section id="compliance" className="section">
        <div className="page">
          <div style={{ maxWidth: 640, marginBottom: 44 }}><div className="eyebrow" style={{ marginBottom: 14 }}><span className="dot" />Compliance</div><h2 className="h2">Certifications & frameworks</h2></div>
          <div className="auto-fit-240">
            <div className="card" style={{ padding: 24 }}><div className="h3" style={{ marginBottom: 8, fontSize: 16 }}>SOC 2 Type II</div><p className="body">Control objectives covering security, availability and confidentiality; formal audit underway.</p></div>
            <div className="card" style={{ padding: 24 }}><div className="h3" style={{ marginBottom: 8, fontSize: 16 }}>ISO 27001</div><p className="body">Information security management practices aligned to the ISO 27001 control set.</p></div>
            <div className="card" style={{ padding: 24 }}><div className="h3" style={{ marginBottom: 8, fontSize: 16 }}>GDPR</div><p className="body">EU data-subject rights, lawful basis and DPA terms available for every customer.</p></div>
            <div className="card" style={{ padding: 24 }}><div className="h3" style={{ marginBottom: 8, fontSize: 16 }}>CREST</div><p className="body">Our methodology is reviewed against CREST-approved penetration testing standards.</p></div>
          </div>
          <p className="body" style={{ marginTop: 24 }}>Need a copy of a report or attestation under NDA? <a href="mailto:security@cyrion.ai">Request one from our security team →</a></p>
        </div>
      </section>

      <section id="data" className="section" style={{ borderTop: '1px solid var(--line)' }}>
        <div className="page">
          <div style={{ maxWidth: 640, marginBottom: 32 }}><div className="eyebrow" style={{ marginBottom: 14 }}><span className="dot" />Data handling</div><h2 className="h2">How we handle your data</h2></div>
          <div className="prose">
            <ul>
              <li>All findings, scan telemetry and report artifacts are encrypted in transit (TLS 1.2+) and at rest (AES-256).</li>
              <li>Customer data is logically scoped per-tenant; no cross-customer data sharing, ever.</li>
              <li>Production-touching probes are rate-limited, tagged, and can be restricted to non-prod surfaces with a single policy flag.</li>
              <li>Retention defaults to 12 months of finding history, configurable per contract.</li>
              <li>Access to raw scan data is limited to on-call engineering and audited quarterly.</li>
            </ul>
          </div>
          <div style={{ marginTop: 8 }}>
            <p className="body">We rely on a small set of vetted infrastructure, database, and AI model sub-processors to operate the Service. Each is selected for its security posture and bound by a data processing agreement; none are permitted to train on your scan data. Full sub-processor details are available in our <Link_tc to="/privacy" style={{ color: 'var(--accent)' }}>Privacy Policy</Link_tc> or on request.</p>
          </div>
        </div>
      </section>

      <section id="privacy" className="section" style={{ borderTop: '1px solid var(--line)' }}>
        <div className="page">
          <div style={{ maxWidth: 640, marginBottom: 20 }}><div className="eyebrow" style={{ marginBottom: 14 }}><span className="dot" />Policies</div><h2 className="h2">Privacy & terms</h2></div>
          <div className="prose">
            <p>Our privacy policy covers what we collect on this site (contact and waitlist form submissions), how long we retain it, and your rights as a data subject. Our terms of service govern authorized testing scope, liability and disclosure timelines for any Cyrion engagement.</p>
            <p>Read the full <Link_tc to="/privacy">Privacy Policy</Link_tc> and <Link_tc to="/terms">Terms of Service</Link_tc>. A signed DPA is available during onboarding, or on request.</p>
          </div>
        </div>
      </section>

      <section id="disclosure" className="section" style={{ borderTop: '1px solid var(--line)' }}>
        <div className="page">
          <div style={{ maxWidth: 640, marginBottom: 20 }}><div className="eyebrow" style={{ marginBottom: 14 }}><span className="dot" />Disclosure</div><h2 className="h2">Responsible disclosure</h2></div>
          <div className="prose">
            <p>Found a vulnerability in Cyrion's own platform? We ask that you report it privately and give us 90 days to remediate before any public disclosure. We do not pursue legal action against good-faith researchers who follow this policy.</p>
            <p>Report to <a href="mailto:security@cyrion.ai">security@cyrion.ai</a>. PGP key available on request.</p>
          </div>
        </div>
      </section>

      <section id="reports" className="section" style={{ borderTop: '1px solid var(--line)' }}>
        <div className="page">
          <div style={{ maxWidth: 640, marginBottom: 32 }}><div className="eyebrow" style={{ marginBottom: 14 }}><span className="dot" />Reports</div><h2 className="h2">Audit reports & assessments</h2></div>
          <div className="col">
            <div className="job-row" style={{ borderTop: '1px solid var(--line)' }}><div className="h3" style={{ fontSize: 15 }}>SOC 2 Type II — bridge letter</div><Link_tc className="btn btn-ghost" to="/contact">Request access →</Link_tc></div>
            <div className="job-row"><div className="h3" style={{ fontSize: 15 }}>Third-party penetration test summary</div><Link_tc className="btn btn-ghost" to="/contact">Request access →</Link_tc></div>
            <div className="job-row" style={{ borderBottom: '1px solid var(--line)' }}><div className="h3" style={{ fontSize: 15 }}>ISO 27001 statement of applicability</div><Link_tc className="btn btn-ghost" to="/contact">Request access →</Link_tc></div>
          </div>
        </div>
      </section>

      <section id="engagement" className="section" style={{ borderTop: '1px solid var(--line)' }}>
        <div className="page">
          <div style={{ maxWidth: 640, marginBottom: 20 }}><div className="eyebrow" style={{ marginBottom: 14 }}><span className="dot" />Ethics</div><h2 className="h2">Our engagement charter</h2></div>
          <div className="prose"><p>Every Cyrion engagement runs under a signed scope agreement defining authorized targets, testing windows and escalation contacts. Exploit candidates are validated in an isolated sandbox before anything is reported or, with explicit customer opt-in, safely demonstrated in production. We stop immediately on request and never retain access beyond the contracted engagement window.</p></div>
        </div>
      </section>

      <section className="section" style={{ borderTop: '1px solid var(--line)', background: 'var(--bg-deep)' }}>
        <div className="page" style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', flexWrap: 'wrap', gap: 20 }}>
          <div><div className="h3">Have a security or compliance question we didn't cover?</div><p className="body" style={{ marginTop: 8 }}>Our security team responds within one business day.</p></div>
          <Link_tc className="btn btn-primary" to="/contact">Contact security →</Link_tc>
        </div>
      </section>
    </div>
  );
}

Object.assign(window, { TrustCenter });