/* global React, Placeholder */

const About = () => {
  return (
    <section className="section about" id="about" data-screen-label="03 About">
      <div className="container">
        <div className="about-grid">
          <div className="about-portrait">
            <Placeholder kind="portrait" />
            <div className="stamp">
              <div className="big">47</div>
              <div className="small">Years on Main Street</div>
            </div>
          </div>

          <div className="about-copy">
            <div className="eyebrow">About the shop</div>
            <h2>A Murphys family, three generations deep.</h2>
            <p className="lead">
              Bill Fillmore opened the doors in 1978 with a pickup, a framing hammer,
              and a promise: do honest work for honest neighbors.
            </p>
            <p>
              Today his son Tom runs the crew, and his grandson Cole is on the saw.
              We've built decks for half the houses on Algiers Street and re-roofed
              most of the cabins on the way up to Arnold. If you've lived here a while,
              there's a good chance we know your driveway.
            </p>
            <p>
              We aren't the biggest outfit in Calaveras County and we don't try to be.
              We answer our own phone, we show up when we say we will, and we clean up
              before we leave. That's the whole pitch.
            </p>

            <div className="about-signature">
              <div className="signature-script">Tom &amp; Cole Fillmore</div>
              <div className="signature-line">
                <div className="name">Tom Fillmore</div>
                <div className="role">Owner · CSLB #487201</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
};

window.About = About;