/* ============================================================
   Formação AIBP — página interna
   Mesma composição da página do AI Comms Operations: reaproveita os
   componentes .acx-* (hero, wrap, section, lead, statement, h2, painel
   escuro) de ai-comms.css; aqui ficam só as peças próprias desta página.
   ============================================================ */

/* ---------- Hero: arte clara vira um cartão arredondado ---------- */
.acx-hero-fig.aib-hero-fig {
  mix-blend-mode: normal;
  -webkit-mask-image: none; mask-image: none;
  top: 50%; bottom: auto;
  transform: translateY(-46%);
  right: max(var(--gutter), calc((100vw - var(--container-max)) / 2 + var(--gutter)));
  width: min(44%, 520px);
  height: min(430px, 64%);
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.65);
}
.aib-hero-fig img { object-position: 50% 50%; opacity: 1; }

/* ---------- O que o AIBP faz ---------- */
.aib-faz { display: grid; grid-template-columns: 1.1fr .9fr; gap: var(--space-8); align-items: center; margin-top: var(--space-6); }
.aib-faz ol { list-style: none; counter-reset: aib; margin: 0; padding: 0; }
.aib-faz li {
  counter-increment: aib;
  display: flex; align-items: baseline; gap: var(--space-4);
  padding: 15px 0; border-top: 1px solid var(--hairline);
  font-size: 1rem; line-height: 1.45; color: var(--haikai-black);
}
.aib-faz li:last-child { border-bottom: 1px solid var(--hairline); }
.aib-faz li::before {
  content: counter(aib, decimal-leading-zero);
  font-family: var(--font-display); font-weight: var(--fw-bold); font-size: 1.1rem; color: var(--haikai-blue);
  min-width: 2.2ch; flex: none;
}
.aib-faz-art {
  aspect-ratio: 4 / 3; border-radius: var(--radius-xl); overflow: hidden;
  background: #fff; border: 1px solid var(--hairline); box-shadow: var(--shadow-card);
}
.aib-faz-art img { width: 100%; height: 100%; object-fit: cover; object-position: 100% 60%; display: block; }

/* ---------- Lógica dos Business Partners ---------- */
.aib-bp { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); margin: var(--space-6) 0 var(--space-5); }
.aib-bp > div { padding: var(--space-5) var(--space-5) var(--space-5) 0; }
.aib-bp > div + div { padding-left: var(--space-5); border-left: 1px solid var(--hairline); }
.aib-bp b { display: block; font-family: var(--font-display); font-weight: var(--fw-bold); font-size: 1.15rem; margin-bottom: 6px; }
.aib-bp span { display: block; font-size: .95rem; line-height: 1.5; color: var(--gray-600); }
.aib-bp .is-aibp b { color: var(--haikai-blue); }
.aib-bp .is-aibp span { color: var(--haikai-black); }

/* ---------- Para quem é ---------- */
.aib-ideal { font-size: .85rem; font-weight: var(--fw-semibold); color: var(--haikai-blue-ink); margin: var(--space-6) 0 var(--space-3); }
.aib-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; }
.aib-chips li { background: var(--white); border: 1px solid var(--hairline); border-radius: var(--radius-pill); padding: 8px 16px; font-size: .9rem; color: var(--haikai-black); }

/* ---------- Responsivo ---------- */
@media (max-width: 960px) {
  .aib-faz { grid-template-columns: 1fr; gap: var(--space-6); }
  .aib-bp { grid-template-columns: 1fr; }
  .aib-bp > div, .aib-bp > div + div { padding: var(--space-4) 0; border-left: 0; }
  .aib-bp > div + div { border-top: 1px solid var(--hairline); }
}
@media (max-width: 720px) {
  .acx-hero-fig.aib-hero-fig { position: relative; top: auto; right: auto; transform: none; width: auto; height: 260px; margin: var(--space-6) var(--gutter); }
}
