/* ==========================================================================
   Section 03 — Who we are (compressed Part I)
   ========================================================================== */

function WhoWeAre() {
  return (
    <section className="part" id="who-we-are" data-screen-label="03 Who We Are">
      <PartHeader
        part="II"
        title="Who We Are"
        meta="Lines 1–2 · Practice &amp; lineage"
        instructions="A short history of the firm, and the people who have signed its returns."
      />

      <div style={{
        display: "grid",
        gridTemplateColumns: "1.5fr 1fr",
        gap: 56,
        padding: "32px 0 0",
        alignItems: "start",
      }}>
        <div>
          <div className="prose drop-cap">
            <p>
              Barlow &amp; Hughan LLP is an independent San Francisco CPA firm that has served Bay Area individuals, families, and their closely-held entities since 1946 &mdash; often the same families across four generations, from parents to children to grandchildren.
            </p>
            <p>
              The practice traces to a 1946 sole proprietorship &mdash; Barlow, Davis &amp; Wood &mdash; run by Wm. P. Barlow, Sr. His son joined in 1960, became partner in 1964, and in 1990 co-founded this firm with Wade Hughan, whose name it still bears. Vassil Gotzev joined the firm in early 2000 and has been serving clients here ever since. Wade Hughan retired in 2022; both Barlows have since passed. Today the practice is led by Vassil Gotzev.
            </p>
            <p>
              We stay right-sized on purpose. Work is personal: a partner reads every return, nothing is outsourced, and no file leaves the country.
            </p>
          </div>
        </div>

        <aside>
          <div style={{ border: "2px solid var(--ink)", padding: 20 }}>
            <div className="label" style={{ marginBottom: 12 }}>Line 2 &middot; Four generations of partnership</div>
            <div style={{ fontFamily: "var(--mono)", fontSize: "var(--t-body)", lineHeight: 1.7 }}>
              {[
                ["Wm. P. Barlow, Sr.", "1946",      "Founder · predecessor firm"],
                ["Wm. P. Barlow, Jr.", "1960–1964", "Joined · partner · 1990 co-founder"],
                ["Wade Hughan",        "1990–2022", "Co-founder · retired 2022"],
                ["Vassil Gotzev",      "2000 –",    "Joined 2000 · current principal", true],
              ].map(([name, when, role, current], i, arr) => (
                <div key={name} style={{
                  display: "grid",
                  gridTemplateColumns: "1fr auto",
                  borderBottom: i < arr.length - 1 ? "1px dashed var(--rule-thin)" : "none",
                  padding: "7px 0",
                  gap: 10,
                }}>
                  <span style={current ? { color: "var(--stamp-red)", fontWeight: 700 } : {}}>{name}</span>
                  <span style={{ color: "var(--ink-muted)", fontSize: "var(--t-cap)", textAlign: "right" }}>
                    {when}
                    <div style={{ fontSize: "var(--t-cap)", marginTop: 2 }}>{role}</div>
                  </span>
                </div>
              ))}
            </div>
          </div>
        </aside>
      </div>

      {/* Full-width closing paragraph — reads like a Line 2.1 addendum */}
      <div style={{
        marginTop: 40,
        paddingTop: 20,
        borderTop: "1px solid var(--rule-thin)",
      }}>
        <div style={{
          display: "flex",
          alignItems: "baseline",
          gap: 14,
          marginBottom: 14,
          flexWrap: "wrap",
        }}>
          <div className="label">Line 2.1</div>
          <div style={{
            fontFamily: "var(--mono)",
            fontSize: "var(--t-cap)",
            letterSpacing: "0.08em",
            color: "var(--ink-soft)",
            textTransform: "uppercase",
          }}>On staying current</div>
        </div>
        <p style={{
          fontFamily: "var(--serif)",
          fontSize: "15px",
          lineHeight: 1.65,
          color: "var(--ink)",
          textWrap: "pretty",
          margin: 0,
        }}>
          Our office has always been in San Francisco &mdash; on top of the tech waves, not behind them. From pencil to typewriter to PC to paperless, the firm has adjusted its skills to each generation of tooling. Our latest step is in-house AI-powered automation, applied to quality control, workflow efficiency, and client communication &mdash; with every output reviewed by a licensed CPA before it reaches you. Many of our clients are the people driving these changes for the world; we&rsquo;re glad to ride the same waves alongside them.
        </p>
      </div>
    </section>
  );
}

Object.assign(window, { WhoWeAre });