/* eslint-disable */
// About, content brief v4, section 10 (Draft throughout).
// The firm's story and the team as a group. No founder-forward framing.
// The philosophy has moved to How we work; About stays short.

// Bio convention, set by the client: open with the first name, no job title and no
// company name -- the card already shows both. Do not reword the substance; the
// text is the client's. Issey's and Nick's copy is deliberately pronoun-free.
const ABOUT_TEAM = [
{ name: "Janey Treleaven", role: "Founder & CEO", img: "assets/team/janey-treleaven.webp",
  blurb: "Janey is a strategist and transformation leader with over two decades in financial services, technology and payments, including executive roles at Commonwealth Bank and Macquarie Group. She was also the first female Rear Commodore of the Cruising Yacht Club of Australia. She helps small and medium businesses find where AI can genuinely improve how they operate. Her aim is to take the fear out of AI so they can stay competitive." },
{ name: "Issey Stevens", role: "Head of AI Engineering", img: "assets/team/issey-stevens.webp",
  blurb: "Issey is a Computer Science and Mathematics graduate from the University of Manchester, who moved from London to Sydney after building custom chatbots and private agents that learn from business data. Evaluates AI tools against client criteria, then engineers and optimises the solutions that follow." },
{ name: "Arsh Zair", role: "Principal Consultant, AI & Technology", img: "assets/team/arsh-zair.webp",
  blurb: "Arsh specialises in helping organisations adopt their core AI tools through human-centred agent and workflow design. A background spanning solution architecture, UX design and digital transformation gives him a practical eye for where AI fits inside how people already work." },
{ name: "Nick Drummond", role: "AI Engineering Associate", img: "assets/team/nick-drummond.webp",
  blurb: "Nick is completing a Software Engineering degree at UNSW, with a foundation in software architecture, systems design and the principles behind modern AI. Builds the intelligent agents and data pipelines behind client solutions, bringing a structured engineering approach to practical, high-quality work." },
{ name: "Alma Spies-Kostrup", role: "UI/UX Lead", img: "assets/team/alma-spies-kostrup.webp",
  blurb: "Alma designs and builds AI-powered tools across user research, interface design and implementation. She holds a Master's in Interaction Design from UTS and a bachelor's in Communication and IT from the University of Copenhagen. Her work spans client delivery and internal tooling, making intelligent systems people can understand and trust." },
{ name: "Edwin Tang", role: "AI Engineering Associate", img: "assets/team/edwin-tang.webp",
  blurb: "Edwin is a software engineer focused on scalable distributed systems and algorithm optimisation. He's completing a double degree in Computer Science and Advanced Mathematics (Applied) at UNSW. He designs and builds AI-driven solutions for clients. His aim is always a balanced application of AI, never an overengineered one." },
{ name: "Zac Fidler", role: "AI Engineering Associate", img: "assets/team/zac-fidler.png",
  blurb: "Zac holds a double bachelor's with honours in software engineering and finance, and got his start in startups as a full-stack engineer. He's drawn to software the way he's drawn to puzzles: a system with a solution buried in it somewhere. He builds AI-powered tools for clients, from architecture through to the conversations that shape them." },
{ name: "Tilly Marinoni", role: "Business Manager", img: "assets/team/tilly-marinoni.webp",
  blurb: "Tilly brings energy and organisation to the team's day-to-day operations. She is currently completing a Bachelor of Communications and Media, majoring in Marketing and PR. Outside of work, Tilly loves cooking up new recipes and travelling to new destinations." }];

