/* =========================================================
   Super Plataforma — Hero "Ecossistema vivo"
   Cena 3D feita em código: núcleo SP + 17 módulos em órbita
   ========================================================= */
.sp-hero{
  --nx-bg:#05070f;
  --nx-ink:#eef1ff;
  --nx-muted:#9ea7c2;
  --nx-orange:#ff5a24;
  --nx-orange-2:#ff8a4c;
  --nx-violet:#7c5cff;
  --nx-violet-2:#b9a4ff;
  --nx-cyan:#46c8ff;
  --mx:.5; --my:.5;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:max(760px,100svh);
  padding:150px 0 0;
  background:var(--nx-bg);
  color:var(--nx-ink);
}

/* ---------- fundo ---------- */
.nx-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.nx-bg::before{content:"";position:absolute;inset:0;background:
  radial-gradient(120% 90% at 72% 42%,rgba(40,30,110,.55),transparent 60%),
  radial-gradient(90% 70% at 10% 100%,rgba(255,90,36,.10),transparent 60%),
  linear-gradient(180deg,#070a18 0%,#05070f 70%,#070913 100%)}
.nx-aurora{position:absolute;border-radius:50%;opacity:.6;will-change:transform}
.nx-aurora--violet{width:760px;height:760px;right:-120px;top:-120px;background:radial-gradient(circle,rgba(124,92,255,.75),rgba(124,92,255,0) 65%);animation:nx-drift-a 18s ease-in-out infinite alternate}
.nx-aurora--orange{width:620px;height:620px;left:-240px;bottom:-260px;background:radial-gradient(circle,rgba(255,90,36,.55),rgba(255,90,36,0) 65%);animation:nx-drift-b 22s ease-in-out infinite alternate}
.nx-aurora--cyan{width:420px;height:420px;right:18%;bottom:-120px;background:radial-gradient(circle,rgba(70,200,255,.45),rgba(70,200,255,0) 65%);opacity:.35;animation:nx-drift-c 16s ease-in-out infinite alternate}
@keyframes nx-drift-a{to{transform:translate3d(-90px,70px,0) scale(1.12)}}
@keyframes nx-drift-b{to{transform:translate3d(120px,-60px,0) scale(1.18)}}
@keyframes nx-drift-c{to{transform:translate3d(-140px,-40px,0) scale(.9)}}
.nx-stars{position:absolute;inset:0;width:100%;height:100%}
.nx-floor{position:absolute;left:-20%;right:-20%;bottom:-2px;height:46%;transform:perspective(520px) rotateX(64deg);transform-origin:50% 100%;
  background-image:linear-gradient(rgba(140,120,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(140,120,255,.22) 1px,transparent 1px);
  background-size:64px 64px;animation:nx-floor 9s linear infinite;
  -webkit-mask-image:linear-gradient(to top,rgba(0,0,0,.9),transparent 78%);mask-image:linear-gradient(to top,rgba(0,0,0,.9),transparent 78%);opacity:.55}
@keyframes nx-floor{to{background-position:0 64px,0 0}}
.nx-spotlight{position:absolute;inset:0;background:radial-gradient(520px circle at calc(var(--mx)*100%) calc(var(--my)*100%),rgba(150,120,255,.14),transparent 60%);transition:background .2s}
.nx-grain{position:absolute;inset:0;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- layout ---------- */
.nx-layout{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(12px,2vw,32px)}
.nx-copy{position:relative;z-index:3;max-width:640px}

.nx-announce{display:inline-flex;align-items:center;gap:10px;max-width:100%;padding:6px 14px 6px 6px;border:1px solid rgba(185,164,255,.25);border-radius:999px;background:linear-gradient(135deg,rgba(124,92,255,.16),rgba(255,90,36,.08));backdrop-filter:blur(10px);color:#dcd4ff;font-size:13px;font-weight:700;text-decoration:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 30px rgba(20,10,60,.35);position:relative;overflow:hidden;transition:border-color .3s,transform .3s}
.nx-announce::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.18) 50%,transparent 70%);transform:translateX(-120%);animation:nx-sheen 5s ease-in-out 1.6s infinite}
.nx-announce:hover{border-color:rgba(255,138,76,.6);transform:translateY(-1px)}
.nx-announce b{padding:5px 9px;border-radius:999px;background:linear-gradient(135deg,var(--nx-orange),var(--nx-orange-2));color:#fff;font-size:10px;letter-spacing:1.2px;box-shadow:0 0 18px rgba(255,90,36,.55)}
.nx-announce span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-announce i{font-style:normal;color:var(--nx-orange-2);transition:transform .3s}
.nx-announce:hover i{transform:translateX(3px)}
@keyframes nx-sheen{0%{transform:translateX(-120%)}35%,100%{transform:translateX(120%)}}

.sp-hero .nx-title{margin:26px 0 22px;font-family:"Plus Jakarta Sans",Manrope,sans-serif;font-size:clamp(42px,4.35vw,66px);font-weight:800;line-height:1.03;letter-spacing:-.045em;color:#fff;text-wrap:balance}
.nx-title .nx-w{display:inline-block;opacity:0;transform:translateY(.45em) rotateX(-40deg);filter:blur(10px);transform-origin:50% 100%;transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),filter .9s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i)*70ms + 150ms)}
.sp-hero.is-ready .nx-title .nx-w{opacity:1;transform:none;filter:none}
.nx-title-glow{background:linear-gradient(100deg,#ff7a3d 0%,#ffb58f 22%,#c9b6ff 45%,#8a6bff 62%,#46c8ff 80%,#ff7a3d 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:nx-shimmer 7s linear infinite;filter:drop-shadow(0 0 28px rgba(140,110,255,.35))}
.nx-title-glow .nx-w{background:inherit;background-size:inherit;-webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes nx-shimmer{to{background-position:-220% 0}}

.nx-lead{max-width:560px;margin:0;color:var(--nx-muted);font-size:clamp(16px,1.25vw,18.5px);line-height:1.7}
.nx-fade{opacity:0;transform:translateY(16px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.sp-hero.is-ready .nx-fade{opacity:1;transform:none}
.nx-fade.d1{transition-delay:.75s}.nx-fade.d2{transition-delay:.9s}.nx-fade.d3{transition-delay:1.05s}.nx-fade.d4{transition-delay:1.2s}.nx-fade.d0{transition-delay:.05s}

.nx-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.sp-hero .nx-cta{position:relative;overflow:hidden;background:linear-gradient(135deg,#ff5a24,#ff7f3f 55%,#ff9a5a);box-shadow:0 14px 40px rgba(255,90,36,.42),inset 0 1px 0 rgba(255,255,255,.35)}
.sp-hero .nx-cta::before{content:"";position:absolute;inset:-2px;background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);animation:nx-sheen 4.2s ease-in-out 2s infinite}
.sp-hero .nx-cta i{font-style:normal;transition:transform .25s}
.sp-hero .nx-cta:hover i{transform:translateX(4px)}
.sp-hero .nx-cta-ghost{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.04);backdrop-filter:blur(8px)}
.nx-play{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.12);font-size:10px;box-shadow:0 0 0 0 rgba(255,255,255,.3);animation:nx-ping 2.6s ease-out infinite}
@keyframes nx-ping{0%{box-shadow:0 0 0 0 rgba(255,255,255,.28)}80%,100%{box-shadow:0 0 0 12px rgba(255,255,255,0)}}

.nx-benefits{display:flex;flex-wrap:wrap;gap:8px 18px;margin:26px 0 0;padding:0;list-style:none;color:#cfd5e6;font-size:13px;font-weight:700}
.nx-benefits li{display:flex;align-items:center;gap:8px}
.nx-benefits li::before{content:"";width:16px;height:16px;flex:0 0 16px;border-radius:50%;background:rgba(255,90,36,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.2 2.1 4.8-4.8' fill='none' stroke='%23ff7a3d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}

.nx-proof{display:flex;align-items:center;gap:16px;margin-top:30px;padding-top:24px;border-top:1px solid rgba(255,255,255,.08)}
.nx-proof-num{display:flex;align-items:flex-start;font-family:"Plus Jakarta Sans",sans-serif;font-weight:800;line-height:1}
.nx-proof-num strong{font-size:38px;letter-spacing:-.04em;background:linear-gradient(180deg,#fff,#b9a4ff);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.nx-proof-num span{color:var(--nx-orange);font-size:24px;margin-left:2px}
.nx-proof p{margin:0;color:#8f98b3;font-size:12.5px;line-height:1.5}
.nx-proof p b{color:#fff;font-size:13px}

/* ---------- palco 3D ---------- */
.nx-stage{--s:1;position:relative;z-index:2;width:calc(100% + 60px);aspect-ratio:1/.9;margin:-30px -60px 0 0;opacity:0;transform:scale(.92);transition:opacity 1.4s ease .2s,transform 1.6s cubic-bezier(.2,.7,.2,1) .2s}
.sp-hero.is-ready .nx-stage{opacity:1;transform:none}
.nx-links{position:absolute;inset:-12%;width:124%;height:124%;pointer-events:none}

.nx-core{position:absolute;left:50%;top:47%;z-index:500;width:calc(170px*var(--s));height:calc(170px*var(--s));translate:-50% -50%;pointer-events:none}
.nx-core img{position:relative;z-index:3;display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 30px rgba(255,90,36,.45)) drop-shadow(0 0 22px rgba(255,120,60,.35));animation:nx-float 6s ease-in-out infinite}
.nx-core-halo{position:absolute;inset:-70%;border-radius:50%;background:radial-gradient(circle,rgba(255,120,60,.42),rgba(124,92,255,.22) 38%,transparent 68%);animation:nx-breathe 4.5s ease-in-out infinite}
.nx-core-ring{position:absolute;inset:-26%;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 12%,rgba(255,138,76,.95) 20%,transparent 30% 55%,rgba(124,92,255,.95) 66%,transparent 76%);-webkit-mask:radial-gradient(circle,transparent 63%,#000 64.5%,#000 66%,transparent 67.5%);mask:radial-gradient(circle,transparent 63%,#000 64.5%,#000 66%,transparent 67.5%);animation:nx-spin 7s linear infinite}
.nx-core-wave{position:absolute;inset:-6%;border:1px solid rgba(255,160,110,.55);border-radius:50%;animation:nx-wave 3.6s ease-out infinite}
.nx-core-wave--late{animation-delay:1.8s;border-color:rgba(160,135,255,.55)}
@keyframes nx-float{50%{transform:translateY(-8px)}}
@keyframes nx-breathe{50%{transform:scale(1.12);opacity:.8}}
@keyframes nx-spin{to{transform:rotate(360deg)}}
@keyframes nx-wave{0%{transform:scale(.9);opacity:.9}100%{transform:scale(2.6);opacity:0}}

.nx-nodes{position:absolute;inset:0}
.nx-node{position:absolute;left:0;top:0;display:grid;place-items:center;width:calc(94px*var(--s));height:calc(94px*var(--s));margin:calc(-47px*var(--s)) 0 0 calc(-47px*var(--s));padding:0;border:0;background:none;cursor:pointer;will-change:transform,opacity;-webkit-tap-highlight-color:transparent}
.nx-node img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 16px rgba(0,0,0,.45));transition:filter .35s,transform .35s;pointer-events:none}
.nx-node::before{content:"";position:absolute;inset:6%;border-radius:50%;background:radial-gradient(circle,rgba(150,125,255,.55),transparent 70%);opacity:0;transform:scale(.6);transition:opacity .4s,transform .4s;z-index:-1}
.nx-node.is-focus::before,.nx-node:hover::before,.nx-node:focus-visible::before{opacity:1;transform:scale(1.55)}
.nx-node.is-focus img,.nx-node:hover img{filter:drop-shadow(0 10px 16px rgba(0,0,0,.45)) drop-shadow(0 0 16px rgba(190,170,255,.85));transform:scale(1.12)}
.nx-node.is-back img,.nx-node.is-back .nx-letter{filter:blur(1.2px) saturate(.8)}
.nx-node.is-ping::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,170,120,.9);animation:nx-hit .9s ease-out forwards}
@keyframes nx-hit{from{transform:scale(.7);opacity:1}to{transform:scale(1.9);opacity:0}}
.nx-node:focus-visible{outline:2px solid var(--nx-orange-2);outline-offset:4px;border-radius:50%}

.nx-letter{position:relative;display:grid;place-items:center;width:78%;height:78%;border-radius:30%;color:#fff;font-family:"Plus Jakarta Sans",sans-serif;font-weight:800;font-size:calc(22px*var(--s));letter-spacing:-.02em;
  background:radial-gradient(120% 120% at 28% 18%,rgba(255,255,255,.75),rgba(255,255,255,0) 32%),linear-gradient(145deg,var(--c1),var(--c2));
  box-shadow:inset 0 -6px 12px rgba(0,0,0,.28),inset 0 2px 2px rgba(255,255,255,.5),0 12px 22px rgba(0,0,0,.45),0 0 24px var(--glow);text-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .35s,box-shadow .35s}
.nx-node:hover .nx-letter,.nx-node.is-focus .nx-letter{transform:scale(1.12);box-shadow:inset 0 -6px 12px rgba(0,0,0,.28),inset 0 2px 2px rgba(255,255,255,.5),0 12px 22px rgba(0,0,0,.45),0 0 38px var(--glow)}
.nx-new{position:absolute;right:-4px;top:-2px;padding:3px 6px;border-radius:99px;background:linear-gradient(135deg,var(--nx-orange),var(--nx-orange-2));color:#fff;font-size:calc(8px*var(--s) + 1px);font-weight:900;letter-spacing:.6px;box-shadow:0 0 12px rgba(255,90,36,.7);font-family:Manrope,sans-serif;text-shadow:none}

/* ---------- cards de vidro ---------- */
.nx-card{position:absolute;z-index:900;display:flex;gap:10px;padding:12px 14px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:linear-gradient(145deg,rgba(28,30,60,.72),rgba(12,14,32,.62));backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);box-shadow:0 24px 50px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.1);color:#e9ecf8;font-size:12px;line-height:1.45;pointer-events:none;opacity:0;transition:opacity 1s ease}
.sp-hero.is-ready .nx-card{opacity:1}
.nx-card small{display:block;color:#a595ff;font-size:9.5px;font-weight:800;letter-spacing:1.1px}
.nx-card p{margin:3px 0 0}
.nx-card b{color:#fff}
.nx-card--merlin{top:4%;left:-2%;width:250px;align-items:flex-start;transition-delay:1.3s;animation:nx-bob 7s ease-in-out infinite}
.nx-card--merlin img{width:38px;height:38px;flex:0 0 38px;object-fit:contain}
.nx-card--graal{bottom:15%;left:0;width:220px;flex-direction:column;gap:7px;transition-delay:1.6s;animation:nx-bob 8s ease-in-out -2s infinite}
.nx-card-head{display:flex;align-items:center;gap:8px}
.nx-card-head small{color:#ffb08a}
.nx-g{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:linear-gradient(145deg,#ffcf6b,#ff5a24);color:#1a0d05;font-size:11px;font-weight:900}
.nx-bar{height:6px;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.nx-bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#ff5a24,#ffb070,#b9a4ff);animation:nx-fill 5.5s cubic-bezier(.6,0,.2,1) 2s infinite}
@keyframes nx-fill{0%{width:0}70%,100%{width:100%}}
.nx-card-foot{display:flex;gap:6px}
.nx-card-foot span{padding:3px 7px;border-radius:6px;background:rgba(255,255,255,.07);color:#c3c9dc;font-size:10px;font-weight:700}
.nx-card--app{right:-3%;bottom:24%;align-items:center;transition-delay:1.9s;animation:nx-bob 6.5s ease-in-out -4s infinite}
.nx-ring{position:relative;display:grid;place-items:center;width:40px;height:40px}
.nx-ring svg{position:absolute;inset:0;transform:rotate(-90deg)}
.nx-ring circle{fill:none;stroke:rgba(255,255,255,.1);stroke-width:3.4}
.nx-ring .nx-ring-val{stroke:#46c8ff;stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:97.4;animation:nx-ringfill 2.4s cubic-bezier(.3,0,.2,1) 2.2s forwards}
.nx-ring span{font-size:10px;font-weight:800}
@keyframes nx-ringfill{to{stroke-dashoffset:31.2}}
@keyframes nx-bob{50%{translate:0 -10px}}

/* ---------- legenda viva ---------- */
.nx-caption{position:absolute;left:50%;bottom:-3%;z-index:950;display:grid;justify-items:center;gap:3px;width:min(92%,420px);translate:-50% 0;text-align:center;pointer-events:none}
.nx-caption::before{content:"";position:absolute;inset:-18px -30px -14px;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(5,7,15,.82),rgba(5,7,15,0))}
.nx-caption-count{display:inline-flex;align-items:center;gap:8px;margin-bottom:4px;padding:5px 11px;border:1px solid rgba(255,255,255,.1);border-radius:99px;background:rgba(10,12,28,.6);backdrop-filter:blur(8px);color:#aab3cc;font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase}
.nx-caption-count i{width:6px;height:6px;border-radius:50%;background:#35e39a;box-shadow:0 0 10px #35e39a;animation:nx-blink 1.8s ease-in-out infinite}
@keyframes nx-blink{50%{opacity:.35}}
.nx-caption b{font-family:"Plus Jakarta Sans",sans-serif;font-size:19px;letter-spacing:-.02em;color:#fff}
.nx-caption small{min-height:2.9em;color:#98a1bb;font-size:13px;line-height:1.45}
.nx-caption.is-swap b,.nx-caption.is-swap small{animation:nx-swap .6s ease}
@keyframes nx-swap{from{opacity:0;transform:translateY(6px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}

.sp-hero .nx-trust{position:relative;z-index:3;margin-top:36px;border-top-color:rgba(255,255,255,.08)}

/* ---------- responsivo ---------- */
@media (max-width:1180px){
  .nx-card--graal{left:-2%}
  .nx-card--merlin{left:0}
}
@media (max-width:1050px){
  .sp-hero{padding-top:130px;min-height:0}
  .nx-layout{grid-template-columns:minmax(0,1fr);gap:10px}
  .nx-copy{max-width:720px}
  .nx-stage{width:min(100%,640px);margin:0 auto}
}
@media (max-width:640px){
  .sp-hero{padding-top:112px}
  .sp-hero .nx-title{font-size:clamp(38px,11.2vw,52px);margin:20px 0 18px}
  .nx-announce{font-size:12px}
  .nx-actions .button{width:100%}
  .nx-benefits{flex-direction:column;gap:8px}
  .nx-card--graal,.nx-card--app{display:none}
  .nx-card--merlin{top:0;left:0;width:210px;font-size:11px;padding:10px 12px}
  .nx-card--merlin img{width:30px;height:30px;flex-basis:30px}
  .nx-caption b{font-size:17px}
  .nx-caption small{font-size:12px}
  .sp-hero .nx-trust{margin-top:18px}
  .nx-floor{height:30%}
  .nx-aurora--violet{width:520px;height:520px;right:-220px;top:280px}
}

@media (prefers-reduced-motion:reduce){
  .nx-aurora,.nx-floor,.nx-core img,.nx-core-halo,.nx-core-ring,.nx-core-wave,.nx-card,.nx-bar i,.nx-announce::after,.sp-hero .nx-cta::before,.nx-play,.nx-title-glow,.nx-caption-count i{animation:none!important}
  .nx-bar i{width:100%}
  .nx-title .nx-w,.nx-fade,.nx-stage,.nx-card{transition:none!important}
}