/* ============================================================
   Página: Home (artboard 01, 1920x5265)
   Faixas: hero 0–865 (grad) · sobre 865–1481 (branco) ·
   faixa 1481–1577 (ribbon) · soluções 1577–2259 (branco) ·
   antecipação 2259–2880 (grad) · máquina 2880–3587 (branco) ·
   erp 3587–4251 (grad) · ia 4251–4742 (branco) · footer
   ============================================================ */

/* ---------- hero ---------- */
/* conteúdo alinhado à borda do container (mesma da logo/header/footer) — sem o
   recuo do artboard, p/ o texto do hero e das seções começarem no eixo da logo */

.hero--865 .hero__title {
  max-width: none;
  font-size: clamp(1.875rem, 2.7vw, 3.25rem);
  font-weight: 500;
  line-height: 1.235;
}
.hero--865 .hero__lead { margin-top: 1.1em; }
.hero--865 > .container { --hero-shift: clamp(3rem, 7.9vw, 9.5rem); }
/* botões do hero seguem o padrão das demais páginas (btn--lg, largura pelo conteúdo) */

/* títulos de seção da home usam o peso médio do design */
.solucoes .section-title,
.antecip .section-title,
.maquina .section-title,
.erp .section-title,
.ia .section-title { font-weight: 500; }

/* ---------- sobre ---------- */
.sobre {
  min-height: min(32.08vw, 616px);
  display: flex;
  align-items: center;
}
.sobre .eyebrow { margin-bottom: 1.6em; }
/* rótulos de grupo no meio da seção (Nossos pilares / Nossos princípios):
   afasta do bloco acima e aproxima dos cards que rotulam */
.sobre__texts + .eyebrow.center,
.sobre__pillars + .eyebrow.center { margin-top: clamp(2.5rem, 4.4vw, 5.3rem); }
.eyebrow.center + .sobre__pillars { margin-top: 0; }
.sobre__text {
  font-size: var(--fs-body-lg);
  font-weight: 300;
  line-height: 1.45;
  text-align: center;
  max-width: 73em;
  margin-inline: auto;
}
.sobre__text + .sobre__text { margin-top: 1.4em; }
.sobre__pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.5rem, 3vw, 3.5rem);
  margin-top: clamp(2.5rem, 4.4vw, 5.3rem);
  text-align: center;
}
.sobre__pillar img {
  height: clamp(30px, 2.2vw, 42px);
  width: auto;
  margin: 0 auto clamp(.8rem, 1.3vw, 1.5rem);
}
.sobre__pillar h2 {
  font-size: clamp(1.125rem, 1.35vw, 1.625rem);
  font-weight: 400;
  line-height: 1.3;
}
.sobre__pillar p {
  font-size: var(--fs-small);
  font-weight: 300;
  line-height: 1.45;
  margin-top: .55em;
  color: var(--ink-soft);
}

/* ---------- faixa ribbon ---------- */
.ribbon {
  position: relative;
  overflow: hidden;
  background: var(--grad-ribbon);
  color: #fff;
  min-height: min(5vw, 96px);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-inline: var(--gutter);
}
.ribbon h2 {
  position: relative;
  z-index: 1;
  font-size: clamp(1.3125rem, 1.835vw, 2.2rem);
  font-weight: 500;
  letter-spacing: .005em;
}
/* onda decorativa (blend screen) atrás do texto — visível também no mobile */

/* ---------- soluções bancárias ---------- */
.solucoes {
  min-height: min(35.52vw, 682px);
  display: flex;
  align-items: center;
}
.solucoes__grid {
  display: grid;
  grid-template-columns: minmax(0, 530fr) minmax(0, 866fr);
  gap: clamp(2rem, 3.8vw, 4.5625rem);
  align-items: center;
}
.solucoes .section-title { letter-spacing: 0; }
.solucoes__intro .eyebrow { line-height: 1.7; margin-bottom: .9em; }
.solucoes__items {
  row-gap: clamp(2.5rem, 5.15vw, 6.2rem);
  column-gap: 0;
  margin-right: clamp(-191px, -9.95vw, 0px);
}
.solucoes__items .icon-card__icon { margin-bottom: 1.1rem; }

