/* CX Defense — About page */
const { Nav, Rule, PageHero, Banner, CTA, Footer } = window;

const VALUES = [
  ['Engineering over theatre', "We measure ourselves by what holds in production, not what looks impressive in a slide deck. Every control we recommend is one we're prepared to build, configure, and defend."],
  ['Honesty in scope', "If a problem doesn't need solving, we say so. If it's outside our depth, we tell you before you pay. We'd rather lose a fee than deliver work that doesn't serve you."],
  ['Evidence, not opinion', 'Findings tied to sources. Decisions tied to reasons. Architecture tied to documented threat models. You should never have to take our word for anything.'],
  ['Quiet professionalism', 'Your environment, your incidents, and your weaknesses are confidential from the first message. We don\u2019t discuss clients, cases, or methods publicly. Discretion is the nature of the work.'],
];

function App() {
  return (
    <div className="site">
      <Nav active="about.html" />
      <PageHero label="About CX Defense" title="Two crafts. One conviction. <em>No noise.</em>">
        CX Defense was built where digital intelligence meets network engineering — by people who practiced both long before they named a company after it.
      </PageHero>
      <Banner img="assets/img/monolith.png" caption="Quiet strength · the standard we build to" />
      <div style={{ marginTop: 64 }}><Rule /></div>

      <div className="prose">
        <p className="lead">Every security firm says it does everything. We don't. CX Defense exists at the intersection of two disciplines that rarely live in the same room: the intelligence craft of understanding how attackers find and study their targets, and the engineering craft of building networks and infrastructure that withstand them. One without the other is incomplete. Together, they are how real defense gets built.</p>
        <p className="accent">You cannot defend a system you've never seen through an attacker's eyes.</p>
        <h2>Where we <em>come from</em></h2>
        <p>Our practice began in digital investigation — professional open-source intelligence, entity verification, infrastructure attribution, and compliance work for clients who needed answers that would hold up to scrutiny. That work taught us something most security vendors never learn first-hand: exactly how exposed organisations look from the outside, and exactly how attackers convert that exposure into access.</p>
        <p>The second half of our DNA is deep network engineering. Our team includes engineers with carrier-grade, enterprise-level expertise across firewalling, routing, VPN architecture, traffic analysis, and virtualization — people who have designed, run, and defended serious infrastructure, not just audited it. When we recommend an architecture, it's because we've built it and watched it hold.</p>
        <p>CX Defense is the deliberate combination of the two: intelligence that knows where the threats come from, and engineering that knows how to shut the door.</p>
        <h2>How we <em>work</em></h2>
        <p>We are a remote-first practice by design. Our clients get senior specialists regardless of geography, and our own operations run on the same principles we engineer for others — zero-trust access, encrypted channels, least privilege, and documentation that would survive our own audit.</p>
        <p>We keep engagements deliberately clear: defined scope, honest assessment, documented decisions. If something isn't worth doing, we say so before you spend money on it. If we're not the right team for a problem, we tell you that too.</p>
        <div className="aside">Everything we touch is handled with GDPR-grade data discipline — encrypted, access-controlled, and documented — because a security firm that can't govern itself has no business governing your risk.</div>
        <h2>What we <em>believe</em></h2>
        <p>Security has become an industry of noise — dashboards nobody reads, reports nobody acts on, fear sold by the licence. We believe the opposite of noise isn't silence; it's signal. A small number of things, engineered properly, defended consistently, and explained in language a board can act on.</p>
        <p>That's the company we built. Not the loudest in the room. The one still standing when it matters.</p>
      </div>

      <Rule />
      <div className="prose" style={{ paddingBottom: 32 }}>
        <h2 style={{ textAlign: 'center', marginTop: 32 }}>What we stand on</h2>
      </div>
      <div className="values">
        {VALUES.map(([h, p]) => (
          <div className="val" key={h}><h3>{h}</h3><p>{p}</p></div>
        ))}
      </div>

      <div style={{ marginTop: 64 }}><Rule /></div>
      <section className="section">
        <div className="split">
          <div className="col-text">
            <div className="eyebrow">The Team</div>
            <h2>Small by choice. Senior by <em>standard.</em></h2>
            <p>CX Defense is a distributed team of security engineers, network specialists, and intelligence analysts. We stay deliberately small: every engagement is handled by people senior enough to make judgement calls, and accountable enough to stand behind them.</p>
            <p>No juniors learning on your infrastructure. No account managers between you and the people doing the work. When you talk to CX Defense, you're talking to the engineers.</p>
          </div>
          <div className="img" style={{ backgroundImage: 'url(assets/img/ops-room.png)' }}></div>
        </div>
      </section>
      <Rule />
      <CTA title="The rest is <em>work</em>"
        actions={<a href="contact.html" className="btn btn-primary">Speak With Us</a>}>
        We don't have a sales team. We don't run advertising. We let the work speak. If you have infrastructure worth defending, we're ready.
      </CTA>
      <Footer />
    </div>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);