// B&L ENGENHARIA — Página SOBRE
// Reaproveita: Sobre, Stats, Inovacao, Socios (componentes do site) + Valores, PageHero, PageCTA.

function Escritorio() {
  return (
    <section className="escritorio" data-screen-label="Sobre · O escritório">
      <div className="wrap-wide">
        <div className="escritorio-head">
          <div className="eyebrow">07 / O escritório</div>
          <h2>Onde os projetos <span className="italic">acontecem</span>.</h2>
          <p>
            Estúdio próprio em Ribeirão Preto, onde os três sócios trabalham lado a lado —
            do lançamento à entrega de cada obra, com acompanhamento direto em todas as fases.
          </p>
        </div>
        <figure className="escritorio-lead" data-screen-label="Sobre · Sócios">
          <img
            src="assets/equipe/equipe-mesa.jpg"
            alt="Os três sócios da B&L analisando um projeto sobre a mesa de luz"
            loading="lazy" />
          <figcaption className="escritorio-cap">
            <span>O núcleo técnico que assina cada projeto</span>
            <span className="escritorio-tag">Ribeirão Preto · SP</span>
          </figcaption>
        </figure>
      </div>
    </section>);

}

function SobrePage() {
  return (
    <React.Fragment>
      <Nav active="sobre" />

      <PageHero
        eyebrow="Sobre · Quem somos"
        title={<>Engenharia que se <span className="italic">assina</span>.</>}
        lead={
          <>
            Há 24 anos a B&amp;L Engenharia projeta instalações hidrossanitárias, infraestrutura
            e prevenção de incêndio para construtoras e incorporadoras em todo o Brasil — com
            método BIM, núcleo técnico próprio e a assinatura dos três sócios em cada projeto.
          </>
        }
        meta={[
          { num: "24", label: "anos de atuação" },
          { num: "100+", label: "construtoras atendidas" },
          { num: "3", label: "sócios-diretores" },
        ]}
      />

      <Sobre />
      <Stats />
      <Inovacao />
      <Valores />
      <Socios />
      <Escritorio />

      <PageCTA
        eyebrow="Vamos trabalhar juntos"
        title={<>Conheça de perto o <span className="italic">jeito B&amp;L</span> de projetar.</>}
      />

      <Footer />
      <WaFloat />
    </React.Fragment>
  );
}

window.SobrePage = SobrePage;