function AboutV2Screen({ go, t }) {
  // Roster comes from team/team.json in the bucket when it is there, so a
  // joiner or leaver needs no code change. ABOUT_TEAM is the fallback.
  const team = useTeamManifest(ABOUT_TEAM);

  return (
    <div data-screen-label="14 About">
      {/* HERO — same pattern as the other interior pages */}
      <section className="hero dot-grid acc-hero acc-hero--blend">
        <div className="container">
          <Crumbs items={[{ label: "Home", to: "home" }, "About"]} go={go} />
          <div className="svc-hero svc-hero--solo">
            <div>
              <h1 className="h-display" style={{ maxWidth: "16ch" }}>About <em>Intelligence Assist</em></h1>
              <p className="lede ab-lede" style={{ maxWidth: "56ch" }}>
                We started Intelligence Assist because we could see two things at once: how much AI
                could genuinely help Australian organisations, and how easy it was to get it wrong
                without the right foundations.
              </p>
              <p className="ab-tail">We've been helping businesses close that gap ever since.</p>
            </div>
          </div>
        </div>
      </section>

      {/* THE TEAM */}
      <section className="section section--paper" style={{ paddingTop: 72, paddingBottom: 72 }}>
        <div className="container">
          <div className="section-head section-head--center" style={{ marginBottom: 32 }}>
            <h2 className="h-section" style={{ textAlign: "center", maxWidth: "20ch" }}>The Team</h2>
          </div>
          <div className={`tcv-${t.teamCard || "current"}`}>
          <div className="team-grid">
            {team.map((p) => (
              <figure className="team-card" key={p.name} tabIndex={0}>
                <div className="team-photo">
                  <SiteImage path={p.img} alt={p.name} caption={p.name} fit="cover" />
                  <div className="team-hover">
                    <p className="team-hover-blurb">{p.blurb}</p>
                  </div>
                </div>
                <figcaption>
                  <div className="team-name">{p.name}</div>
                  <div className="team-role">{p.role}</div>
                </figcaption>
              </figure>
            ))}
          </div>
          </div>
        </div>
      </section>

      {/* RECOGNITION */}
      <section className="section recognition-band">
        <div className="container">
          <div className="about-recognition">
            <div>
              <Eyebrow>Recognition</Eyebrow>
              <p className="recognition-statement">
                Australian AI Awards finalists, for <em>AI Consultant of the Year</em> and
                <em> AI Female Leader of the Year</em>, both in the SME category.
              </p>
            </div>
            <div className="badge-row">
              <div className="badge-item">
                <img src="assets/award-ai-consultant-2024.png" alt="Australian AI Awards 2024 finalist, AI Consultant of the Year, SME" />
                <span className="badge-cap"><b>Finalist</b>AI Consultant of the Year, SME<span className="badge-cap-awards">Australian AI Awards 2024</span></span>
              </div>
              <div className="badge-item">
                <img src="assets/award-ai-female-leader-2024.png" alt="Australian AI Awards 2024 finalist, AI Female Leader of the Year, SME" />
                <span className="badge-cap"><b>Finalist</b>AI Female Leader of the Year, SME<span className="badge-cap-awards">Australian AI Awards 2024</span></span>
              </div>
            </div>
          </div>
        </div>
      </section>

      {/* SPEAKING — centred statement, like the Home thesis (layout X) */}
      <section className="section section--paper" style={{ paddingTop: 88, paddingBottom: 88 }}>
        <div className="container">
          <div className="speaking-centre">
            <Eyebrow plain>Speaking and community</Eyebrow>
            <p className="speaking-lead">
              Our team speaks regularly on AI adoption, governance and literacy, at industry
              events, board forums and community sessions. If you'd like us to speak at yours,
              we'd love to hear from you.
            </p>
            <Button onClick={() => go("contact")}>Get in touch</Button>
          </div>
          {/* One portrait shot, one landscape. The row is uniform-height with
              natural widths, so neither gets cropped to a shared aspect ratio. */}
          <div className="speaking-shots">
            <div className="speaking-shot">
              <SiteImage path="assets/photos/speaking-s2s-summit-1.webp"
                alt="Two of the Intelligence Assist team at the S2S Summit" fit="cover" />
            </div>
            <div className="speaking-shot">
              <SiteImage path="assets/photos/speaking-s2s-summit-2.webp"
                alt="Two of the Intelligence Assist team at the S2S Summit backdrop" fit="cover" />
            </div>
          </div>
        </div>
      </section>

      {/* BUILT WITH — slim full-width notice strip (layout X) */}
      <section className={"builtwith-strip builtwith-strip--" + (t.builtWith || "band")}>
        <div className="container builtwith-strip-in"><div className="builtwith-card">
          <p><b>Built with the tools we recommend.</b> We use the same AI tools we suggest to clients, every day, and this website was designed and built with them too.</p>
          {!IA_MVP() && <LinkOut onClick={() => go("toolbox")}>See the AI Toolbox</LinkOut>}
          </div>
        </div>
      </section>

      {/* FAQ */}
      <section className="section section--white" style={{ paddingTop: 56, paddingBottom: 72 }}>
        <div className="container">
          <PageFAQ pageId="about" go={go} eyebrow="Common questions" title="About Intelligence Assist" />
        </div>
      </section>

      {/* CTA */}
      <section className="section section--paper tbx-closer" style={{ paddingTop: 32, paddingBottom: 88 }}>
        <div className="container">
          <div className="hww-closer">
            <p className="hww-closer-t">
              Got a question we haven't answered? <em>That's a good conversation to have.</em>
            </p>
            <Button variant="primary" size="lg" onClick={() => go("contact")}>
              Talk to us <Icon name="arrow-right" size={16} className="arrow" />
            </Button>
          </div>
        </div>
      </section>

    </div>);
}

window.AboutV2Screen = AboutV2Screen;
