/* OneCAD — trang giới thiệu nền tảng (nen-tang/*.html) tông tối, đồng bộ trang chủ HST-6A
 * Chỉ áp cho <body class="np-dark" data-np="…">. Không đổi site.css.
 */
body.np-dark{
 --ink:#eef5fb;--ink2:#b9c8d6;--mute:#8fa4b8;--line:rgba(160,210,240,.14);--bg:#050a14;--card:rgba(12,24,42,.72);
 --shadow:0 20px 50px -24px rgba(0,0,0,.7);
 background:#050a14;color:var(--ink)
}
/* màu riêng từng nền tảng (sáng hơn để đọc trên nền tối) — đặt trên con trực tiếp để thắng style nội dòng của <body> */
body.np-dark[data-np="academy"]>*{--a:#5fe0cf;--b:#1fb5a0;--c:#3fd0bb;--s:rgba(31,181,160,.45);--np1:#1fb5a0;--np2:#6ff0dc}
body.np-dark[data-np="forma"]>*{--a:#b4e07a;--b:#5fae32;--c:#8fd05a;--s:rgba(108,192,74,.45);--np1:#6cc04a;--np2:#c6f08a}
body.np-dark[data-np="nexus"]>*{--a:#7ab8ff;--b:#1f6fd6;--c:#6fa8ff;--s:rgba(20,120,212,.5);--np1:#1478d4;--np2:#8cc8ff}
body.np-dark[data-np="portal"]>*{--a:#6cc8ff;--b:#1a8be0;--c:#5cbcff;--s:rgba(40,160,240,.45);--np1:#2aa0f0;--np2:#9edcff}
body.np-dark[data-np="fm"]>*{--a:#74e0a6;--b:#25a060;--c:#4fd08a;--s:rgba(40,170,100,.45);--np1:#2bb36a;--np2:#9af0c0}
body.np-dark[data-np="iot"]>*{--a:#ffcf7a;--b:#e88a2c;--c:#f7a64a;--s:rgba(243,154,43,.45);--np1:#f39a2b;--np2:#ffd49a}
body.np-dark[data-np="ai"]>*{--a:#6ff0dc;--b:#1478d4;--c:#4fe0c4;--s:rgba(31,181,160,.45);--np1:#1fb5a0;--np2:#7cc4ff}
body.np-dark .grad{background:linear-gradient(95deg,#7cc4ff 0%,#3fd0bb 45%,#a6e27f 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
body.np-dark .eyebrow{color:#7fd8c8}
body.np-dark .lead{color:#a9bccd}
body.np-dark .btn.pri{background:linear-gradient(100deg,#1478d4,#1fb5a0);box-shadow:0 8px 30px -8px rgba(31,181,160,.6),inset 0 1px 0 rgba(255,255,255,.25)}
body.np-dark .btn.sec{background:rgba(255,255,255,.04);border:1px solid rgba(190,225,250,.24);color:#e6f0f8;backdrop-filter:blur(8px)}
body.np-dark .btn.sec:hover{background:rgba(255,255,255,.09)}

/* thanh điều hướng */
body.np-dark .nav.sub{background:rgba(5,10,20,.78);box-shadow:0 1px 0 rgba(160,210,240,.1)}
body.np-dark .nav.sub.scrolled{background:rgba(5,10,20,.88)}
body.np-dark .crumb a{color:#8fa4b8}body.np-dark .crumb a:hover{color:#fff}
body.np-dark .crumb .sep{color:#3b5064}
body.np-dark .crumb b{color:#fff}
body.np-dark .nav.sub .btn.idb{background:rgba(255,255,255,.05);border:1px solid rgba(190,225,250,.24);color:#e6f0f8}
body.np-dark .nav.sub .btn.idb:hover{background:rgba(255,255,255,.1)}

/* đầu trang + nền động */
body.np-dark .phero{background:#050a14;isolation:isolate}
body.np-dark .phero .hero-bg{display:none}
.np-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:radial-gradient(50% 60% at 72% 40%,color-mix(in srgb,var(--np1) 22%,transparent),transparent 70%),radial-gradient(40% 50% at 92% 10%,rgba(20,120,212,.14),transparent 70%),#050a14}
.np-bg canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.np-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,10,20,.88) 0%,rgba(5,10,20,.55) 34%,rgba(5,10,20,0) 62%),linear-gradient(180deg,rgba(5,10,20,0) 70%,#050a14 100%)}
.np-nocanvas .np-bg{background:radial-gradient(50% 60% at 72% 40%,color-mix(in srgb,var(--np1) 26%,transparent),transparent 70%),
 repeating-linear-gradient(0deg,rgba(120,200,220,.05) 0 1px,transparent 1px 44px),repeating-linear-gradient(90deg,rgba(120,200,220,.05) 0 1px,transparent 1px 44px),#050a14}
body.np-dark .phero{padding-bottom:70px}
body.np-dark .pi{box-shadow:0 0 0 6px rgba(255,255,255,.06),0 0 40px var(--s),0 16px 32px var(--s)}
body.np-dark .ph1{color:#fff}
body.np-dark .ph1 em{background:linear-gradient(95deg,var(--np2),var(--c));-webkit-background-clip:text;background-clip:text;color:transparent}
body.np-dark[data-np="ai"] .ph1 em{background:linear-gradient(95deg,#7cc4ff,#3fd0bb 50%,#a6e27f);-webkit-background-clip:text;background-clip:text}
body.np-dark .ptag{background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c);border:1px solid color-mix(in srgb,var(--c) 40%,transparent)}
body.np-dark .prole{color:var(--c)}
body.np-dark .pnote{color:#7f95aa}
body.np-dark .pbox{background:color-mix(in srgb,var(--c) 12%,rgba(8,16,30,.6));color:color-mix(in srgb,var(--c) 45%,#fff);border-color:color-mix(in srgb,var(--c) 30%,transparent);backdrop-filter:blur(8px)}
body.np-dark .shot{background:rgba(10,22,38,.22);border:1px solid rgba(160,220,240,.18);box-shadow:0 30px 80px -30px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.05);backdrop-filter:blur(1.5px);-webkit-backdrop-filter:blur(1.5px)}
body.np-dark .shot div{background:linear-gradient(135deg,rgba(5,10,20,.25),rgba(5,10,20,.1));border-color:rgba(160,210,240,.2);color:#8fa4b8}
body.np-dark .shot svg{color:#5d7186}

/* tính năng + kết nối */
body.np-dark .pfeat,body.np-dark .pconn{background:#050a14}
body.np-dark .pconn{background:radial-gradient(50% 60% at 50% 0%,color-mix(in srgb,var(--np1) 10%,transparent),transparent 70%),#050a14}
body.np-dark .fc,body.np-dark .cn{background:linear-gradient(180deg,rgba(14,28,48,.78),rgba(8,16,30,.82));border-color:var(--line);box-shadow:var(--shadow)}
body.np-dark .fc h3,body.np-dark .cn b{color:#fff}
body.np-dark .fc p,body.np-dark .cn span{color:#a9bccd}
body.np-dark .fc .no{color:var(--c)}
body.np-dark .cn:hover{border-color:color-mix(in srgb,var(--c) 45%,transparent);box-shadow:0 26px 60px -24px rgba(0,0,0,.8)}
body.np-dark .cn .go{color:color-mix(in srgb,var(--c) 55%,#fff)}
body.np-dark .cn .more{color:#9fb2c4}body.np-dark .cn .more:hover{color:#fff}
body.np-dark h2{color:#fff}

/* CTA + chân trang */
body.np-dark .cta-sec{background:#050a14}
body.np-dark .cta-box{background:linear-gradient(115deg,rgba(20,120,212,.85),rgba(22,137,125,.85) 55%,rgba(79,154,38,.8));box-shadow:0 30px 80px -30px rgba(31,181,160,.5)}
body.np-dark .cta-box .btn.pri{background:#fff;color:#0b5fa8;box-shadow:0 10px 26px rgba(0,0,0,.25)}
body.np-dark .cta-box .btn.sec{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff}
body.np-dark footer{background:#040810;border-color:var(--line);color:#8fa4b8}
body.np-dark footer h5{color:#e6f0f8}
body.np-dark footer li a:hover,body.np-dark footer li a[aria-current]{color:#fff}
body.np-dark footer .legal{border-color:var(--line)}
@media (max-width:1080px){.np-bg::after{background:linear-gradient(180deg,rgba(5,10,20,.55) 0%,rgba(5,10,20,.75) 55%,#050a14 100%)}}
