/* Marketing Industrial B2B — adapta somente a hero e o segundo menu para a
   mesma construção visual e responsiva da página de Account-Based Marketing. */
body[data-pagina="industrial-b2b"] {
  --pm-industrial-turquesa: var(--turquoise, #00C9AC);
  --pm-industrial-turquesa-ink: var(--pm-turquesa-ink, #007C6A);
  --pm-hero-faixa-cor: var(--pm-industrial-turquesa);
}

/* O destaque da hero continua inteiramente turquesa, sem o gradiente da ABM. */
body[data-pagina="industrial-b2b"] main .pm-hero-destaque {
  color: var(--pm-industrial-turquesa) !important;
  -webkit-text-fill-color: currentColor !important;
}

/* Segundo menu: mesma marca, faixa e tipografia da ABM, na identidade
   turquesa da página industrial. */
body[data-pagina="industrial-b2b"] #pm-subnav .pm-subnav-marca {
  display: flex;
  flex: none;
  align-items: center;
}

body[data-pagina="industrial-b2b"] #pm-subnav .pm-subnav-faixa {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: var(--pm-subnav-h);
  height: var(--pm-subnav-h);
  color: var(--pm-industrial-turquesa);
  opacity: .88;
}

body[data-pagina="industrial-b2b"] #pm-subnav .pm-subnav-titulo {
  position: static;
  left: auto;
  z-index: auto;
  background: transparent;
  font-family: 'Montserrat', system-ui, sans-serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: normal !important;
  line-height: 1.375 !important;
  color: var(--pm-industrial-turquesa-ink) !important;
  transform: none;
}

body[data-pagina="industrial-b2b"] #pm-subnav .pm-subnav-titulo::after {
  content: none;
}

@media (min-width: 1024px) {
  body[data-pagina="industrial-b2b"] #pm-subnav .pm-subnav-marca {
    padding-left: var(--fib-2, 13px);
  }

  body[data-pagina="industrial-b2b"] #pm-subnav .pm-subnav-faixa {
    display: block;
  }
}

/* A hero usa a mesma camada de fundo fixa da ABM. */
body[data-pagina="industrial-b2b"] #top #hero-bg-wrapper {
  position: fixed !important;
  background-color: #0C1D27;
  contain: paint;
}

/* Enquadramento desktop pela regra de terços: o ponto de 2/3 da imagem
   coincide com 75% da hero (centro da metade direita). A largura max-content
   preserva a proporção definida pela altura, sem comprimir a imagem ao crop. */
@media (min-width: 1024px) {
  body[data-pagina="industrial-b2b"] #top #hero-bleed {
    right: auto;
    left: 75%;
    width: max-content;
    transform: translateX(-66.666667%);
  }

  body[data-pagina="industrial-b2b"] #top #hero-bleed img {
    max-width: none;
  }
}

/* Em ultrawide, preserva a composição da máscara na largura de referência.
   O espaço adicional cresce somente para a esquerda como petróleo opaco, sem
   interferir no enquadramento da imagem por terços nem esticar o gradiente. */
@media (min-width: 1900px) {
  body[data-pagina="industrial-b2b"] #top #hero-overlay {
    right: 0;
    left: auto;
    width: 1900px;
  }

  body[data-pagina="industrial-b2b"] #top #hero-overlay::before {
    content: "";
    position: absolute;
    top: 0;
    right: 100%;
    bottom: 0;
    width: calc(100vw - 1900px);
    background-color: #0C1D27;
  }
}

body[data-pagina="industrial-b2b"] #top .pm-hero-faixa {
  display: none;
  position: absolute;
  top: 0;
  right: var(--pm-subnav-h);
  bottom: 0;
  z-index: 8;
  width: var(--pm-subnav-h);
  color: var(--pm-hero-faixa-cor);
  background-color: transparent;
  opacity: 1;
  pointer-events: none;
}

body[data-pagina="industrial-b2b"] #top .pm-hero-faixa::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  height: 20%;
  background-color: var(--pm-industrial-turquesa);
}

body[data-pagina="industrial-b2b"] #pm-progress-track {
  display: none !important;
}

@media (min-width: 1024px) {
  body[data-pagina="industrial-b2b"] #top .pm-hero-faixa {
    display: block;
  }
}

body[data-pagina="industrial-b2b"] #hero-mobile-bg {
  display: none;
}

@media (max-width: 1023px) {
  body[data-pagina="industrial-b2b"] #hero-mobile-bg {
    display: block;
    position: absolute;
    inset: 0;
  }

  body[data-pagina="industrial-b2b"] #hero-mobile-bg img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: right center;
  }

  body[data-pagina="industrial-b2b"] #hero-mobile-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom,
      rgba(12, 29, 39, .40) 0%,
      rgba(12, 29, 39, .55) 42%,
      #0C1D27 74%,
      #0C1D27 100%);
    pointer-events: none;
  }

  body[data-pagina="industrial-b2b"] #top #hero-overlay {
    display: none;
  }
}