
/* WorldzEcoSystem™ Next Generation visual layer — JayJayTeamDev approved 2026-09-24 */
:root{
  --wx-bg:#05020b;--wx-panel:#0b0614;--wx-panel2:#130821;--wx-text:#f9f7ff;
  --wx-muted:#c8bed5;--wx-purple:#a84cff;--wx-purple2:#7126c7;--wx-cyan:#55c7ff;
  --wx-line:rgba(210,170,255,.25);--wx-glow:0 0 38px rgba(168,76,255,.24);
}
html{background:var(--wx-bg)!important;scroll-behavior:smooth}
body{background:
 radial-gradient(circle at 12% 0%,rgba(154,66,255,.18),transparent 26%),
 radial-gradient(circle at 88% 8%,rgba(85,199,255,.08),transparent 22%),
 var(--wx-bg)!important;color:var(--wx-text)!important}
body[data-worldz-nextgen]{min-height:100vh}
.nav,.topbar{
  border-bottom:1px solid var(--wx-line)!important;
  background:rgba(5,2,11,.9)!important;backdrop-filter:blur(20px)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.22)
}
.nav .brand,.topbar .brand{font-weight:950!important;letter-spacing:-.02em}
.wx-hero{
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(300px,.98fr);gap:clamp(18px,4vw,56px);
  align-items:center;padding:clamp(30px,6vw,86px);border:1px solid var(--wx-line);border-radius:28px;
  overflow:hidden;position:relative;background:linear-gradient(145deg,rgba(17,7,30,.96),rgba(5,2,11,.98));
  box-shadow:var(--wx-glow);isolation:isolate
}
.wx-hero:before{content:"";position:absolute;inset:-30%;z-index:-1;background:
  radial-gradient(circle at 24% 28%,rgba(184,83,255,.22),transparent 26%),
  radial-gradient(circle at 82% 30%,rgba(75,158,255,.10),transparent 20%)}
