/* ============================================================
   UEDEV — v2 upgrade layer
   Editorial hero, scroll marquee, 3D-navigation feature block,
   numbered capability list, sticky-stacking product cards.
   Loaded AFTER company.css.
   ============================================================ */

/* ---------- Giant editorial headings ---------- */
.mega{
  font-weight:900;text-transform:uppercase;letter-spacing:-.035em;line-height:.82;
  background:linear-gradient(180deg,#5c6470 0%,#cfe0ec 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  white-space:nowrap;width:100%;display:block;
}
.mega--fit{font-size:clamp(56px,17.2vw,340px)}
.mega--sec{font-size:clamp(48px,12vw,168px);line-height:.86;white-space:normal}
.mega em{font-style:normal;background:linear-gradient(120deg,var(--cyan),var(--violet) 60%,var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- HERO v2 ---------- */
.hero{min-height:100svh}
#navfx{position:absolute;inset:0;z-index:0;width:100%;height:100%}
.heroX{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;max-width:var(--maxw);margin:0 auto;width:100%;padding:104px 40px 0}
.heroX__mid{flex:1;display:flex;flex-direction:column;justify-content:center;gap:18px;min-height:0}
.announce{align-self:flex-start;display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);
  border:1px solid var(--line-2);background:rgba(47,224,106,.07);padding:9px 8px 9px 16px;border-radius:100px;transition:.25s var(--ease)}
.announce:hover{border-color:var(--cyan);box-shadow:var(--glow);transform:translateY(-2px)}
.announce b{color:var(--cyan);font-weight:700}
.announce .tag{font-size:10px;letter-spacing:.1em;background:linear-gradient(135deg,var(--cyan),var(--violet));color:#041208;padding:5px 11px;border-radius:100px;font-weight:700}
.heroX__head{overflow:hidden}
.heroX__sub{font-size:clamp(19px,2.9vw,44px);font-weight:600;letter-spacing:-.02em;color:var(--ink);line-height:1.05}
.heroX__sub em{font-style:normal;background:linear-gradient(110deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.heroX__bar{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;padding-bottom:26px}
.heroX__bar p,.heroX__bar h1{margin:0;max-width:290px;color:#c2cfc6;font-size:clamp(12px,1.35vw,17px);font-weight:300;text-transform:uppercase;letter-spacing:.06em;line-height:1.35}
.btn--glow{background:linear-gradient(123deg,#0d1a2b 5%,var(--cyan) 34%,var(--violet) 70%,var(--magenta) 100%);color:#041208;font-weight:700;
  box-shadow:0 4px 4px rgba(47,224,106,.22),4px 4px 14px rgba(16,201,176,.55) inset;outline:2px solid rgba(255,255,255,.9);outline-offset:-3px}
.btn--glow:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(16,201,176,.5)}
.hero__stats{margin:0 auto;width:100%;max-width:920px;align-self:center;border-radius:16px 16px 0 0;border-bottom:0}
/* moved out of the hero: sits as a closing band inside the Nav3D section */
.n3d .hero__stats{max-width:100%;margin:64px 0 0;border-radius:16px;border-bottom:1px solid var(--line)}
.n3d .hstat{padding:26px 20px}

/* ---------- SCROLL MARQUEE ---------- */
.mrq{background:var(--bg);padding:74px 0 34px;overflow:hidden}
.mrq__row{display:flex;gap:12px;width:max-content;will-change:transform}
.mrq__row+.mrq__row{margin-top:12px}
.mrq__tile{width:300px;height:190px;border-radius:16px;overflow:hidden;flex:0 0 auto;border:1px solid var(--line);background:var(--panel);position:relative}
.mrq__tile img{width:100%;height:100%;object-fit:cover;opacity:.78;transition:opacity .3s}
.mrq__tile:hover img{opacity:1}
.mrq__tile span{position:absolute;left:10px;bottom:10px;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;background:rgba(5,7,5,.72);border:1px solid var(--line);padding:5px 9px;border-radius:6px}

/* ---------- LCM NAV3D PRODUCT SECTION ---------- */
/* product carries its own green brand accent, scoped to the section */
.n3d{position:relative;overflow:hidden;--nv:#2fe06a;--nv-2:#8bffb0;--nv-line:rgba(47,224,106,.24)}
.n3d .kicker{color:var(--nv)}
.n3d .kicker::before{background:var(--nv)}
.n3d .mega em{background:linear-gradient(120deg,var(--nv),var(--nv-2) 70%);-webkit-background-clip:text;background-clip:text;color:transparent}
.n3d::before{content:'';position:absolute;top:-180px;left:50%;transform:translateX(-50%);width:900px;height:520px;background:radial-gradient(closest-side,rgba(47,224,106,.13),transparent);pointer-events:none}

.n3d__head{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.n3d__logo{width:104px;height:104px;flex:0 0 auto;object-fit:contain;filter:drop-shadow(0 0 26px rgba(47,224,106,.4))}
.n3d__tag{margin:12px 0 0;font-family:var(--mono);font-size:13px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.n3d__badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.n3d__badges span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--nv);border:1px solid var(--nv-line);background:rgba(47,224,106,.07);padding:7px 13px;border-radius:100px}

/* video showcase */
.n3d__reel{position:relative;margin:44px 0 8px;border:1px solid var(--nv-line);border-radius:22px;overflow:hidden;background:#04070a;box-shadow:0 30px 80px rgba(0,0,0,.6)}
.n3d__reel video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#04070a}
.n3d__reel iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:#04070a}
a.n3d__sound{text-decoration:none}
.n3d__reel figcaption{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:13px 18px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.n3d__reel figcaption b{color:var(--nv)}
.n3d__sound{display:inline-flex;align-items:center;gap:8px;font:inherit;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);
  background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:100px;padding:7px 14px;cursor:pointer;transition:.22s}
.n3d__sound:hover{border-color:var(--nv);color:var(--nv)}

.n3d .n3d__list .n{color:var(--nv)}
.n3d__panel{border-color:var(--nv-line)}
.n3d__spec b{background:linear-gradient(135deg,var(--nv),var(--nv-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.n3d__meta b{color:var(--nv)}
.n3d .btn--glow{background:linear-gradient(123deg,#08160f 5%,var(--nv) 38%,#19b98f 72%,#0fd0c4 100%);box-shadow:0 4px 4px rgba(47,224,106,.22),4px 4px 14px rgba(25,185,143,.5) inset}
.n3d .btn--ghost:hover{border-color:var(--nv);color:var(--nv);box-shadow:0 0 34px rgba(47,224,106,.22)}

/* spec strip */
.specs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-top:26px}
.specs div{background:rgba(8,12,10,.85);padding:20px 18px}
.specs dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);margin:0}
.specs dd{margin:9px 0 0;font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.specs dd em{font-style:normal;color:var(--nv)}

/* documentation block */
.docs3d{margin-top:64px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(160deg,var(--panel),#080b12);padding:34px}
.docs3d__top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:24px}
.docs3d__top h3{font-size:clamp(21px,2.4vw,30px);letter-spacing:-.02em}
.docs3d__top p{margin:8px 0 0;color:var(--muted);font-size:14.5px;max-width:520px;line-height:1.55}
.docs3d__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.docs3d__grid a{background:rgba(8,12,10,.85);padding:18px;display:flex;flex-direction:column;gap:6px;transition:.25s}
.docs3d__grid a:hover{background:rgba(47,224,106,.07)}
.docs3d__grid .num{font-family:var(--mono);font-size:11px;color:var(--nv);letter-spacing:.1em}
.docs3d__grid b{font-size:15px;font-weight:600;letter-spacing:-.01em}
.docs3d__grid span{color:var(--faint);font-size:13px;line-height:1.5}

.n3d__grid{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:start;margin-top:44px}
.n3d__grid{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:start;margin-top:44px}
.n3d__list{list-style:none;margin:34px 0 0;padding:0;display:flex;flex-direction:column}
.n3d__list li{display:grid;grid-template-columns:56px 1fr;gap:18px;align-items:baseline;padding:19px 0;border-top:1px solid var(--line)}
.n3d__list li:last-child{border-bottom:1px solid var(--line)}
.n3d__list .n{font-family:var(--mono);font-size:13px;color:var(--cyan);letter-spacing:.06em}
.n3d__list b{display:block;font-size:17px;font-weight:600;letter-spacing:-.01em;margin-bottom:5px}
.n3d__list span{color:var(--muted);font-size:14.5px;line-height:1.55}
.n3d__panel{position:sticky;top:104px;border:1px solid var(--line-2);border-radius:20px;background:linear-gradient(160deg,var(--panel),#080d0a);padding:14px;box-shadow:0 24px 70px rgba(0,0,0,.5)}
.n3d__slot{border-radius:13px;overflow:hidden;background:#070b09;display:block}
.n3d__panel image-slot{width:100%;height:330px;display:block}
.n3d__meta{display:flex;justify-content:space-between;gap:12px;padding:14px 6px 4px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.n3d__meta b{color:var(--cyan)}
.n3d__spec{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:14px}
.n3d__spec div{background:rgba(8,11,9,.82);padding:16px 14px}
.n3d__spec b{display:block;font-size:22px;font-weight:700;background:linear-gradient(135deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.n3d__spec span{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-top:6px;display:block}

/* ---------- CAPABILITIES (light contrast band) ---------- */
.caps{background:#fff;color:#0C0C0C;border-radius:44px 44px 0 0;padding:104px 0 110px;position:relative;z-index:2;margin-top:-34px}
.caps .capsTitle{font-weight:900;text-transform:uppercase;letter-spacing:-.035em;text-align:center;color:#0C0C0C;font-size:clamp(46px,12vw,164px);line-height:.86;margin-bottom:16px}
.caps .capsLead{text-align:center;max-width:560px;margin:0 auto 58px;color:rgba(12,12,12,.62);font-size:17px;line-height:1.6}
.caps__list{max-width:1000px;margin:0 auto}
.cap{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;padding:30px 0;border-top:1px solid rgba(12,12,12,.15);transition:.3s var(--ease)}
.cap:last-child{border-bottom:1px solid rgba(12,12,12,.15)}
.cap:hover{gap:44px}
.cap__n{font-weight:900;font-size:clamp(46px,9vw,124px);line-height:.8;color:#0C0C0C;letter-spacing:-.04em;transition:.3s var(--ease)}
.cap:hover .cap__n{background:linear-gradient(135deg,#0f9d58,#0b7a52);-webkit-background-clip:text;background-clip:text;color:transparent}
.cap__t{font-weight:600;text-transform:uppercase;font-size:clamp(16px,2.1vw,31px);letter-spacing:-.01em;line-height:1.1}
.cap__d{font-weight:300;color:rgba(12,12,12,.6);font-size:clamp(13.5px,1.5vw,18px);line-height:1.55;max-width:640px;margin:9px 0 0}

/* ---------- STICKY-STACKING PRODUCT CARDS ---------- */
.stack{background:var(--bg);border-radius:44px 44px 0 0;margin-top:-38px;position:relative;z-index:3;padding:104px 0 40px}
.stack__item{height:86vh;position:sticky;top:96px;display:flex;justify-content:center}
.stackcard{width:100%;border:2px solid rgba(215,226,234,.5);border-radius:38px;background:#0a0f0c;padding:26px;display:grid;grid-template-rows:auto 1fr;gap:20px;will-change:transform;transform-origin:top center;overflow:hidden}
.stackcard__top{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.stackcard__n{font-weight:900;font-size:clamp(40px,7vw,96px);line-height:.8;letter-spacing:-.04em;background:linear-gradient(180deg,#5c6470,#cfe0ec);-webkit-background-clip:text;background-clip:text;color:transparent}
.stackcard__id{flex:1;min-width:180px}
.stackcard__cat{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
.stackcard__name{font-size:clamp(20px,2.6vw,34px);font-weight:700;letter-spacing:-.02em;margin-top:6px;line-height:1.05}
.ghostbtn{display:inline-flex;align-items:center;gap:9px;border:2px solid rgba(215,226,234,.55);color:#D7E2EA;border-radius:100px;padding:12px 24px;font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.1em;transition:.25s var(--ease)}
.ghostbtn:hover{background:rgba(215,226,234,.12);border-color:var(--cyan);color:var(--cyan)}
.stackcard__media{position:relative;border-radius:26px;overflow:hidden;background:#060a08;min-height:0}
.stackcard__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.stackcard:hover .stackcard__media img{transform:scale(1.04)}
.stackcard__price{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;gap:12px;background:rgba(5,7,5,.76);border:1px solid var(--line);backdrop-filter:blur(8px);padding:10px 16px;border-radius:100px;font-family:var(--mono);font-size:14px;font-weight:700;color:var(--cyan)}
.stackcard__price em{font-style:normal;color:var(--muted);font-weight:500;font-size:12px}

/* ---------- scroll-reveal text ---------- */
.chars span{opacity:.2;transition:opacity .18s linear}
html.no-anim .chars span{opacity:1}

/* ---------- AI SYSTEMS / PLATFORMS / ROADMAP ---------- */
.blk__head{margin:64px 0 20px}
.blk__head h3{font-size:clamp(20px,2.3vw,28px);letter-spacing:-.02em}
.blk__head p{margin:9px 0 0;color:var(--muted);font-size:14.5px;line-height:1.55;max-width:620px}

.ai3d{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ai3d__c{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:24px;transition:.32s var(--ease)}
.ai3d__c:hover{border-color:var(--nv-line);transform:translateY(-4px);box-shadow:0 18px 44px rgba(0,0,0,.45),0 0 26px rgba(47,224,106,.12)}
.ai3d__c svg{width:30px;height:30px;color:var(--nv);margin-bottom:14px;display:block}
.ai3d__c h4{margin:0 0 8px;font-size:17px;font-weight:600;letter-spacing:-.01em}
.ai3d__c p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.ai3d__c code{font-family:var(--mono);font-size:12.5px;color:var(--nv)}
.ai3d__more{grid-column:1/-1;display:flex;align-items:center;gap:12px;justify-content:center;
  border:1px dashed var(--nv-line);border-radius:14px;padding:15px;color:var(--muted);font-size:14px;background:rgba(47,224,106,.04)}
.ai3d__more svg{width:18px;height:18px;color:var(--nv);flex:0 0 auto}

.plat{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.plat > div{background:rgba(8,11,9,.85);padding:20px 18px;display:flex;align-items:center;gap:14px}
.plat svg{width:26px;height:26px;flex:0 0 auto;color:var(--nv)}
.plat b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em}
.plat span{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.plat .soon{opacity:.72}
.plat .soon svg{color:var(--muted)}
.plat .soon span{color:var(--nv-2)}

.road{border:1px solid var(--nv-line);border-radius:22px;padding:32px;
  background:linear-gradient(160deg,rgba(47,224,106,.07),transparent 58%),var(--panel)}
.road__top{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.road__pill{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#041208;
  background:linear-gradient(135deg,var(--nv),var(--nv-2));padding:7px 14px;border-radius:100px;font-weight:700}
.road__top h3{font-size:clamp(20px,2.3vw,28px);letter-spacing:-.02em}
.road__top em{font-style:normal;color:var(--faint);font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.road__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.road__grid > div{background:rgba(8,11,9,.88);padding:22px;display:flex;gap:16px}
.road__grid svg{width:24px;height:24px;flex:0 0 auto;color:var(--nv);margin-top:2px}
.road__grid b{display:block;font-size:16px;font-weight:600;letter-spacing:-.01em;margin-bottom:6px}
.road__grid p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}

/* ---------- VFX SHOWCASE BAND ---------- */
.vfxband{position:relative;overflow:hidden;padding:104px 0 96px;background:linear-gradient(180deg,var(--bg),var(--bg2) 45%,var(--bg))}
.vfxband::before{content:'';position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);width:1100px;height:560px;
  background:radial-gradient(closest-side,rgba(47,224,106,.10),transparent);pointer-events:none}
.vfxband__meta{display:flex;flex-wrap:wrap;gap:14px 40px;margin-top:26px;align-items:baseline}
.vfxband__meta div{display:flex;align-items:baseline;gap:9px}
.vfxband__meta b{font-size:26px;font-weight:700;letter-spacing:-.02em;
  background:linear-gradient(135deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.vfxband__meta span{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.vfxband .mrq{background:transparent;padding:44px 0 0;position:relative;z-index:2;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.vfxband .mrq__tile{width:336px;height:212px;border-radius:18px;transition:border-color .3s,box-shadow .3s,transform .4s var(--ease)}
.vfxband .mrq__tile:hover{border-color:var(--line-2);transform:translateY(-5px);box-shadow:0 22px 50px rgba(0,0,0,.55),0 0 28px rgba(47,224,106,.16)}
.vfxband .mrq__tile::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(5,7,5,.78))}
.vfxband .mrq__tile span{z-index:2}
.vfxband__foot{display:flex;justify-content:center;margin-top:48px;position:relative;z-index:2}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1080px){
  .announce .desc{display:none}
}
@media(max-width:960px){
  .heroX{padding:96px 24px 0}
  .n3d__grid{grid-template-columns:1fr;gap:34px}
  .n3d__panel{position:static}
  .specs{grid-template-columns:1fr 1fr}
  .docs3d__grid{grid-template-columns:1fr 1fr}
  .ai3d{grid-template-columns:1fr 1fr}
  .plat{grid-template-columns:1fr 1fr}
  .road{padding:24px}
  .n3d__logo{width:76px;height:76px}
  .docs3d{padding:24px}
  .caps{border-radius:34px 34px 0 0;padding:76px 0 82px}
  .cap{gap:20px}
  .cap:hover{gap:20px}
  .stack{border-radius:34px 34px 0 0;padding:76px 0 30px}
  .stack__item{height:auto;position:static;margin-bottom:20px}
  .stackcard{transform:none!important}
  .mrq__tile{width:230px;height:150px}
  .vfxband{padding:76px 0 72px}
  .vfxband .mrq__tile{width:262px;height:166px;border-radius:14px}
}
@media(max-width:600px){
  .heroX{padding:88px 16px 0}
  .heroX__bar{flex-direction:column;align-items:flex-start;gap:18px;padding-bottom:20px}
  .heroX__bar p,.heroX__bar h1{max-width:100%}
  .heroX__bar .btn{width:100%;justify-content:center}
  .announce{font-size:10.5px;padding:7px 7px 7px 13px;gap:9px}
  .announce .tag{font-size:9px;padding:4px 9px}
  .cap{grid-template-columns:1fr;gap:8px;padding:22px 0}
  .cap__n{font-size:44px}
  .n3d__spec{grid-template-columns:1fr;}
  .n3d__list li{grid-template-columns:38px 1fr;gap:12px}
  .specs,.docs3d__grid{grid-template-columns:1fr}
  .ai3d,.plat,.road__grid{grid-template-columns:1fr}
  .road{padding:20px;border-radius:16px}
  .blk__head{margin-top:44px}
  .n3d__head{gap:16px}
  .n3d__logo{width:60px;height:60px}
  .n3d__reel{border-radius:16px;margin-top:30px}
  .docs3d{padding:20px;border-radius:16px;margin-top:44px}
  .stackcard{padding:16px;border-radius:26px}
  .stackcard__top{gap:14px}
  .stackcard__media{min-height:210px}
  .mrq{padding:52px 0 24px}
  .mrq__tile{width:180px;height:118px}
  .vfxband{padding:60px 0 58px}
  .vfxband .mrq{padding-top:30px}
  .vfxband .mrq__tile{width:196px;height:126px}
  .vfxband__meta{gap:12px 26px}
  .vfxband__meta b{font-size:21px}
}
@media(prefers-reduced-motion:reduce){
  .mrq__row{transform:none!important}
  .stackcard{transform:none!important}
}