/* ---------- antecipação de recebíveis ---------- */
.antecip {
  min-height: min(32.34vw, 621px);
  display: flex;
  align-items: center;
  padding-block: clamp(2rem, 2.6vw, 3.1rem);
}
.antecip__photo {
  position: absolute;
  right: 0;
  bottom: 0;
  width: min(88.5%, 1700px);
  height: auto;
  pointer-events: none;
}
.antecip__grid {
  display: grid;
  grid-template-columns: minmax(0, 34.5%) minmax(0, 25.3%);
  column-gap: 8.1%;
  align-items: center;
}
.antecip__text {
  font-size: clamp(.875rem, .885vw, 1.0625rem);
  font-weight: 300;
  line-height: 1.5;
  margin-top: 1.4em;
  max-width: 28.5em;
}
.antecip__list {
  margin-top: clamp(1.2rem, 1.8vw, 2.2rem);
  grid-template-columns: repeat(2, auto);
  grid-template-rows: repeat(3, auto);
  grid-auto-flow: column;
  justify-content: start;
  column-gap: clamp(1.5rem, 2.9vw, 3.5rem);
  row-gap: 1em;
}
.antecip__list li {
  font-size: clamp(.8125rem, .833vw, 1rem);
  white-space: nowrap;
}
.antecip__btn { margin-top: clamp(1.5rem, 2.2vw, 2.6rem); }

.antecip__card {
  width: 100%;
  max-width: 23.2rem;
  padding: clamp(1.4rem, 1.8vw, 2.15rem) clamp(1.4rem, 2.2vw, 2.65rem) clamp(1.2rem, 1.5vw, 1.8rem);
  border-radius: 1.1rem;
}
.antecip__card-title {
  font-size: clamp(1rem, .99vw, 1.1875rem);
  font-weight: 500;
  margin-bottom: 1.55em;
}
.antecip__card .ui-card__hint { font-size: clamp(.6875rem, .677vw, .8125rem); }
.antecip__card .ui-card__value { margin-top: .05em; }
.antecip__card-gap { margin-top: clamp(1rem, 1.6vw, 1.95rem); }
.antecip__card-pill { margin-top: .55em; }
.antecip__card .btn {
  margin-top: clamp(1.1rem, 1.5vw, 1.8rem);
  font-size: clamp(.875rem, .833vw, 1rem);
  padding-block: .72em;
}

.antecip__toast {
  right: 10.4%;
  bottom: 5.3%;
  z-index: 2;
  max-width: 19.5rem;
  padding: clamp(1rem, 1.25vw, 1.5rem) clamp(1rem, 1.35vw, 1.6rem);
  align-items: flex-start;
  font-size: clamp(.75rem, .81vw, .975rem);
  line-height: 1.45;
}
.antecip__toast .ui-toast__check {
  width: clamp(1.5rem, 1.56vw, 1.875rem);
  height: clamp(1.5rem, 1.56vw, 1.875rem);
  margin-top: .1em;
}
.antecip__toast strong {
  font-size: clamp(.8125rem, .885vw, 1.0625rem);
  font-weight: 500;
  margin-bottom: .3em;
}
.antecip__toast-amount { font-weight: 500; }

/* ---------- máquina de cartão ---------- */
.maquina {
  min-height: min(36.82vw, 707px);
  display: flex;
  align-items: center;
}
.maquina__grid {
  display: grid;
  grid-template-columns: minmax(0, 602fr) minmax(0, 857fr);
  gap: clamp(.25rem, .5vw, .6rem);
  align-items: center;
}
.maquina .section-title { letter-spacing: 0; }
/* Geometria extraída do artboard 01 (overlay pos-diagram-lines.svg =
   círculo tracejado + pontos azuis + linhas pontilhadas do design).
   Wrapper medido @1920: 777x547 → tudo em % com aspect-ratio fixa. */