.wx-hero-copy{position:relative;z-index:2}
.wx-kicker{font-weight:950;letter-spacing:.18em;text-transform:uppercase;color:#d58cff;font-size:.76rem}
.wx-hero h1{margin:12px 0 18px;font-size:clamp(2.9rem,7.5vw,7.4rem);line-height:.86;letter-spacing:-.06em}
.wx-hero h1 .wx-gradient,.wx-gradient{background:linear-gradient(100deg,#fff 0%,#e9c4ff 40%,#b851ff 70%,#66d9ff 100%);-webkit-background-clip:text;color:transparent}
.wx-lead{max-width:760px;color:var(--wx-muted);font-size:clamp(1rem,1.7vw,1.28rem);line-height:1.55}
.wx-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.wx-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;border-radius:14px;
  border:1px solid rgba(190,110,255,.55);background:linear-gradient(135deg,#a84cff,#6b22c2);color:#fff!important;
  text-decoration:none!important;font-weight:950;box-shadow:0 10px 30px rgba(113,38,199,.28)}
.wx-btn.alt{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);box-shadow:none}
.wx-btn:hover,.wx-btn:focus-visible{transform:translateY(-1px);filter:brightness(1.08);outline:2px solid rgba(122,205,255,.55);outline-offset:2px}
.wx-visual{position:relative;min-width:0}
.wx-visual img{display:block;width:100%!important;height:auto!important;max-height:680px;object-fit:contain!important;border-radius:22px;
  border:1px solid rgba(192,117,255,.35);background:#030106;box-shadow:0 0 54px rgba(146,48,255,.24)}
.wx-section{margin-top:16px;padding:clamp(20px,3vw,34px);border:1px solid rgba(255,255,255,.11);border-radius:22px;
  background:linear-gradient(180deg,rgba(18,8,31,.9),rgba(6,3,12,.96))}
.wx-section h2{font-size:clamp(1.8rem,4vw,3.8rem);line-height:1;margin:4px 0 14px;letter-spacing:-.04em}
.wx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}
.wx-card{min-width:0;padding:18px;border-radius:18px;border:1px solid rgba(185,108,255,.24);
  background:linear-gradient(145deg,rgba(30,13,49,.82),rgba(8,4,15,.94));box-shadow:inset 0 0 26px rgba(143,59,255,.07)}
.wx-card h3{margin:0 0 8px;font-size:1.15rem}.wx-card p{margin:0;color:var(--wx-muted);line-height:1.5}
.wx-card img{width:100%!important;height:auto!important;aspect-ratio:16/10;object-fit:contain!important;border-radius:14px;background:#030106;margin-bottom:14px}
.wx-portal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.wx-world{display:flex;flex-direction:column;overflow:hidden;border:1px solid rgba(190,110,255,.28);border-radius:20px;
 background:linear-gradient(180deg,rgba(21,8,36,.92),rgba(5,2,10,.98));text-decoration:none!important;color:#fff!important}
.wx-world img{width:100%!important;height:auto!important;aspect-ratio:16/10;object-fit:contain!important;background:#020104;border-bottom:1px solid rgba(255,255,255,.08)}
.wx-world div{padding:16px}.wx-world strong{font-size:1.15rem}.wx-world span{display:block;color:var(--wx-muted);margin-top:6px;line-height:1.4}
.wx-world b{display:block;color:#ce8cff;margin-top:14px;font-size:.78rem;letter-spacing:.12em}
.wx-pillrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.wx-pill{padding:9px 12px;border:1px solid rgba(255,255,255,.15);
 border-radius:999px;background:rgba(255,255,255,.04);font-weight:850;font-size:.82rem}
.wx-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}.wx-strip div{padding:14px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:#ffffff06}
.wx-strip b{display:block;font-size:1.1rem}.wx-strip span{color:var(--wx-muted);font-size:.82rem}
.wx-note{padding:14px 16px;border-left:4px solid #b75bff;background:rgba(168,76,255,.08);border-radius:12px;color:var(--wx-muted)}
.wx-titlebar{display:flex;align-items:center;gap:12px}.wx-titlebar strong{font-size:1.05rem}.wx-titlebar small{display:block;color:var(--wx-muted)}
.wx-site-mark{display:inline-grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border-radius:50%;border:1px solid rgba(204,130,255,.55);
 background:radial-gradient(circle at 30% 30%,#edcaff,#aa45ff 36%,#35104c 78%);color:#17041f;font-weight:1000;box-shadow:0 0 22px rgba(168,76,255,.42)}
.wx-footer{margin-top:18px;padding:28px 18px;text-align:center;color:#aa9eb8;border-top:1px solid rgba(255,255,255,.09)}
body[data-worldz-nextgen] img{max-width:100%!important;height:auto!important}
body[data-worldz-nextgen] .hero-art,body[data-worldz-nextgen] .feature-img{object-fit:contain!important}

/* Upgrade legacy/generated pages too — every public page, not only rebuilt roots */
body[data-worldz-nextgen] .hero{
  border:1px solid rgba(190,110,255,.28)!important;border-radius:24px!important;
  background:linear-gradient(150deg,rgba(20,8,34,.96),rgba(5,2,11,.99))!important;
  box-shadow:0 0 40px rgba(139,52,228,.15)!important;overflow:hidden!important
}
body[data-worldz-nextgen] .hero-copy{
  background:linear-gradient(180deg,rgba(5,2,11,.28),rgba(5,2,11,.96))!important;
  padding:clamp(18px,3vw,34px)!important
}
body[data-worldz-nextgen] .hero-copy h1,
body[data-worldz-nextgen] .section h1,
body[data-worldz-nextgen] .section h2{
  letter-spacing:-.035em!important;line-height:1!important
}
body[data-worldz-nextgen] .section{
  border:1px solid rgba(255,255,255,.11)!important;border-radius:22px!important;
  background:linear-gradient(180deg,rgba(20,9,35,.92),rgba(6,3,12,.98))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 20px 60px rgba(0,0,0,.16)!important;
  padding:clamp(18px,3vw,32px)!important
}
body[data-worldz-nextgen] .info-card,
body[data-worldz-nextgen] .world-card,
body[data-worldz-nextgen] .token-card{
  border-radius:18px!important;border:1px solid rgba(190,110,255,.24)!important;
  background:linear-gradient(145deg,rgba(28,12,46,.85),rgba(7,3,13,.96))!important;
  box-shadow:inset 0 0 28px rgba(142,55,242,.07)!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important
}
body[data-worldz-nextgen] .world-card:hover,
body[data-worldz-nextgen] .info-card:hover{
  transform:translateY(-2px)!important;border-color:rgba(203,132,255,.48)!important;
  box-shadow:0 12px 34px rgba(111,35,190,.17)!important
}
body[data-worldz-nextgen] .btn{
  min-height:48px!important;border-radius:14px!important;font-weight:950!important;
  border-color:rgba(191,111,255,.48)!important;
  background:linear-gradient(135deg,rgba(168,76,255,.34),rgba(82,29,139,.58))!important
}
body[data-worldz-nextgen] .btn.secondary{
  background:rgba(255,255,255,.045)!important;border-color:rgba(255,255,255,.15)!important
}
body[data-worldz-nextgen] .eyebrow{
  color:#d58cff!important;letter-spacing:.18em!important;font-weight:950!important
}
body[data-worldz-nextgen] .feature-img,
body[data-worldz-nextgen] .hero-art{
  border-radius:18px!important;background:#020104!important;
  border:1px solid rgba(190,110,255,.18)!important
}
body[data-worldz-nextgen] .pdc-panel{
  border:1px solid rgba(196,113,255,.42)!important;
  background:rgba(7,3,14,.88)!important;box-shadow:0 24px 60px rgba(0,0,0,.26)!important
}
body[data-worldz-nextgen] code{overflow-wrap:anywhere}
@media(max-width:980px){.wx-hero{grid-template-columns:1fr}.wx-visual{order:-1}.wx-grid,.wx-portal{grid-template-columns:repeat(2,1fr)}.wx-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.wx-hero{padding:18px;border-radius:18px}.wx-hero h1{font-size:clamp(2.6rem,14vw,4.6rem)}.wx-grid,.wx-portal{grid-template-columns:1fr}.wx-section{padding:18px}.wx-strip{grid-template-columns:1fr 1fr}.wx-btn{width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
