/* Senlux FX v2b, 25/09/2026 (versão para todas as páginas: o hero é o que o JS marca com .fx2-hero). Camada visual para o site claro (branco + laranja).
   Só decoração: não altera texto, formulário, navegação nem medição.
   Liga sob html.fx2-on (movimento) ou html.fx2-static (sem movimento: prefers-reduced-motion). */
:root{--fx2-o:#ff5a1f;--fx2-o2:#ff8a5c;--fx2-deep:#d94907;--fx2-ease:cubic-bezier(.16,1,.3,1)}

/* o campo de fundo de 19/09 (feito para o preto) sai nas páginas em que a v2 entra */
html.fx2-on .fx-field,html.fx2-static .fx-field{display:none!important}

/* ---------- hero: campo de luz (auroras, pontos, partículas, lanterna) ---------- */
.fx2-on .fx2-hero,.fx2-static .fx2-hero{position:relative;isolation:isolate;overflow:hidden}
.fx2-on .fx2-hero>*:not(.fx2-sky),.fx2-static .fx2-hero>*:not(.fx2-sky){position:relative;z-index:2}
html.fx2-on .fx2-hero>.fx2-sky,html.fx2-static .fx2-hero>.fx2-sky,.fx2-sky{position:absolute;inset:0;z-index:0;height:auto;pointer-events:none;overflow:hidden}
.fx2-sky i{position:absolute;border-radius:50%;display:block;background:radial-gradient(circle,rgba(255,90,31,.52) 0%,rgba(255,138,92,.26) 36%,rgba(255,90,31,0) 68%);transform:translate3d(var(--px,0px),var(--py,0px),0);will-change:transform}
.fx2-sky .a{width:min(72vw,760px);height:min(72vw,760px);top:-30%;right:-14%}
.fx2-sky .b{width:min(48vw,480px);height:min(48vw,480px);bottom:-32%;left:-16%;opacity:.85}
.fx2-sky .c{width:min(32vw,320px);height:min(32vw,320px);top:36%;left:40%;opacity:.6;background:radial-gradient(circle,rgba(255,184,150,.6) 0%,rgba(255,90,31,0) 66%)}
.fx2-on .fx2-sky .a{animation:fx2DriftA 18s ease-in-out infinite alternate}
.fx2-on .fx2-sky .b{animation:fx2DriftB 23s ease-in-out infinite alternate}
.fx2-on .fx2-sky .c{animation:fx2DriftC 15s ease-in-out infinite alternate}
@keyframes fx2DriftA{to{transform:translate3d(calc(var(--px,0px) - 70px),calc(var(--py,0px) + 60px),0) scale(1.08)}}
@keyframes fx2DriftB{to{transform:translate3d(calc(var(--px,0px) + 60px),calc(var(--py,0px) - 40px),0) scale(1.06)}}
@keyframes fx2DriftC{to{transform:translate3d(calc(var(--px,0px) - 40px),calc(var(--py,0px) - 50px),0) scale(1.12)}}
.fx2-dots{position:absolute;inset:0;display:block;background-image:radial-gradient(rgba(255,90,31,.34) 1.2px,transparent 1.7px);background-size:26px 26px;-webkit-mask-image:radial-gradient(ellipse 62% 72% at 68% 42%,#000 0%,rgba(0,0,0,.55) 48%,transparent 80%);mask-image:radial-gradient(ellipse 62% 72% at 68% 42%,#000 0%,rgba(0,0,0,.55) 48%,transparent 80%)}
.fx2-sky canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.fx2-spot{position:absolute;display:block;width:440px;height:440px;margin:-220px 0 0 -220px;left:var(--sx,-999px);top:var(--sy,-999px);border-radius:50%;background:radial-gradient(circle,rgba(255,90,31,.20) 0%,rgba(255,90,31,0) 64%);mix-blend-mode:multiply;opacity:0;transition:opacity .5s;will-change:left,top}
.fx2-on.fx2-pointer .fx2-hero:hover .fx2-spot{opacity:1}

/* ---------- título: brilho passa pela parte laranja uma vez ---------- */
.fx2-on .fx2-hero h1 em{background-image:linear-gradient(100deg,var(--fx2-deep) 0%,var(--fx2-deep) 30%,#ffb18c 50%,var(--fx2-deep) 70%,var(--fx2-deep) 100%);background-size:240% 100%;background-position:120% 0;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:fx2Shine 2.8s var(--fx2-ease) .5s 1 both}
@keyframes fx2Shine{from{background-position:120% 0}to{background-position:-40% 0}}

/* ---------- vídeo do hero: halo que respira ---------- */
.fx2-on .si-vsl,.fx2-static .si-vsl{position:relative;z-index:0}
.fx2-on .si-vsl::before,.fx2-static .si-vsl::before{content:"";position:absolute;inset:-16px -10px 10px;border-radius:18px;background:radial-gradient(58% 58% at 50% 50%,rgba(255,90,31,.38),rgba(255,90,31,0) 72%);filter:blur(16px);z-index:-1;opacity:.6}
.fx2-on .si-vsl::before{animation:fx2Pulse 4.8s ease-in-out infinite}
@keyframes fx2Pulse{0%,100%{opacity:.5;transform:scale(.98)}50%{opacity:.95;transform:scale(1.03)}}
.fx2-on .si-vsl video,.fx2-static .si-vsl video{border:1px solid rgba(255,90,31,.38);box-shadow:0 22px 48px -20px rgba(255,90,31,.5),0 10px 30px -18px rgba(20,21,20,.35);transition:transform .5s var(--fx2-ease),box-shadow .5s}
.fx2-on.fx2-pointer .si-vsl:hover video{transform:translateY(-3px);box-shadow:0 28px 56px -22px rgba(255,90,31,.6),0 12px 32px -18px rgba(20,21,20,.35)}

/* ---------- "já roda todo dia": ponto vivo ---------- */
.fx2-on .sv-proof-strip>span:first-child::before,.fx2-static .sv-proof-strip>span:first-child::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--fx2-o);margin-right:8px;vertical-align:middle;box-shadow:0 0 0 0 rgba(255,90,31,.45)}
.fx2-on .sv-proof-strip>span:first-child::before{animation:fx2Ping 2.2s ease-out infinite}
@keyframes fx2Ping{0%{box-shadow:0 0 0 0 rgba(255,90,31,.45)}70%{box-shadow:0 0 0 9px rgba(255,90,31,0)}100%{box-shadow:0 0 0 0 rgba(255,90,31,0)}}

/* ---------- formulário: foco e botão com luz ---------- */
.fx2-on #lead input:focus-visible,.fx2-on #lead select:focus-visible,.fx2-on #lead textarea:focus-visible,.fx2-static #lead input:focus-visible,.fx2-static #lead select:focus-visible,.fx2-static #lead textarea:focus-visible{box-shadow:0 0 0 4px rgba(255,90,31,.18)}
.fx2-on .su-button,.fx2-on .su-header-cta{transition:transform .35s var(--fx2-ease),box-shadow .35s,background .25s}
.fx2-on.fx2-pointer .su-button:hover{transform:translateY(-2px);box-shadow:0 16px 32px -14px rgba(255,90,31,.65)}
.fx2-on.fx2-pointer .su-header-cta:hover{transform:translateY(-1px)}

/* ---------- cabeçalho: vira vidro claro ao rolar ---------- */
html.fx2-on .su-site-header,html.fx2-static .su-site-header{position:sticky!important;top:0!important;z-index:70;background:rgba(255,255,255,0);border-bottom:1px solid transparent;transition:background .35s,border-color .35s,box-shadow .35s}
html.fx2-on .su-site-header.fx2-scrolled,html.fx2-static .su-site-header.fx2-scrolled{background:rgba(255,255,255,.94)!important;border-bottom-color:rgba(255,90,31,.3);box-shadow:0 12px 30px -24px rgba(20,21,20,.4)}

/* ---------- rótulos de seção: traço laranja aparece ---------- */
.fx2-on .su-eyebrow::after{content:"";display:inline-block;width:0;height:2px;margin-left:10px;vertical-align:middle;background:var(--fx2-o);transition:width .8s var(--fx2-ease) .15s}
.fx2-on .su-eyebrow.fx2-seen::after{width:18px}

/* ---------- cartões das soluções: sobem e a seta anda ---------- */
.fx2-on .su-offerings>a{transition:transform .45s var(--fx2-ease),box-shadow .45s,border-color .45s;will-change:transform}
.fx2-on.fx2-pointer .su-offerings>a:hover{transform:translateY(-4px);box-shadow:0 24px 44px -28px rgba(255,90,31,.55);border-color:rgba(255,90,31,.55)}
.fx2-on .su-offerings>a .su-row-arrow{display:inline-block;transition:transform .45s var(--fx2-ease),color .3s}
.fx2-on.fx2-pointer .su-offerings>a:hover .su-row-arrow{transform:translate(4px,-4px);color:var(--fx2-o)}

/* ---------- números: contagem (o texto final é o original) ---------- */
.fx2-on .sv-stats h3{font-variant-numeric:tabular-nums}

/* ---------- celular: menos peso ---------- */
@media (max-width:760px){.fx2-sky .a{width:120vw;height:120vw;top:-38%;right:-40%}.fx2-sky .b{width:80vw;height:80vw;bottom:-22%;left:-38%}.fx2-sky .c{display:none}.fx2-dots{background-size:22px 22px}.fx2-on .si-vsl::before{filter:blur(12px)}}

/* ---------- sem movimento: tudo parado, luz fica ---------- */
@media (prefers-reduced-motion:reduce){.fx2-sky i,.fx2-hero h1 em,.si-vsl::before,.sv-proof-strip>span:first-child::before{animation:none!important}.fx2-sky canvas,.fx2-spot{display:none!important}}

/* 30/09/2026: decoração à direita, bordas dissolvidas e área de leitura limpa. */
html .fx2-hero > .fx2-sky {
  opacity: .72;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 22%, #000 78%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, #000 22%, #000 78%, transparent 100%), linear-gradient(to bottom, transparent 0%, #000 18%, #000 74%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}
.fx2-sky .a { width:min(56vw,620px);height:min(56vw,620px);top:-12%;right:-6%;opacity:.68; }
.fx2-sky .b { display:none; }
.fx2-sky .c { width:min(30vw,300px);height:min(30vw,300px);top:24%;left:auto;right:24%;opacity:.26; }
.fx2-sky canvas { opacity:.4; }
.fx2-dots { opacity:.42; }
.fx2-spot { opacity:.25; }
@keyframes fx2DriftA { to { transform:translate3d(calc(var(--px,0px) - 24px),calc(var(--py,0px) + 18px),0) scale(1.04); } }
@keyframes fx2DriftC { to { transform:translate3d(calc(var(--px,0px) - 16px),calc(var(--py,0px) - 20px),0) scale(1.04); } }
@media(max-width:760px) {
  html .fx2-hero > .fx2-sky { opacity:.55; }
  .fx2-sky .a { width:94vw;height:94vw;top:2%;right:-30%;opacity:.58; }
  .fx2-sky .b,.fx2-sky .c { display:none; }
  .fx2-sky canvas { opacity:.25; }
  .fx2-dots { opacity:.3; }
}

/* Não herdar a largura máxima dos blocos de texto do Kit Vitrine. */
html .fx2-hero > .fx2-sky { width:auto!important; max-width:none!important; min-width:0!important; }
