
.negocio-why { position: relative; z-index: 2; margin-top: -11vw; padding: var(--esp-sec-y) 0; }
.negocio-why__head { margin-bottom: 3.5rem; }
.negocio-why__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 3rem; }
.negocio-why__item { display: flex; flex-direction: column; align-items: center; text-align: center; }
.negocio-why__ico { height: 3.25rem; width: auto; max-width: none; }
.negocio-why__title { margin: 1.375rem 0 0; text-transform: uppercase; font: 400 var(--fs-body)/1.2 var(--esp-font); color: var(--esp-muted); letter-spacing: .01em; }
.negocio-why__title strong { font-weight: 700; color: var(--esp-gray); }
.negocio-why__desc { margin: .875rem 0 0; font: 400 var(--fs-body)/1.5 var(--esp-font); color: var(--esp-muted); }
.negocio-why__desc strong { font-weight: 700; color: var(--esp-gray); }

/* topo = wave-section-1 (como a Sobre); fechamento = clip-path diagonal 20vw (mesma inclinação) */
.negocio-support {
  position: relative;
  background-image: url("../assets/wave-section-1.svg"), var(--esp-grad-section);
  background-repeat: no-repeat, no-repeat;
  background-position: center top, center bottom;
  background-size: 100% auto, 100% calc(100% - 33vw);
  color: #fff;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 20vw));
  /* margin-top negativa sobe a wave; +10vw no padding-top mantém o conteúdo no lugar */
  margin-top: -10vw;
  padding: 23vw 0 calc(16vw + var(--esp-sec-y));
}
/* outline decorativo (2 curvas ciano) atrás do conteúdo, na parte de baixo do verde; clip da seção o contém.
   top:88% + translateY(-88%) = mesmo posicionamento de background-position:center 88% (mas em SVG inline p/ o tracing). */
.negocio-support__outline { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.negocio-support__outline svg { position: absolute; left: 0; top: 88%; transform: translateY(-88%); width: 100%; height: auto; display: block; overflow: visible; }
.negocio-support__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.45fr; gap: 3.75rem; align-items: center; }
.negocio-support__txt .esp-h2,
.negocio-support__txt .esp-h2 strong { color: #fff; }
.negocio-support__txt .esp-lead { color: rgba(255, 255, 255, .92); }
.negocio-support__cta { margin-top: 2rem; }

/* Produtos: título + descrição + cards .esp-cat (labels herdam o cinza do body) + CTA azul.
   Puxado p/ cima p/ o título encaixar logo abaixo da diagonal. Sombra do hover mais suave (fundo branco). */
.negocio-products { position: relative; margin-top: -16vw; padding: var(--esp-sec-y) 0;
  --esp-cat-hover-sh: var(--esp-sh-cat-hover); }
.negocio-products__head { margin-bottom: 3.5rem; }
.negocio-products__head .esp-lead { max-width: 46rem; }
/* grade centrada a 62rem (como a home) → espaço nas laterais, não colada no container */
.negocio-products__grid { list-style: none; margin: 0 auto; padding: 0; display: grid; grid-template-columns: repeat(4, 12rem); justify-content: space-between; max-width: 62rem; row-gap: 3rem; }
.negocio-products__action { display: flex; justify-content: center; margin-top: 3.25rem; }
@media (max-width: 980px) { .negocio-products__grid { grid-template-columns: repeat(2, 1fr); column-gap: 2.5rem; } }
@media (max-width: 600px) { .negocio-products__grid { gap: 1.75rem 1rem; } }

@media (max-width: 768px) {
  .negocio-why__grid { grid-template-columns: repeat(2, 1fr); gap: 2.75rem 1.5rem; }
  .negocio-why { margin-top: -28vw; }
  .negocio-support__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  /* +2px na wave sangra 1px/lado (fio sub-pixel) */
  .negocio-support { background-size: calc(100% + 2px) auto, 100% calc(100% - 33vw);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 14vw)); padding: 32vw 0 calc(14vw + var(--esp-sec-y)); }
}
@media (max-width: 480px) {
  .negocio-why__grid { grid-template-columns: 1fr; gap: 2.5rem; }
}
