/* PXLnexus page style frames. Loads the PXLsuite eco.css + page.css unchanged, then swaps ONLY the accent: --nx (orange) leads, gold stays on PXLsuite. */
:root { --nx:#FFA500; --nx45:rgba(255,165,0,.45); --nx06:rgba(255,165,0,.06); --ai:#D7005A; --gold:#f2b705; --gold85:rgba(242,183,5,.85); }
html, body { background:#0d0d0d; }
body { margin:0; }
.eco a { color:var(--nx); }
.e-btn { background:var(--nx); border-color:var(--nx); color:#0d0d0d !important; }
.e-ghost { background:transparent; border-color:rgba(255,255,255,.28); color:var(--w87) !important; }

/* ---- header: PXLnexus logo + plain "by Cristian Spagnuolo", no BlackMamba3D image ---- */
.nx-head { height:80px; display:flex; align-items:center; gap:28px; padding:0 clamp(36px,1.9vw,48px); border-bottom:2px solid var(--nx); background:#0d0d0d; position:relative; z-index:5; }
.nx-brand { display:flex; align-items:center; gap:22px; text-decoration:none; flex:none; }
.nx-sep { color:var(--w38); font-family:'DM Mono',monospace; font-size:16px; }
.nx-by { font-family:'DM Mono',monospace; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--nx); white-space:nowrap; }
.nx-nav { display:flex; gap:28px; margin:0 auto; font-family:'DM Mono',monospace; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--w60); white-space:nowrap; }
.nx-nav span { color:var(--w60); }
.nx-book { color:#0d0d0d !important; text-decoration:none !important; display:inline-flex; align-items:center; height:44px; padding:0 24px; background:var(--nx); color:#0d0d0d; font-family:'DM Mono',monospace; font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; font-weight:500; flex:none; }

/* ---- whole-file logos: transparent margins offset with negative margins, never cropped ---- */
img.plx { display:block; height:auto; max-width:none; }
.tok { display:inline-block; vertical-align:middle; height:auto; max-width:none; }

/* ---- hero ---- */
.mk-open { padding-top:clamp(24px,1.6vw,48px); background:radial-gradient(1300px 560px at 50% 64%, rgba(255,165,0,.06), transparent 70%); }
.open-copy { margin-bottom:clamp(24px,1.9vw,48px); }
.open-side .ctas { margin-top:18px; }
.open-copy h1 { grid-column:1 / 8; }
.open-side .nx-sub { font-family:var(--font-h); font-weight:600; font-size:clamp(20px,1.45vw,30px); color:#fff; margin:0 0 12px; line-height:1.25; }
.open-side .lead { font-size:clamp(17px,1.05vw,22px); max-width:60ch; margin:0; }
.open-side .byline { font-size:15px; color:var(--w60); margin:14px 0 0; max-width:60ch; line-height:1.5; }

/* ---- stage primitives ---- */
.stage svg.layer { z-index:1; }
.w { fill:none; stroke:var(--nx); stroke-width:1.5; stroke-opacity:.7; }
.w.g { stroke:var(--gold); }
.w.grey { stroke:var(--w60); stroke-opacity:1; }
.w.dash { stroke:rgba(255,255,255,.38); stroke-opacity:1; stroke-dasharray:5 5; }
.wd { fill:var(--nx); }
.sq { position:absolute; width:16px; height:16px; border-radius:2px; background:var(--nx); z-index:3; }
.sq b { position:absolute; left:4.5px; top:4.5px; width:7px; height:7px; border-radius:1px; background:var(--ai); }
.cardx { position:absolute; background:var(--card); border:1px solid rgba(255,255,255,.10); border-radius:16px; }
.nxb { border-color:var(--nx45); }
.nm20 { font-family:var(--font-h); font-weight:600; font-size:20px; line-height:26px; color:#fff; }
.sb15 { font-size:15px; line-height:20px; color:var(--w60); }
.cap { position:absolute; font-size:14px; letter-spacing:.06em; text-transform:uppercase; color:var(--w60); font-weight:500; line-height:18px; }

/* ---- hero stage ---- */
.plate-img { position:absolute; inset:0; background:url('../img/cover_bg_B.jpg') right center/cover no-repeat; opacity:.45; }
.plate-fade { position:absolute; inset:0; background:linear-gradient(to right,#181818 0%,rgba(24,24,24,0) 30%); }
.nl { position:absolute; z-index:3; background:rgba(24,24,24,.94); padding:5px 12px 6px; border-radius:8px; }
.nl.r { text-align:left; } .nl.l { text-align:right; }
.nl .n { font-family:var(--font-h); font-weight:600; font-size:18px; line-height:23px; color:#fff; white-space:nowrap; }
.nl .s { font-size:15px; line-height:19px; color:var(--w60); white-space:nowrap; }
.hplate { position:absolute; left:640px; top:210px; width:480px; height:220px; background:#181818; border:1.5px solid var(--nx); border-radius:24px; z-index:3; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; }
.hplate .t { font-size:15px; line-height:20px; color:var(--w60); text-align:center; max-width:380px; text-wrap:balance; }

/* ---- section head with plate band (A3, A8) ---- */
.sec-sf { position:relative; padding-bottom:40px; }
.head-wrap { position:relative; padding-top:clamp(36px,2.2vw,56px); }
.head-band { position:absolute; left:46%; right:0; top:0; bottom:0; background-size:cover; background-position:right center; opacity:.5;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 48%), linear-gradient(to bottom,#000 68%,transparent 100%);
  -webkit-mask-composite:source-in; mask-image:linear-gradient(to right,transparent 0,#000 48%), linear-gradient(to bottom,#000 68%,transparent 100%); mask-composite:intersect; }
.sf-head { position:relative; z-index:1; padding-bottom:24px; }
.sf-head h2 { margin:0 0 14px; max-width:20ch; }
.sf-head.wide h2 { max-width:30ch; }
.sf-head .sub { max-width:none; width:min(100%, 58rem); margin:0; font-size:clamp(17px,.62vw + 5px,19px); line-height:1.55; }
.sf-head .sub + .sub { margin-top:8px; }
.sf-head .sub .tok { margin-inline:2px; }
.fit { margin:0; }

/* ---- A3 ---- */
.cin { display:flex; align-items:center; gap:16px; padding:0 20px; }
.cin svg { width:30px; height:30px; flex:none; stroke:rgba(255,255,255,.87); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.rolec { display:flex; flex-direction:column; justify-content:center; }
.brain-t { font-family:var(--font-h); font-weight:600; font-size:22px; line-height:28px; color:#fff; }
.led { list-style:none; margin:10px 0 0; padding:0; }
.led li { display:flex; align-items:center; gap:14px; height:38px; border-top:1px solid var(--w08); font-size:18px; color:var(--w87); }
.led li i { width:8px; height:8px; background:var(--nx); border-radius:1px; flex:none; }
.out { position:absolute; width:352px; height:64px; border-radius:14px; display:flex; align-items:center; padding:0 20px; font-size:18px; gap:14px; }
.out.solid { background:var(--card); border:1px solid var(--nx45); color:var(--w87); }
.out.first { background:transparent; border:1px dashed rgba(255,255,255,.38); color:var(--w60); }
.out i { width:8px; height:8px; flex:none; border-radius:1px; }
.out.solid i { background:var(--nx); }
.out.first i { border:1.5px solid rgba(255,255,255,.38); }
.band3 { position:absolute; left:24px; top:660px; width:1712px; height:110px; background:var(--surface); border:1px solid var(--w08); border-radius:16px; }
.pl { position:absolute; width:250px; height:72px; border-radius:14px; background:var(--card); border:1px solid var(--nx45); display:flex; align-items:center; justify-content:center; }
.pl.gold { border:1.5px solid var(--gold85); }

/* ---- A8 ---- */
.rl { position:absolute; left:40px; width:280px; }
.rl .a { font-family:var(--font-h); font-weight:600; font-size:17px; line-height:21px; color:#fff; }
.rl .b { font-size:15px; line-height:19px; color:var(--w60); margin-top:1px; }
.bar { position:absolute; height:16px; border-radius:2px; }
.bar.c1 { background:rgba(255,255,255,.38); } .bar.c2 { background:rgba(255,255,255,.12); border-radius:0 2px 2px 0; }
.bar.o { background:var(--nx); }
.vl { position:absolute; font-size:15px; line-height:16px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.vl.g { color:var(--w60); } .vl.o { color:var(--nx); }
.tk { position:absolute; width:60px; text-align:center; font-size:15px; line-height:18px; color:var(--w60); font-variant-numeric:tabular-nums; }
.tile { position:absolute; left:1300px; width:420px; height:200px; border-radius:16px; border:1px solid var(--w08); padding:22px 28px; }
.tile.t2 { height:170px; }
.tile.live { background:var(--card); border-color:rgba(255,255,255,.10); border-top:2px solid var(--nx); }
.tile.proj { background:var(--card); border:1px dashed rgba(255,255,255,.38); }
.tile.empty { background:transparent; border:1px solid var(--w08); }
.tile .big { font-family:var(--font-h); font-weight:700; font-size:76px; line-height:76px; color:#fff; font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.tile .big small { font-size:30px; font-weight:600; letter-spacing:0; color:var(--w60); margin-left:8px; }
.tile .big2 { font-family:var(--font-h); font-weight:600; font-size:34px; line-height:40px; color:#fff; font-variant-numeric:tabular-nums; }
.tile p { margin:10px 0 0; font-size:17px; line-height:24px; color:var(--w60); }
.thumb { position:absolute; width:226px; top:572px; }
.thumb img { width:226px; height:127px; object-fit:cover; display:block; border-radius:8px; border:1px solid var(--w08); }
.thumb span { display:block; margin-top:8px; font-size:15px; line-height:18px; color:var(--w60); }