.maquina .pos-diagram {
  position: relative;
  display: block;
  width: min(100%, 777px);
  aspect-ratio: 777 / 547;
  min-height: 0;
  justify-self: start;
}
.maquina .pos-diagram__circle { display: none; }
.maquina .pos-diagram__lines {
  position: absolute;
  left: 19.98%;
  top: 18.04%;
  width: 61.91%;
}
.maquina .pos-diagram__img {
  position: absolute;
  left: 28.3%;
  top: 14.01%;
  width: 43.21%;
  rotate: none;
  transform: rotate(-2.8527deg);
  transform-origin: top left;
}
.maquina .pos-callout {
  position: absolute;
  width: max-content;
  max-width: none;
  translate: -50% -50%;
}
.maquina .pos-callout::after { display: none; }
.maquina .pos-callout--tl { left: 26.74%; top: 18.68%; right: auto; }
.maquina .pos-callout--tr { left: 84.40%; top: 19.04%; right: auto; }
.maquina .pos-callout--ml { left: 10.14%; top: 48.83%; right: auto; }
.maquina .pos-callout--mr { left: 90.84%; top: 52.39%; right: auto; }
.maquina .pos-callout--bl { left: 15.55%; top: 75.70%; right: auto; bottom: auto; }
.maquina .pos-callout--br { left: 76.55%; top: 75.70%; right: auto; bottom: auto; }
.maquina__list {
  margin-top: clamp(1.5rem, 2.4vw, 2.9rem);
  gap: 1.05em;
}
.maquina__list li { font-size: clamp(.875rem, .885vw, 1.0625rem); }
.maquina__btn { margin-top: clamp(1.6rem, 2.5vw, 3rem); }

/* ---------- erp integrado ---------- */
.erp {
  min-height: min(34.58vw, 664px);
  display: flex;
  align-items: center;
  padding-block: clamp(1.5rem, 2.1vw, 2.5rem);
}
.erp__grid {
  display: grid;
  grid-template-columns: minmax(0, 720fr) minmax(0, 669fr);
  gap: clamp(2rem, 4.17vw, 5rem);
  align-items: center;
}
.erp__items {
  row-gap: clamp(1.5rem, 2.5vw, 3rem);
  column-gap: 0;
  margin-right: clamp(-87px, -4.53vw, 0px);
}
.erp__items .icon-card__icon { height: clamp(22px, 1.67vw, 32px); margin-bottom: clamp(1rem, 1.56vw, 1.875rem); }
.erp__items .icon-card__title { font-size: clamp(.9375rem, 1.04vw, 1.25rem); }
.erp__items .icon-card__desc { font-size: var(--fs-tiny); margin-top: .3em; }

/* ---------- soluções inteligentes com ia ---------- */
.ia {
  min-height: min(25.57vw, 491px);
  display: flex;
  align-items: center;
}
.ia__grid {
  display: grid;
  grid-template-columns: minmax(0, 440fr) minmax(0, 945fr);
  gap: clamp(1.25rem, 2.2vw, 2.625rem);
  align-items: center;
}
.ia__intro .eyebrow { line-height: 1.7; margin-bottom: .9em; }
.ia__text {
  font-size: clamp(.9375rem, 1.04vw, 1.25rem);
  font-weight: 300;
  line-height: 1.5;
  margin-top: 1.3em;
}
.ia__items {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: clamp(1.5rem, 2.35vw, 2.8rem);
  column-gap: 0;
}
.ia__items .icon-row { gap: clamp(.9rem, 1.3vw, 1.6rem); }
.ia__items .icon-row__icon { width: clamp(30px, 2.1vw, 40px); }
.ia__item-title {
  font-size: clamp(.9375rem, 1.04vw, 1.25rem);
  font-weight: 400;
  line-height: 1.3;
}
.ia__item-desc {
  font-size: clamp(.75rem, .677vw, .8125rem);
  font-weight: 300;
  line-height: 1.5;
  margin-top: .4em;
  color: var(--ink-soft);
  max-width: 27em;
}

