/* ─── Product page (nova/product) ────────────────────────────── */
.npp-hero { background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 70%, #000000 100%); padding: 80px 0 64px; color: #fff; }
.npp-hero-inner { display:grid; grid-template-columns:1fr 380px; gap:48px; align-items:center; }
.npp-hero-label { display:inline-block; background:rgba(245,158,11,.18); color:#fbbf24; border:1px solid rgba(245,158,11,.3); padding:5px 16px; border-radius:99px; font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:20px; }
.npp-hero h1 { font-size:clamp(2rem,4vw,3rem); font-weight:900; letter-spacing:-.04em; margin:0 0 16px; }
.npp-hero h1 em { font-style:normal; background:linear-gradient(90deg,#34d399,#6ee7b7); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.npp-hero-sub { font-size:1.05rem; color:rgba(255,255,255,.75); line-height:1.7; margin:0 0 28px; max-width:500px; }
.npp-hero-price { font-size:1rem; color:#6ee7b7; font-weight:600; margin-bottom:28px; }
.npp-hero-btns { display:flex; gap:12px; flex-wrap:wrap; }

.npp-info-card { background:rgba(255,255,255,.08); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.12); border-radius:16px; padding:24px; }
.npp-info-card h3 { font-size:1rem; font-weight:700; color:rgba(255,255,255,.7); margin:0 0 16px; }
.npp-feat-list { list-style:none; display:flex; flex-direction:column; gap:10px; }
.npp-feat-item { display:flex; align-items:center; gap:10px; font-size:.9rem; color:#fff; }
.npp-feat-item::before { content:'✓'; color:#34d399; font-weight:800; flex-shrink:0; }

.npp-specs { background:var(--n-bg); padding:60px 0; }
.npp-specs-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:20px; }
.npp-spec-card { background:#fff; border:1px solid var(--n-border); border-radius:14px; padding:24px; text-align:center; border-top:3px solid var(--n-primary); }
.npp-spec-icon { font-size:1.8rem; margin-bottom:10px; }
.npp-spec-label { font-size:.82rem; color:var(--n-text-muted); font-weight:600; text-transform:uppercase; letter-spacing:.06em; margin-bottom:6px; }
.npp-spec-value { font-size:1.3rem; font-weight:800; color:var(--n-text); }

.npp-scenarios { padding:60px 0; }
.npp-scenarios-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; margin-top:40px; }
.npp-scenario { background:#fff; border:1px solid var(--n-border); border-radius:14px; padding:28px; transition:var(--n-transition); }
.npp-scenario:hover { border-color:var(--n-primary); box-shadow:var(--n-shadow); }
.npp-scenario-icon { font-size:1.8rem; margin-bottom:12px; }
.npp-scenario-title { font-size:1rem; font-weight:700; color:var(--n-text); margin-bottom:8px; }
.npp-scenario-desc { font-size:.88rem; color:var(--n-text-muted); line-height:1.65; }

.npp-code-section { background:#0a1a0f; padding:60px 0; }
.npp-code-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.npp-code-text h2 { font-size:1.8rem; font-weight:800; color:#fff; margin:0 0 14px; letter-spacing:-.03em; }
.npp-code-text p { font-size:.95rem; color:rgba(255,255,255,.65); line-height:1.7; margin:0 0 24px; }
.npp-endpoint { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:10px; padding:16px 20px; font-family:var(--n-mono); font-size:.85rem; color:#6ee7b7; word-break:break-all; margin-bottom:16px; }
.npp-endpoint .ep-label { font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.4); display:block; margin-bottom:6px; font-family:var(--n-font); }
.npp-code-box { background:#0d1f13; border:1px solid rgba(255,255,255,.08); border-radius:16px; overflow:hidden; }
.npp-code-hd { display:flex; align-items:center; gap:8px; padding:12px 18px; background:rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.06); }
.npp-code-dots { display:flex; gap:6px; }
.npp-code-dot { width:10px; height:10px; border-radius:50%; }
.npp-code-lang { font-size:.78rem; color:rgba(255,255,255,.4); margin-left:auto; font-family:var(--n-mono); }
.npp-code-body { padding:24px; }
.npp-code-body pre { margin:0; }
.npp-code-body code { font-family:var(--n-mono); font-size:.82rem; line-height:1.7; color:#e2e8f0; white-space:pre-wrap; }
.npp-code-body .cm  { color:#4b7a5a; }
.npp-code-body .kw  { color:#86efac; }
.npp-code-body .str { color:#fca5a5; }
.npp-code-body .var { color:#93c5fd; }
.npp-code-body .num { color:#fbbf24; }
.npp-code-body .fn  { color:#c084fc; }

.npp-related { padding:60px 0; background:var(--n-bg); }
.npp-related-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-top:36px; }
.npp-related-card { background:#fff; border:2px solid var(--n-border); border-radius:14px; padding:20px; text-align:center; transition:var(--n-transition); display:block; }
.npp-related-card:hover { border-color:var(--n-primary); box-shadow:var(--n-shadow); text-decoration:none; transform:translateY(-3px); }
.npp-related-icon { font-size:1.8rem; margin-bottom:8px; }
.npp-related-name { font-size:.92rem; font-weight:700; color:var(--n-text); margin-bottom:4px; }
.npp-related-price { font-size:.82rem; color:var(--n-primary); font-weight:600; }

.npp-cta { background:linear-gradient(135deg,var(--n-primary-d),#0a0a0a); padding:64px 24px; text-align:center; color:#fff; }
.npp-cta h2 { font-size:2rem; font-weight:900; margin:0 0 12px; letter-spacing:-.03em; }
.npp-cta p  { color:rgba(255,255,255,.7); margin:0 0 28px; font-size:1rem; }
.npp-cta-btns { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.npp-cta-btns a { padding:14px 32px; border-radius:10px; font-size:1rem; font-weight:700; transition:var(--n-transition); text-decoration:none; }
.npp-cta-btns .solid { background:#fff; color:var(--n-primary); }
.npp-cta-btns .outline { border:2px solid rgba(255,255,255,.4); color:#fff; }
.npp-cta-btns a:hover { opacity:.88; }

@media(max-width:900px) {
  .npp-hero-inner { grid-template-columns:1fr; }
  .npp-code-grid { grid-template-columns:1fr; }
}
