// LegalPages.jsx — Terms of Service + Privacy Policy. Shell sets window.LEGAL_PAGE.

const LegalDoc = ({ eyebrow, title, updated, intro, sections }) => (
  <>
    <section style={{ position: 'relative', overflow: 'hidden', borderBottom: '1px solid #1a1b1e' }}>
      <div className="gs-grid-bg" style={{ position: 'absolute', inset: 0, maskImage: 'radial-gradient(ellipse at 50% 0%, black 25%, transparent 70%)', WebkitMaskImage: 'radial-gradient(ellipse at 50% 0%, black 25%, transparent 70%)' }} />
      <div style={{ position: 'relative', maxWidth: 820, margin: '0 auto', padding: '110px 32px 48px' }}>
        <span style={{ display: 'inline-block', fontSize: 11, color: '#828fff', background: 'rgba(94,105,210,0.14)', padding: '4px 12px', borderRadius: 9999, fontFamily: 'var(--font-mono)', textTransform: 'uppercase', letterSpacing: 0.5, marginBottom: 20, border: '1px solid rgba(94,105,210,0.25)' }}>{eyebrow}</span>
        <h1 style={{ fontFamily: 'var(--font-display)', fontSize: 'clamp(34px, 4.4vw, 56px)', fontWeight: 600, letterSpacing: '-2px', color: '#f7f8f8', margin: '0 0 14px', lineHeight: 1.05 }}>{title}</h1>
        <p style={{ fontSize: 13, color: '#62666d', fontFamily: 'var(--font-mono)' }}>Last updated {updated}</p>
      </div>
    </section>

    <article style={{ maxWidth: 820, margin: '0 auto', padding: '48px 32px 88px' }}>
      <p style={{ fontSize: 16.5, color: '#a8aeb8', lineHeight: 1.7, margin: '0 0 36px' }}>{intro}</p>
      {sections.map((s, i) => (
        <section key={i} style={{ marginBottom: 36 }}>
          <h2 style={{ fontFamily: 'var(--font-display)', fontSize: 22, fontWeight: 600, letterSpacing: '-0.6px', color: '#f7f8f8', margin: '0 0 14px', display: 'flex', alignItems: 'baseline', gap: 12 }}>
            <span style={{ fontFamily: 'var(--font-mono)', fontSize: 13, color: '#62666d' }}>{String(i + 1).padStart(2, '0')}</span>
            {s.h}
          </h2>
          {s.body.map((b, j) => <p key={j} style={{ fontSize: 15, color: '#8a8f98', lineHeight: 1.7, margin: '0 0 14px' }}>{b}</p>)}
        </section>
      ))}

      <div style={{ marginTop: 40, paddingTop: 24, borderTop: '1px solid #23252a', fontSize: 14, color: '#62666d', lineHeight: 1.6 }}>
        Questions about this document? Write to <a href="mailto:info@greysurface.com" style={{ color: '#828fff', fontFamily: 'var(--font-mono)', textDecoration: 'none' }}>info@greysurface.com</a>. This page is provided for illustration on a demonstration site and is not legal advice.
      </div>
    </article>
  </>
);

const TermsPage = () => (
  <LegalDoc
    eyebrow="Legal" title="Terms of Service" updated="May 2026"
    intro="These terms govern your use of the GreySurface website and the engagements we deliver. Specific engagements are also governed by a signed Master Services Agreement (MSA), Statement of Work (SOW), and Rules of Engagement (ROE), which take precedence where they differ from these terms."
    sections={[
      { h: 'Acceptance of terms', body: ['By accessing this website or engaging GreySurface for services, you agree to these terms. If you are agreeing on behalf of an organization, you represent that you have authority to bind that organization.'] },
      { h: 'Scope of services', body: ['GreySurface provides manual penetration testing, red teaming, and related security assessment services. The precise scope, deliverables, and timeline of any engagement are defined in the applicable SOW.', 'Testing is performed only against assets explicitly authorized in writing. We do not test systems outside the agreed scope under any circumstances.'] },
      { h: 'Authorization and rules of engagement', body: ['You warrant that you are authorized to permit testing of all in-scope assets, including any hosted by third parties, and that you have obtained any necessary consents. Each engagement is bracketed by a signed ROE specifying allowlists, test windows, and emergency-contact procedures.'] },
      { h: 'Confidentiality', body: ['Findings, reports, and any data accessed during an engagement are treated as your confidential information and handled under the mutual NDA executed prior to work commencing. We retain engagement evidence only as long as necessary and destroy it on request after the retention period.'] },
      { h: 'Deliverables and retesting', body: ['Reports and evidence packs are delivered as specified in the SOW. One-off engagements include retesting of remediated High and Critical findings within 90 days of report delivery; continuous programs include retesting for the contract term.'] },
      { h: 'Limitation of liability', body: ['Security testing is inherently a point-in-time, best-effort exercise. GreySurface does not warrant that an engagement identifies every vulnerability. To the maximum extent permitted by law, liability arising from an engagement is limited to the fees paid for that engagement.'] },
      { h: 'Changes to these terms', body: ['We may update these terms from time to time. Material changes affecting active engagements will be communicated directly to the engagement contact.'] },
    ]}
  />
);

const PrivacyPage = () => (
  <LegalDoc
    eyebrow="Legal" title="Privacy Policy" updated="May 2026"
    intro="This policy explains what information GreySurface collects through this website and during engagements, how we use it, and the choices you have. We collect as little as possible and keep it no longer than necessary."
    sections={[
      { h: 'Information we collect', body: ['From the website: the contact details you submit through scoping and contact forms (name, work email, company, and any context you provide), and standard server and analytics logs.', 'During engagements: only the data necessary to perform and document the assessment, as defined in the SOW and ROE. We do not exfiltrate or retain customer data beyond what is required as evidence.'] },
      { h: 'How we use information', body: ['To respond to scoping requests, deliver engagements, produce reports and attestations, and meet our legal and contractual obligations. We do not sell personal data, and we do not use engagement data for any purpose beyond the engagement.'] },
      { h: 'Legal bases (GDPR)', body: ['Where the GDPR applies, we process personal data on the basis of legitimate interest (responding to your inquiry), contract performance (delivering services), and legal obligation. You have rights of access, rectification, erasure, and objection, which you can exercise via the contact below.'] },
      { h: 'Data retention', body: ['Contact-form submissions are retained only as long as needed to follow up. Engagement evidence is retained for the period defined in the SOW (typically 90 days post-delivery) and then securely destroyed, unless a longer period is required by law or mutually agreed.'] },
      { h: 'Data security', body: ['Engagement data is encrypted in transit and at rest, access is restricted to the assigned testers, and sensitive material is exchanged over encrypted channels. We support PGP for sensitive correspondence.'] },
      { h: 'Third parties', body: ['We use a small number of vetted processors (for example, email and hosting) under data-processing agreements. We do not share your information with advertisers or data brokers.'] },
      { h: 'Contact', body: ['For privacy requests or questions, write to info@greysurface.com. For vulnerabilities discovered in our own systems, use the responsible-disclosure channel on our contact page.'] },
    ]}
  />
);

const LegalApp = () => {
  const which = window.LEGAL_PAGE;
  const Page = which === 'privacy' ? PrivacyPage : TermsPage;
  return (
    <div style={{ background: '#010102', minHeight: '100vh' }}>
      <Nav />
      <main style={{ paddingTop: 56 }}>
        <Page />
        <Footer />
      </main>
    </div>
  );
};

Object.assign(window, { LegalDoc, TermsPage, PrivacyPage, LegalApp });