/* ---------- footer (remove marcadores default da UA, como no design) ---------- */
.site-footer__col ul { list-style: none; padding-left: 0; }

/* ---------- responsivo ---------- */
/* as quebras fixas dos parágrafos do Sobre (1920) geram órfãs ("IA e",
   "serviços,", "valorização") quando o texto reflui em larguras menores */
@media (max-width: 1300px) {
  .sobre__text br,
  .sobre__pillar p br { display: none; }
  /* evita última linha de uma palavra só na quebra natural */
  .sobre__text,
  .sobre__pillar p { text-wrap: pretty; }
}

/* idem no título da maquininha ("integrado" órfã a 1024/360) */
@media (max-width: 1100px) {
  .maquina .section-title br { display: none; }
}

/* zoom/viewports intermediários: toast desce para faixa própria abaixo do card,
   sem sobrepor (no desktop pleno mantém a posição exata do design) */
@media (max-width: 1280px) {
  .antecip { padding-bottom: clamp(6.5rem, 10vw, 8.5rem); }
  .antecip__toast {
    right: 5%;
    bottom: 1.25rem;
    max-width: clamp(15rem, 26vw, 19.5rem);
  }
}

@media (max-width: 1180px) {
  .antecip__grid { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); column-gap: 2rem; }
  /* piso de largura: sem ele a foto encolhe a ponto de o rosto sumir
     e o toast flutuar sobre o vazio */
  .antecip__photo { opacity: .6; width: max(88.5%, 1080px); }
}

/* só na janela 1001–1100 o texto do callout superior-direito encosta na
   borda da maquininha — fonte um degrau menor + leve nudge devolvem o respiro */
@media (min-width: 1001px) and (max-width: 1100px) {
  .maquina .pos-callout { font-size: var(--fs-small); }
  .maquina .pos-callout--tr { left: 86.2%; }
}

@media (max-width: 920px) {
  .sobre__pillars { grid-template-columns: 1fr; }
  .solucoes__items { margin-right: 0; }
  .solucoes__grid,
  .antecip__grid,
  .maquina__grid,
  .erp__grid,
  .ia__grid { grid-template-columns: 1fr; }
  /* o flex em row da section faria o toast (filho direto) virar coluna lateral */
  .antecip { display: block; padding-bottom: clamp(12rem, 52vw, 16rem); }
  /* foto de fundo: mantém o executivo visível no canto inferior direito */
  .antecip__photo {
    display: block;
    opacity: 1;
    width: clamp(680px, 215vw, 900px);
    max-width: none;
    right: max(-6rem, -16vw);
    bottom: 0;
  }
  /* botão centralizado e com respiro entre checklist e card */
  .antecip__btn {
    display: flex;
    width: fit-content;
    margin-inline: auto;
    margin-top: 2.25rem;
  }
  /* maquininha: checklist e botão centrados como bloco (itens alinhados entre si) */
  .maquina__list {
    width: fit-content;
    margin-inline: auto;
  }
  .maquina__btn {
    display: flex;
    width: fit-content;
    margin-inline: auto;
  }
  .antecip__card {
    justify-self: center;
    margin-inline: auto;
    margin-top: clamp(2.25rem, 8vw, 3rem);
  }
  .antecip__toast { position: relative; inset: auto; z-index: 2; width: fit-content; margin: 1.5rem auto 0; }
  .ia__items { grid-template-columns: 1fr; }
  .pos-diagram { margin-top: 2rem; }
}

@media (max-width: 600px) {
  .antecip__list { grid-template-columns: 1fr; grid-auto-flow: row; }
  .antecip__list li { white-space: normal; }
}
