/* Reversão solicitada: image1–image8 voltam a ser telas estáticas.
   A máscara lateral mistura suavemente cada referência ao fundo da seção. */

:root {
  --static-screen-width: 1240px;
  --static-light-bg: #f9f8ff;
  --static-dark-bg: #040914;
}

.static-reference {
  position: relative;
  z-index: 2;
  display: block;
  width: min(calc(100% - 40px), var(--static-screen-width));
  margin: 0 auto;
  overflow: hidden;
  line-height: 0;
  -webkit-mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.48) 1.5%, #000 3.5%, #000 96.5%, rgba(0,0,0,.48) 98.5%, transparent 100%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.72) 1.25%, #000 3%, #000 97%, rgba(0,0,0,.72) 98.75%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.48) 1.5%, #000 3.5%, #000 96.5%, rgba(0,0,0,.48) 98.5%, transparent 100%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.72) 1.25%, #000 3%, #000 97%, rgba(0,0,0,.72) 98.75%, transparent 100%);
  mask-composite: intersect;
}

.static-reference img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  pointer-events: none;
}

/* Remove discretamente a gravação de modelo presente no bezel da referência 6. */
.static-reference--dark::after {
  content: "";
  position: absolute;
  left: 62.8%;
  top: 83.25%;
  width: 7%;
  height: 2.1%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(17, 16, 22, .98) 24%, rgba(17, 16, 22, .98) 76%, transparent);
}

/* Oculta a reconstrução em componentes somente nas oito telas referenciadas. */
.hero > :not(.static-reference),
.problem > :not(.static-reference),
.solution > :not(.static-reference),
.ai-section > :not(.static-reference),
.platform > :not(.static-reference),
.sectors > :not(.static-reference),
.product-showcase > :not(.static-reference),
.assurance > :not(.static-reference) {
  display: none !important;
}

#conteudo > :is(.hero, .problem, .solution, .ai-section, .platform, .sectors, .product-showcase, .assurance) {
  display: block;
  min-height: 0;
  margin: 0;
  padding: clamp(18px, 2.6vw, 36px) 0;
  overflow: hidden;
  background: var(--static-light-bg);
}

/* Cor mediana real das bordas de cada arquivo, extraída da própria imagem. */
#conteudo > .hero { background: #07091b; }
#conteudo > .problem { background: #f7f6fd; }
#conteudo > .solution { background: #f7f4fe; }
#conteudo > .ai-section {
  background: linear-gradient(90deg, #f7f6fe 0%, #f7f6fe 54%, #f1edfd 76%, #f7f6fe 100%);
}
#conteudo > .platform { background: #f5f2fd; }
#conteudo > .sectors { background: #f6f4fc; }
#conteudo > .product-showcase {
  background:
    linear-gradient(90deg, rgba(237, 232, 253, .96) 0%, rgba(242, 239, 253, .92) 28%, rgba(238, 232, 253, .96) 58%, rgba(232, 225, 253, 1) 100%),
    linear-gradient(180deg, #ede8fd 0%, #eee9fd 54%, #e5dcfd 100%);
}
#conteudo > .assurance { background: #f4f1fd; }

#conteudo > :is(.hero, .problem, .solution, .ai-section, .platform, .sectors, .product-showcase, .assurance)::before {
  content: none !important;
}

/* Remove definitivamente qualquer ornamento residual sobre a image3 limpa. */
#conteudo > .ai-section::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Remove definitivamente ornamentos residuais sobre a image4 editada. */
#conteudo > .sectors::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* image7 usa um pseudo-elemento porque a seção original está em uma única linha. */
.assurance::after {
  content: "" !important;
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  display: block !important;
  width: min(calc(100% - 40px), var(--static-screen-width)) !important;
  height: auto !important;
  aspect-ratio: 1942 / 809;
  margin: 0 auto !important;
  opacity: 1 !important;
  pointer-events: none;
  background: url("../image7.png") center / 100% 100% no-repeat !important;
  -webkit-mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.48) 1.5%, #000 3.5%, #000 96.5%, rgba(0,0,0,.48) 98.5%, transparent 100%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.72) 1.25%, #000 3%, #000 97%, rgba(0,0,0,.72) 98.75%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.48) 1.5%, #000 3.5%, #000 96.5%, rgba(0,0,0,.48) 98.5%, transparent 100%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.72) 1.25%, #000 3%, #000 97%, rgba(0,0,0,.72) 98.75%, transparent 100%);
  mask-composite: intersect;
}

/* As referências permanecem fiéis também quando o controle global está escuro. */
[data-theme="dark"] #conteudo > .problem { background: #f7f6fd; }
[data-theme="dark"] #conteudo > .solution { background: #f7f4fe; }
[data-theme="dark"] #conteudo > .ai-section {
  background: linear-gradient(90deg, #f7f6fe 0%, #f7f6fe 54%, #f1edfd 76%, #f7f6fe 100%);
}
[data-theme="dark"] #conteudo > .platform { background: #f5f2fd; }
[data-theme="dark"] #conteudo > .sectors { background: #f6f4fc; }
[data-theme="dark"] #conteudo > .product-showcase {
  background:
    linear-gradient(90deg, rgba(237, 232, 253, .96) 0%, rgba(242, 239, 253, .92) 28%, rgba(238, 232, 253, .96) 58%, rgba(232, 225, 253, 1) 100%),
    linear-gradient(180deg, #ede8fd 0%, #eee9fd 54%, #e5dcfd 100%);
}
[data-theme="dark"] #conteudo > .assurance { background: #f4f1fd; }

/* No plano em destaque, o chip permanece sozinho, sem a linha superior. */
.plan--featured::before {
  content: none !important;
  display: none !important;
}

.plan--featured {
  border-top-color: transparent !important;
}

/* O campo de busca do topo deve ter somente a borda externa do componente. */
.header-search input:focus,
.header-search input:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
}

@media (max-width: 760px) {
  .static-reference,
  .assurance::after {
    width: calc(100% - 16px) !important;
  }

  #conteudo > :is(.hero, .problem, .solution, .ai-section, .platform, .sectors, .product-showcase, .assurance) {
    padding: 10px 0;
  }
}
