// B&L ENGENHARIA — Página SERVIÇOS
// Três disciplinas detalhadas + seção BIM (componente reaproveitado).

const DISCIPLINAS = [
  {
    n: "S/01",
    title: <>Infra<span className="italic">estrutura</span></>,
    tags: ["Água potável", "Esgoto", "Drenagem"],
    lead: (
      <>
        Redes de água potável, esgoto sanitário e drenagem pluvial — dimensionadas
        para o porte do empreendimento e <span className="italic">aprovadas</span> nas concessionárias.
      </>
    ),
    body: (
      <>
        Projetos completos de infraestrutura, desenvolvidos com excelência técnica,
        eficiência operacional e total conformidade com as normas vigentes. Entregamos soluções
        já validadas junto às concessionárias responsáveis, prontas para execução.
      </>
    ),
    list: [
      "Rede de distribuição de água potável",
      "Esgotamento sanitário e estações elevatórias",
      "Drenagem de águas pluviais",
      "Aprovação junto às concessionárias",
    ],
  },
  {
    n: "S/02",
    title: <>Instalações <span className="italic">Hidrossanitárias</span></>,
    tags: ["Hidráulica", "Reúso", "Sustentável"],
    lead: (
      <>
        Projetos hidrossanitários para os mais diversos empreendimentos, com uma visão
        <span className="italic"> sustentável</span> da água em cada edificação.
      </>
    ),
    body: (
      <>
        Incorporamos sistemas de reaproveitamento de água cinza e captação pluvial para fins
        não potáveis — combinando economia, sustentabilidade e eficiência hídrica. Da coluna
        de distribuição ao último ponto de consumo, tudo dimensionado e compatibilizado.
      </>
    ),
    list: [
      "Água fria e água quente",
      "Esgoto sanitário",
      "Reúso de águas cinzas",
      "Aproveitamento de água pluvial",
    ],
  },
  {
    n: "S/03",
    fire: true,
    title: <>Prevenção e Combate a <span className="italic">Incêndio</span></>,
    tags: ["PCI", "Bombeiros", "AVCB"],
    lead: (
      <>
        Projetos executivos e processos de aprovação junto ao Corpo de Bombeiros em todo o
        território <span className="italic">nacional</span>.
      </>
    ),
    body: (
      <>
        Soluções completas para edificações de diferentes portes, com foco em proteção à vida,
        segurança patrimonial e conformidade técnica. Conduzimos o projeto da concepção à
        emissão do AVCB, sem retrabalho na aprovação.
      </>
    ),
    list: [
      "Hidrantes e mangotinhos",
      "Chuveiros automáticos (sprinklers)",
      "Detecção e alarme de incêndio",
      "Aprovação e emissão de AVCB",
      "Demais medidas de proteção e combate a incêndio",
    ],
    note: "Projetos aprovados conforme as normas do Corpo de Bombeiros.",
  },
];

function DisciplinaItem({ d }) {
  return (
    <article className={"svcd-item" + (d.fire ? " is-fire" : "")}>
      <div className="svcd-left">
        <div className="svcd-index">{d.n}</div>
        <h3 className="svcd-title">{d.title}</h3>
        <div className="svcd-tags">
          {d.tags.map((t) => <span className="svcd-tag" key={t}>{t}</span>)}
        </div>
      </div>
      <div className="svcd-right">
        <p className="svcd-lead">{d.lead}</p>
        <p className="svcd-body">{d.body}</p>
        <ul className="svcd-list">
          {d.list.map((li) => <li key={li}>{li}</li>)}
        </ul>
        {d.note && <div className="svcd-note">{d.note}</div>}
      </div>
    </article>
  );
}

function ServicosPage() {
  return (
    <React.Fragment>
      <Nav active="servicos" />

      <PageHero
        eyebrow="Serviços · Disciplinas"
        title={<>Três disciplinas, uma só <span className="italic">entrega</span> técnica.</>}
        lead={
          <>
            Cada projeto B&amp;L passa por compatibilização integral entre infraestrutura,
            hidráulica e incêndio — modelado em BIM, revisado e com assessoria durante
            toda a obra.
          </>
        }
        meta={[
          { num: "03", label: "disciplinas integradas" },
          { num: "BIM", label: "em todos os projetos" },
          { num: "BR", label: "aprovação nacional" },
        ]}
      />

      <section className="svcd">
        <div className="wrap-wide">
          <div className="svcd-intro">
            <div>
              <div className="eyebrow">Como entregamos</div>
              <h2>Engenharia que se <span className="italic">resolve no projeto</span>.</h2>
            </div>
            <p>
              Antes da primeira viga, todas as disciplinas convivem em um único modelo federado.
              É assim que antecipamos interferências, evitamos retrabalho em obra e protegemos
              o orçamento do empreendimento.
            </p>
          </div>

          <div className="svcd-list-wrap">
            {DISCIPLINAS.map((d) => <DisciplinaItem key={d.n} d={d} />)}
          </div>
        </div>
      </section>

      <BIM />

      <PageCTA
        eyebrow="Tem um projeto em vista?"
        title={<>Conte o que vai construir — nós <span className="italic">projetamos</span>.</>}
        primaryLabel="Pedir um anteprojeto"
      />

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

window.ServicosPage = ServicosPage;