/* Cache version: v=20260702-clean113
   AXIS Kinetic Showcase — motion premium somente para a landing NXTS FluxOS.
   Objetivo: deixar a experiência viva, com partículas reais, comets, brilho, reveal e fallback visível. */

:root {
  --axis-kinetic-green: #00e5a0;
  --axis-kinetic-green-2: #6dffd4;
  --axis-kinetic-blue: #4dacff;
  --axis-kinetic-purple: #9b6cff;
  --axis-kinetic-warm: #ffbc57;
}

body:has(.fluxos-page) {
  background: #05090b !important;
}

/* Evita que hotfixes antigos deixem blocos invisíveis. O reveal novo só oculta quando o JS adiciona .axis-kinetic-ready. */
.downloads-page-content .axis-motion-reveal,
.downloads-page-content .axis-motion-reveal:not(.is-visible),
.downloads-page-content .fade-in,
.fluxos-page .fluxos-reveal,
.fluxos-page .fluxos-reveal:not(.is-visible) {
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
}

.fluxos-page {
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(circle at var(--axis-mx, 55%) var(--axis-my, 20%), rgba(0, 229, 160, .17), transparent 25rem),
    radial-gradient(circle at 7% 25%, rgba(0, 229, 160, .16), transparent 32rem),
    radial-gradient(circle at 88% 8%, rgba(77, 172, 255, .14), transparent 36rem),
    radial-gradient(circle at 68% 82%, rgba(155, 108, 255, .12), transparent 34rem),
    linear-gradient(145deg, #04110d 0%, #070b10 48%, #05070b 100%) !important;
}

.downloads-page-content::before,
.fluxos-page::before {
  content: '';
  position: fixed;
  inset: -20%;
  z-index: 0;
  pointer-events: none;
  background:
    conic-gradient(from 100deg at 18% 12%, transparent 0deg, rgba(0,229,160,.11) 35deg, transparent 82deg, rgba(77,172,255,.08) 128deg, transparent 200deg, rgba(155,108,255,.08) 286deg, transparent 360deg);
  opacity: .72;
  animation: axisKineticAuroraSpin 22s linear infinite;
  transform-origin: 52% 47%;
}

.downloads-page-content::after,
.fluxos-page::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .42;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(circle at 50% 30%, #000 0 35%, transparent 82%);
  animation: axisKineticGridRun 9s linear infinite;
}

.bg-atmosphere,
.bg-grid,
#particles,
.fluxos-particles {
  z-index: 1 !important;
}

/* Camada cinética criada por JS */
.axis-kinetic-layer {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  contain: layout paint style;
  mix-blend-mode: screen;
}
.axis-kinetic-orb,
.axis-kinetic-comet,
.axis-kinetic-spark,
.axis-kinetic-ring,
.axis-kinetic-code {
  position: absolute;
  display: block;
  pointer-events: none;
  will-change: transform, opacity;
}
.axis-kinetic-orb {
  width: var(--s, 42px);
  height: var(--s, 42px);
  left: var(--x, 50%);
  top: var(--y, 50%);
  border-radius: 999px;
  opacity: var(--o, .42);
  filter: blur(var(--b, 7px));
  background: radial-gradient(circle, var(--c, #00e5a0) 0 16%, rgba(255,255,255,.28) 18%, transparent 68%);
  box-shadow: 0 0 46px var(--c, #00e5a0), 0 0 96px rgba(0,229,160,.16);
  animation: axisKineticOrbFloat var(--d, 11s) ease-in-out infinite;
  animation-delay: var(--delay, 0s);
}
.axis-kinetic-spark {
  width: var(--s, 4px);
  height: var(--s, 4px);
  left: var(--x, 50%);
  top: var(--y, 50%);
  border-radius: 999px;
  background: var(--c, #00e5a0);
  opacity: 0;
  filter: drop-shadow(0 0 10px var(--c, #00e5a0));
  animation: axisKineticSparkRise var(--d, 8s) linear infinite;
  animation-delay: var(--delay, 0s);
}
.axis-kinetic-comet {
  left: var(--x, 0%);
  top: var(--y, 0%);
  width: var(--w, 170px);
  height: 2px;
  border-radius: 999px;
  opacity: 0;
  transform: rotate(var(--r, -24deg));
  background: linear-gradient(90deg, transparent, var(--c, #00e5a0), rgba(255,255,255,.85), transparent);
  filter: drop-shadow(0 0 12px var(--c, #00e5a0));
  animation: axisKineticComet var(--d, 6.4s) cubic-bezier(.2,.8,.1,1) infinite;
  animation-delay: var(--delay, 0s);
}
.axis-kinetic-ring {
  width: var(--s, 280px);
  height: var(--s, 280px);
  left: var(--x, 50%);
  top: var(--y, 30%);
  border-radius: 999px;
  border: 1px solid rgba(0,229,160,.16);
  box-shadow: inset 0 0 34px rgba(0,229,160,.05), 0 0 50px rgba(0,229,160,.08);
  opacity: var(--o, .46);
  transform: translate(-50%, -50%) rotate(0deg);
  animation: axisKineticRingSpin var(--d, 16s) linear infinite;
}
.axis-kinetic-ring::before,
.axis-kinetic-ring::after {
  content: '';
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #00e5a0;
  box-shadow: 0 0 24px rgba(0,229,160,.75);
}
.axis-kinetic-ring::before { left: 10%; top: 17%; }
.axis-kinetic-ring::after { right: 7%; bottom: 24%; background: #4dacff; box-shadow: 0 0 24px rgba(77,172,255,.75); }
.axis-kinetic-code {
  left: var(--x, 20%);
  top: var(--y, 70%);
  color: rgba(109,255,212,.42);
  font: 900 12px/1 JetBrains Mono, Consolas, monospace;
  text-shadow: 0 0 18px rgba(0,229,160,.28);
  opacity: 0;
  animation: axisKineticCodeFall var(--d, 8s) linear infinite;
  animation-delay: var(--delay, 0s);
}

/* Downloads: corrige espaço morto e deixa o destaque aparecer com força. */
.downloads-page-content .downloads-intro {
  position: relative;
  z-index: 5;
  padding-top: clamp(42px, 5vw, 72px) !important;
  padding-bottom: clamp(22px, 2.4vw, 34px) !important;
}
.downloads-page-content .downloads-main {
  position: relative;
  z-index: 5;
  padding-top: 10px !important;
  padding-bottom: 76px !important;
}
.downloads-page-content .downloads-stats {
  margin-bottom: clamp(18px, 2vw, 26px) !important;
}
.downloads-page-content .axis-featured-program {
  display: grid !important;
  opacity: 1 !important;
  visibility: visible !important;
  margin: 0 0 clamp(18px, 2.3vw, 28px) !important;
  transform: translateZ(0);
  border-color: rgba(0,229,160,.42) !important;
  background:
    radial-gradient(circle at 16% 12%, rgba(0, 229, 160, .24), transparent 30%),
    radial-gradient(circle at 84% 20%, rgba(77, 172, 255, .18), transparent 31%),
    radial-gradient(circle at 46% 120%, rgba(155, 108, 255, .12), transparent 42%),
    linear-gradient(135deg, rgba(8,23,18,.96), rgba(8,11,17,.96) 58%, rgba(4,12,15,.98)) !important;
  box-shadow: 0 36px 120px rgba(0,0,0,.50), 0 0 70px rgba(0,229,160,.12), inset 0 0 0 1px rgba(255,255,255,.045) !important;
  animation: axisKineticFeaturedBreath 5.5s ease-in-out infinite !important;
}
.downloads-page-content .axis-featured-program::before {
  opacity: .58 !important;
  animation: axisKineticGridRun 7s linear infinite !important;
}
.downloads-page-content .axis-featured-program::after {
  opacity: .96 !important;
  animation: axisKineticScanBig 3.1s ease-in-out infinite !important;
}
.downloads-page-content .axis-featured-program__glow {
  opacity: .85 !important;
  animation: axisKineticGlowRun 5s ease-in-out infinite !important;
}
.downloads-page-content .axis-featured-program h2,
.fluxos-page h1,
.fluxos-page h2 {
  text-shadow: 0 0 38px rgba(0,229,160,.14), 0 18px 58px rgba(0,0,0,.62);
}
.downloads-page-content .axis-featured-program__visual,
.fluxos-page .fluxos-preview {
  position: relative;
  transform-style: preserve-3d;
  animation: axisKineticPreviewOrbit 4.8s ease-in-out infinite !important;
  will-change: transform, filter;
}
.downloads-page-content .axis-featured-program__visual img,
.fluxos-page .fluxos-preview img {
  box-shadow: 0 34px 110px rgba(0,0,0,.62), 0 0 70px rgba(0,229,160,.18), 0 0 0 1px rgba(0,229,160,.28) !important;
}
.downloads-page-content .axis-featured-program__visual::after,
.fluxos-page .fluxos-preview::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 22px;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 0 28%, rgba(255,255,255,.22) 40%, rgba(109,255,212,.15) 46%, transparent 58%);
  transform: translateX(-135%);
  animation: axisKineticImageLight 2.9s ease-in-out infinite !important;
}
.downloads-page-content .axis-featured-program__floating,
.fluxos-page .fluxos-trust-row span {
  animation: axisKineticChipJump 2.8s ease-in-out infinite;
  animation-delay: calc(var(--chip-i, 0) * -220ms);
}
.downloads-page-content .axis-featured-program__primary,
.fluxos-page .fluxos-btn--primary {
  animation: axisKineticButtonPulse 2.1s ease-in-out infinite !important;
}
.downloads-page-content .stat-card,
.downloads-page-content .axis-download-admin,
.downloads-page-content .downloads-list-shell,
.downloads-page-content .download-row,
.fluxos-page .fluxos-card,
.fluxos-page .fluxos-diff-card,
.fluxos-page .fluxos-stat,
.fluxos-page .fluxos-feature-panel,
.fluxos-page .fluxos-score,
.fluxos-page .fluxos-faq details {
  transform-style: preserve-3d;
  transition: transform .24s cubic-bezier(.18,.9,.18,1), border-color .24s ease, box-shadow .24s ease, background .24s ease, filter .24s ease;
}
.downloads-page-content .stat-card:hover,
.downloads-page-content .axis-download-admin:hover,
.downloads-page-content .downloads-list-shell:hover,
.fluxos-page .fluxos-card:hover,
.fluxos-page .fluxos-diff-card:hover,
.fluxos-page .fluxos-stat:hover,
.fluxos-page .fluxos-feature-panel:hover,
.fluxos-page .fluxos-score:hover {
  transform: translate3d(0, -8px, 0) scale(1.015);
  border-color: rgba(0,229,160,.46) !important;
  box-shadow: 0 30px 92px rgba(0,0,0,.42), 0 0 46px rgba(0,229,160,.15), inset 0 0 0 1px rgba(255,255,255,.045) !important;
  filter: saturate(1.12);
}
.downloads-page-content .download-row:hover {
  transform: translateX(9px) scale(1.006) !important;
  background: linear-gradient(90deg, rgba(0,229,160,.075), rgba(255,255,255,.025)) !important;
  box-shadow: inset 4px 0 0 rgba(0,229,160,.85), 0 20px 50px rgba(0,0,0,.22), 0 0 34px rgba(0,229,160,.08) !important;
}
.downloads-page-content .download-row-wrapper,
.downloads-page-content .filter-chip,
.downloads-page-content .stat-card {
  position: relative;
}
.downloads-page-content .filter-chip.active,
.downloads-page-content .filter-chip:hover {
  box-shadow: 0 0 0 1px rgba(0,229,160,.36), 0 0 34px rgba(0,229,160,.20), inset 0 0 18px rgba(0,229,160,.08) !important;
}
.downloads-page-content .stat-icon,
.downloads-page-content .file-icon,
.fluxos-page .fluxos-icon {
  animation: axisKineticIconPop 3.2s ease-in-out infinite;
  box-shadow: 0 0 28px rgba(0,229,160,.14) !important;
}

/* Reveal cinético novo: só esconde quando JS está pronto, evitando tela vazia. */
html.axis-kinetic-ready .axis-kinetic-reveal {
  opacity: 0;
  transform: translate3d(0, 38px, 0) scale(.96) rotateX(4deg);
  filter: blur(10px);
  transition:
    opacity .72s cubic-bezier(.18,.86,.2,1),
    transform .72s cubic-bezier(.18,.86,.2,1),
    filter .72s cubic-bezier(.18,.86,.2,1);
  transition-delay: var(--axis-kinetic-delay, 0ms);
  will-change: opacity, transform, filter;
}
html.axis-kinetic-ready .axis-kinetic-reveal.is-in {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1) rotateX(0deg);
  filter: none;
}

/* Produto FluxOS mais próximo de uma landing de otimizador moderna: hero forte, glow, orbit e energia. */
.fluxos-page {
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(circle at 22% 20%, rgba(0,229,160,.20), transparent 34rem),
    radial-gradient(circle at 80% 14%, rgba(77,172,255,.16), transparent 36rem),
    radial-gradient(circle at 52% 86%, rgba(155,108,255,.13), transparent 38rem),
    linear-gradient(145deg, #03110d, #070a0f 52%, #030508) !important;
}
.fluxos-page > *:not(.axis-kinetic-layer) {
  position: relative;
  z-index: 5;
}
.fluxos-page .fluxos-hero {
  min-height: min(760px, calc(100vh - 74px));
  align-items: center;
}
.fluxos-page .fluxos-eyebrow {
  animation: axisKineticTextPulse 2.6s ease-in-out infinite;
}
.fluxos-page .fluxos-gradient-text {
  background-size: 240% 100% !important;
  animation: axisKineticGradientRun 2.8s linear infinite !important;
}
.fluxos-page .fluxos-benefits {
  perspective: 1200px;
}
.fluxos-page .fluxos-card::after,
.fluxos-page .fluxos-feature-panel::after,
.fluxos-page .fluxos-stat::after,
.fluxos-page .fluxos-diff-card::after,
.downloads-page-content .stat-card::after,
.downloads-page-content .axis-download-admin::after,
.downloads-page-content .downloads-list-shell::after,
.downloads-page-content .axis-featured-program::marker {
  pointer-events: none;
}
.fluxos-page .fluxos-card::before,
.fluxos-page .fluxos-feature-panel::before,
.fluxos-page .fluxos-stat::before,
.fluxos-page .fluxos-diff-card::before,
.downloads-page-content .stat-card::before,
.downloads-page-content .download-row::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(120deg, transparent 0 32%, rgba(0,229,160,.22) 45%, rgba(77,172,255,.15) 54%, transparent 68%);
  transform: translateX(-120%);
}
.fluxos-page .fluxos-card:hover::before,
.fluxos-page .fluxos-feature-panel:hover::before,
.fluxos-page .fluxos-stat:hover::before,
.fluxos-page .fluxos-diff-card:hover::before,
.downloads-page-content .stat-card:hover::before,
.downloads-page-content .download-row:hover::before {
  opacity: 1;
  animation: axisKineticScanBig .85s ease forwards;
}
.fluxos-page .fluxos-meter-bar i {
  animation: axisKineticMeterPulse 2.5s ease-in-out infinite;
}
.fluxos-page .fluxos-final-cta {
  animation: axisKineticFeaturedBreath 5.4s ease-in-out infinite;
}

/* Keyframes */
@keyframes axisKineticAuroraSpin { to { transform: rotate(360deg) scale(1.02); } }
@keyframes axisKineticGridRun { to { background-position: 52px 52px; } }
@keyframes axisKineticOrbFloat {
  0%,100% { transform: translate3d(0,0,0) scale(.88); opacity: calc(var(--o, .42) * .62); }
  35% { transform: translate3d(var(--dx, 40px), var(--dy, -34px),0) scale(1.18); opacity: var(--o, .42); }
  70% { transform: translate3d(calc(var(--dx, 40px) * -.55), calc(var(--dy, -34px) * .72),0) scale(.98); opacity: calc(var(--o, .42) * .86); }
}
@keyframes axisKineticSparkRise {
  0% { opacity: 0; transform: translate3d(0, 38vh, 0) scale(.5); }
  12% { opacity: .78; }
  70% { opacity: .5; }
  100% { opacity: 0; transform: translate3d(var(--dx, 40px), -70vh, 0) scale(1.35); }
}
@keyframes axisKineticComet {
  0%, 15% { opacity: 0; transform: translate3d(-22vw, 0, 0) rotate(var(--r, -24deg)) scaleX(.45); }
  22% { opacity: .95; }
  54% { opacity: .76; }
  100% { opacity: 0; transform: translate3d(128vw, var(--dy, 16vh), 0) rotate(var(--r, -24deg)) scaleX(1.1); }
}
@keyframes axisKineticRingSpin { to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes axisKineticCodeFall {
  0% { opacity: 0; transform: translate3d(0,-18vh,0) rotate(-6deg); }
  10% { opacity: .52; }
  82% { opacity: .22; }
  100% { opacity: 0; transform: translate3d(var(--dx, 18px), 90vh,0) rotate(6deg); }
}
@keyframes axisKineticFeaturedBreath {
  0%,100% { box-shadow: 0 34px 110px rgba(0,0,0,.46), 0 0 36px rgba(0,229,160,.10), inset 0 0 0 1px rgba(255,255,255,.035); }
  50% { box-shadow: 0 44px 140px rgba(0,0,0,.56), 0 0 82px rgba(0,229,160,.20), inset 0 0 0 1px rgba(255,255,255,.06); }
}
@keyframes axisKineticScanBig {
  0% { transform: translateX(-140%); }
  100% { transform: translateX(140%); }
}
@keyframes axisKineticGlowRun {
  0%,100% { transform: translateY(-50%) translateX(0) scale(.86); opacity: .45; }
  50% { transform: translateY(-53%) translateX(-18px) scale(1.16); opacity: .95; }
}
@keyframes axisKineticPreviewOrbit {
  0%,100% { transform: perspective(1200px) rotateY(-8deg) rotateX(4deg) translate3d(0, 0, 0); filter: saturate(1); }
  35% { transform: perspective(1200px) rotateY(-2deg) rotateX(1.8deg) translate3d(0, -14px, 0); filter: saturate(1.14); }
  70% { transform: perspective(1200px) rotateY(-10deg) rotateX(5deg) translate3d(0, -4px, 0); filter: saturate(1.04); }
}
@keyframes axisKineticImageLight { to { transform: translateX(135%); } }
@keyframes axisKineticChipJump {
  0%,100% { transform: translate3d(0,0,0) scale(1); }
  50% { transform: translate3d(0,-8px,0) scale(1.03); }
}
@keyframes axisKineticButtonPulse {
  0%,100% { transform: translate3d(0,0,0); box-shadow: 0 18px 44px rgba(0,229,160,.28); }
  50% { transform: translate3d(0,-3px,0) scale(1.02); box-shadow: 0 26px 76px rgba(0,229,160,.44), 0 0 0 8px rgba(0,229,160,.055); }
}
@keyframes axisKineticIconPop {
  0%,100% { transform: translate3d(0,0,0) rotate(0deg) scale(1); filter: saturate(1); }
  45% { transform: translate3d(0,-4px,0) rotate(-3deg) scale(1.06); filter: saturate(1.18); }
}
@keyframes axisKineticTextPulse {
  0%,100% { text-shadow: 0 0 14px rgba(0,229,160,.22); }
  50% { text-shadow: 0 0 30px rgba(0,229,160,.55); }
}
@keyframes axisKineticGradientRun { to { background-position: 240% 0; } }
@keyframes axisKineticMeterPulse {
  0%,100% { filter: drop-shadow(0 0 12px rgba(0,229,160,.28)); }
  50% { filter: drop-shadow(0 0 24px rgba(0,229,160,.52)); }
}

@media (max-width: 980px) {
  .axis-kinetic-ring { display: none; }
  .axis-kinetic-comet { width: 120px; }
  .downloads-page-content .axis-featured-program__visual,
  .fluxos-page .fluxos-preview { animation: axisKineticChipJump 4s ease-in-out infinite !important; transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .axis-kinetic-layer,
  .axis-kinetic-orb,
  .axis-kinetic-comet,
  .axis-kinetic-spark,
  .axis-kinetic-ring,
  .axis-kinetic-code { display: none !important; }
  .downloads-page-content::before,
  .downloads-page-content::after,
  .fluxos-page::before,
  .fluxos-page::after,
  .downloads-page-content *,
  .fluxos-page * {
    animation: none !important;
    transition-duration: .01ms !important;
  }
  html.axis-kinetic-ready .axis-kinetic-reveal {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}


/* ===== AXIS Program Motion Scope/Clean v20260702-clean113 =====
   Esta camada deve afetar SOMENTE a página do programa (/nxts-fluxos). */
body.axis-downloads-page .axis-kinetic-layer,
body.axis-downloads-page .axis-kinetic-orb,
body.axis-downloads-page .axis-kinetic-comet,
body.axis-downloads-page .axis-kinetic-spark,
body.axis-downloads-page .axis-kinetic-ring,
body.axis-downloads-page .axis-kinetic-code {
  display: none !important;
}
body.axis-downloads-page .downloads-page-content {
  background: inherit !important;
}
.fluxos-page {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at var(--axis-mx, 62%) var(--axis-my, 22%), rgba(0, 229, 160, .13), transparent 23rem),
    radial-gradient(circle at 18% 22%, rgba(0, 229, 160, .10), transparent 34rem),
    radial-gradient(circle at 82% 18%, rgba(77, 172, 255, .10), transparent 36rem),
    linear-gradient(145deg, #04100d 0%, #071018 52%, #05070b 100%) !important;
}
.fluxos-page::before {
  opacity: .34 !important;
  animation-duration: 42s !important;
}
.fluxos-page::after {
  opacity: .20 !important;
  background-size: 64px 64px !important;
  animation-duration: 18s !important;
}
.axis-kinetic-layer {
  z-index: 1 !important;
  opacity: .68 !important;
  mix-blend-mode: screen;
}
.axis-kinetic-code { display: none !important; }
.axis-kinetic-orb {
  opacity: calc(var(--o, .32) * .62) !important;
  filter: blur(calc(var(--b, 7px) * 1.35));
  box-shadow: 0 0 32px var(--c, #00e5a0), 0 0 70px rgba(0,229,160,.10) !important;
}
.axis-kinetic-comet {
  opacity: 0;
  filter: drop-shadow(0 0 9px var(--c, #00e5a0)) !important;
}
.axis-kinetic-spark {
  opacity: 0;
  filter: drop-shadow(0 0 7px var(--c, #00e5a0)) !important;
}
.axis-kinetic-ring {
  opacity: calc(var(--o, .28) * .48) !important;
  border-color: rgba(0,229,160,.10) !important;
  box-shadow: inset 0 0 26px rgba(0,229,160,.025), 0 0 36px rgba(0,229,160,.045) !important;
}
.fluxos-page .fluxos-preview {
  animation: axisKineticPreviewOrbit 6.8s ease-in-out infinite !important;
}
.fluxos-page .fluxos-preview::after {
  opacity: .55 !important;
  animation-duration: 4.8s !important;
}
.fluxos-page .fluxos-btn--primary {
  animation-duration: 3.2s !important;
}