/* ============================================================
   Página: Soluções Bancárias (artboard 02, 1920x3671)
   Faixas: hero 0–637 · conta empresarial 637–1258 (branco) ·
   escrow 1258–1883 (escuro) · IA 1883–2484 (branco) ·
   ERP 2484–3148 (escuro) · footer
   ============================================================ */

/* ---------- hero ---------- */
.hero .eyebrow { margin-bottom: .9em; }
.hero__lead { margin-top: .8em; max-width: 28em; }

/* ---------- bandas com altura proporcional ao artboard ---------- */
.sb-band { display: flex; align-items: center; }
.sb-band > .container { width: min(var(--container), calc(100% - 2 * var(--gutter))); }
.sb-emp    { min-height: min(32.34vw, 621px); }
.sb-escrow { min-height: min(32.55vw, 625px); }
.sb-ia     { min-height: min(31.30vw, 601px); }
.sb-erp    { min-height: min(34.58vw, 664px); }

/* títulos das seções deste artboard usam peso médio (500) */
.sb-band .section-title { font-weight: 500; }
.sb-band .eyebrow { margin-bottom: .85em; }

/* ---------- layout em duas colunas ---------- */
.split {
  display: grid;
  align-items: center;
}
.split--emp {
  grid-template-columns: minmax(0, 32fr) minmax(0, 63fr);
  gap: clamp(2rem, 3.2vw, 3.8rem);
}
.split--escrow,
.split--erp { grid-template-columns: minmax(0, 56fr) minmax(0, 44fr); }
.split--ia  { grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); }

/* larguras de texto que reproduzem as quebras do design */
.split--emp    .section-text { max-width: 21.5em; }
.split--escrow .section-text { max-width: 26em; }
.split--ia     .section-text { max-width: 25em; }
.split--erp    .section-text { max-width: 22.5em; }

/* ---------- conta empresarial: grid de ícones ---------- */
.sb-emp .icon-grid {
  gap: clamp(2.5rem, 5.2vw, 6.25rem) clamp(1rem, 2.5vw, 3rem);
}

/* ---------- monitoramento por IA: grid 2x2 de icon-rows ---------- */
.ia-grid {
  display: grid;
  grid-template-columns: minmax(0, 57fr) minmax(0, 43fr);
  row-gap: clamp(2rem, 2.4vw, 2.9rem);
  align-items: start;
}
.sb-ia .icon-row { gap: clamp(.8rem, .95vw, 1.15rem); }
.sb-ia .icon-row__icon { width: clamp(34px, 2.7vw, 52px); }
.sb-ia .icon-card__desc { max-width: 23em; }

/* no desktop os títulos ficam em uma linha (no design a coluna
   direita avança levemente além da régua do container) */
@media (min-width: 1280px) {
  .sb-ia .icon-card__title { white-space: nowrap; }
}

/* ---------- footer: remove marcadores herdados (li é list-item
   dentro do grid em .site-footer__col ul; o design não tem bullets) ---------- */
.site-footer__col li { list-style: none; }
.site-footer__col ul { padding: 0; margin: 0; }

/* ---------- responsivo ---------- */
/* 921–1100: colunas estreitas — sem as quebras fixas os rótulos não geram
   órfãs ("e" sozinho) e as duas colunas de features ganham gutter real */
@media (min-width: 921px) and (max-width: 1100px) {
  .sb-emp .icon-card__title br { display: none; }
  .sb-emp .icon-card__title { text-wrap: balance; }
  .ia-grid { column-gap: 2.5rem; }
}

@media (max-width: 920px) {
  .split--emp,
  .split--escrow,
  .split--ia,
  .split--erp { grid-template-columns: 1fr; gap: clamp(2rem, 5vw, 3rem); }
  .split .section-text { max-width: none; }
}

@media (max-width: 600px) {
  .ia-grid { grid-template-columns: 1fr; }
}