/* Halftone leve no fundo: grade de pontos azuis que cresce perto das luzes e se move devagar.
   Duas camadas na mesma grade: a de pontos maiores só aparece no centro das manchas, como uma retícula de impressão. */
.wb-ambient::before,.wb-ambient::after{content:"";position:absolute;inset:-25%;pointer-events:none;background-position:0 0;background-size:9px 9px;will-change:transform}
.wb-ambient::before{background-image:radial-gradient(circle,rgb(125 200 255/.42) 0 .9px,transparent 1.3px);opacity:.36;
  -webkit-mask-image:radial-gradient(38% 32% at 22% 18%,#000,transparent 72%),radial-gradient(34% 30% at 82% 62%,#000,transparent 72%),radial-gradient(30% 26% at 40% 92%,#000c,transparent 72%);
  mask-image:radial-gradient(38% 32% at 22% 18%,#000,transparent 72%),radial-gradient(34% 30% at 82% 62%,#000,transparent 72%),radial-gradient(30% 26% at 40% 92%,#000c,transparent 72%);
  animation:wb-halftone-a 70s ease-in-out infinite alternate}
.wb-ambient::after{background-image:radial-gradient(circle,rgb(90 170 255/.5) 0 1.9px,transparent 2.4px);opacity:.2;
  -webkit-mask-image:radial-gradient(16% 13% at 22% 18%,#000,transparent 75%),radial-gradient(14% 12% at 82% 62%,#000,transparent 75%),radial-gradient(12% 10% at 40% 92%,#000a,transparent 75%);
  mask-image:radial-gradient(16% 13% at 22% 18%,#000,transparent 75%),radial-gradient(14% 12% at 82% 62%,#000,transparent 75%),radial-gradient(12% 10% at 40% 92%,#000a,transparent 75%);
  animation:wb-halftone-a 70s ease-in-out infinite alternate}
@keyframes wb-halftone-a{0%{transform:translate3d(0,0,0)}50%{transform:translate3d(4%,3%,0)}100%{transform:translate3d(-3%,5%,0)}}
/* Tema claro: pontos azul-marinho bem suaves. */
.cortex-landing[data-landing-theme=light] .wb-ambient::before{background-image:radial-gradient(circle,rgb(20 60 120/.35) 0 .9px,transparent 1.3px);opacity:.26}
.cortex-landing[data-landing-theme=light] .wb-ambient::after{background-image:radial-gradient(circle,rgb(20 70 150/.4) 0 1.9px,transparent 2.4px);opacity:.14}
/* Celular: uma única camada estática do tamanho da tela (as camadas maiores que a tela pesavam na memória). */
html.wb-lite .wb-ambient::before{inset:0;animation:none;will-change:auto}
html.wb-lite .wb-ambient::after{display:none}
@media (max-width:640px){.wb-ambient::before,.wb-ambient::after{background-size:8px 8px}}
@media (prefers-reduced-motion:reduce){.wb-ambient::before,.wb-ambient::after{animation:none}}

/* Degradê azul -> azul-claro nos elementos de destaque. */
.cortex-landing{--wb-grad:linear-gradient(115deg,#1b55f2 0%,#2f8bff 48%,#7fd6ff 100%)}
.cortex-landing .cl-button-primary.cl-circuit-button{--cb-rim:#9fe0ff;--cb-glow:#3d9bff59}
.cortex-landing .cl-button-primary.cl-circuit-button .cl-cb-face{background:var(--wb-grad);color:#fff;text-shadow:0 1px 2px #0a1a4a66}
.cortex-landing .cl-button-primary:not(.cl-circuit-button){background:var(--wb-grad);color:#fff}
.cortex-landing #produto .cl-feature::after,.wbw-tab-pill{background:var(--wb-grad)}
.cortex-landing #produto .cl-feature::after,.wbw-tab[aria-pressed=true]{color:#fff}
.cortex-landing #produto .cl-feature:hover .cl-icon-box{background:var(--wb-grad)}
.cortex-landing .cl-section-heading h2 .cl-accent,.cortex-landing h2 .cl-accent{background:var(--wb-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.cortex-landing[data-landing-theme=light] .cl-button-primary.cl-circuit-button .cl-cb-face{background:linear-gradient(115deg,#0a3fb8,#1b6fe0 55%,#3fa8f0)}
