/* PCE ITBI
   Figma: desktop 5126:42560 — só estrutura. A copy está em copy/itbi.md.
   Mesmo molde do ITCMD: hero em render 3D gerado no Lupa, na linha do PCE BI
   e da Certificado Digital. Diferenças: Como funciona com três etapas, contato
   só com título e uma seção de benefícios com três cards, que o Figma não tem
   e o briefing pede. */

/* 01 — Hero */
.itbi-hero {
  height: 100vh;
  min-height: 758px;
}

.itbi-hero .core-hero__background {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%),
    var(--black) url("assets/itbi/hero-desktop@2x.webp") 72% center / cover no-repeat;
}

.itbi-hero h1 {
  max-width: 1200px;
}

/* 02 — Como funciona: três etapas, cards de 388px como no Figma. */
.itbi-process .core-process__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* 03 — Vantagens: três cards iguais de 388px, como no ITCMD. */
.itbi-advantages {
  background: var(--white);
}

.itbi-advantages .core-advantages__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.itbi-advantages .core-advantage,
.itbi-advantages .core-advantage:nth-child(3) {
  grid-column: auto;
  grid-template-rows: 380px minmax(160px, auto);
}

.itbi-advantages .core-advantage > img,
.itbi-advantages .core-advantage:nth-child(1) > img,
.itbi-advantages .core-advantage:nth-child(2) > img,
.itbi-advantages .core-advantage:nth-child(3) > img {
  height: 380px;
  object-position: center;
}

/* 04 — Benefícios: três cards, a mesa de trabalho com persianas (ensaio,
   PCE-178). */
.itbi-benefits {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.58)),
    url("assets/itbi/beneficios-bg@2x.webp") center / cover no-repeat;
}

.itbi-benefits .bpo-benefits__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 767px) {
  .itbi-hero {
    min-height: 780px;
  }

  .itbi-hero .core-hero__background {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%),
      var(--black) url("assets/itbi/hero-mobile@2x.webp") center / cover no-repeat;
  }

  /* As regras de três colunas acima vencem as de coluna única do pce-core.css e
     do pce-bpo.css por especificidade; aqui elas são devolvidas. */
  .itbi-process .core-process__grid,
  .itbi-advantages .core-advantages__grid,
  .itbi-benefits .bpo-benefits__grid {
    grid-template-columns: 1fr;
  }

  .itbi-advantages .core-advantage,
  .itbi-advantages .core-advantage:nth-child(3) {
    grid-column: 1;
  }
}