
/* Extra component styling */
h1,h2,h3{letter-spacing:-0.02em}
ul{margin:0;padding-left:18px}
.menu li{list-style:none}
.menu li a{padding:8px 10px;border-radius:10px}
.menu li a:hover{background:rgba(255,255,255,.06);text-decoration:none}

.logos{padding:20px 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.logos .strip{display:flex;gap:28px;flex-wrap:wrap;justify-content:center;align-items:center;opacity:.85}
.logo{height:28px;filter:grayscale(1);opacity:.8}
.metrics{padding:48px 0}
.metrics .grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.metric{background:rgba(34,211,238,.08);border:1px solid rgba(34,211,238,.25);border-radius:16px;padding:16px;text-align:center}
.metric .num{font-size:34px;font-weight:800;color:#67e8f9}
.usecases{padding:48px 0}
.usecases .grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.tab-btns{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.tab-btns .btn{padding:8px 12px}
.tab-btns .active{background:rgba(255,255,255,.1)}
.accordion{display:grid;gap:12px}
.acc{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden}
.acc summary{cursor:pointer;padding:14px 16px;font-weight:600;list-style:none}
.acc summary::-webkit-details-marker{display:none}
.acc .content{padding:0 16px 16px;color:#94a3b8}
.pricing-toggle{display:flex;gap:10px;justify-content:center;margin-bottom:18px}
.toggle{display:inline-flex;border:1px solid rgba(255,255,255,.12);border-radius:999px;overflow:hidden}
.toggle button{border:0;padding:8px 14px;background:transparent;color:#cbd5e1;cursor:pointer}
.toggle button.active{background:var(--nh-primary);color:#fff}
.pricing .price{transition:.2s ease}

:root{
  --nh-primary:#7c3aed; /* purple */
  --nh-accent:#22d3ee;  /* cyan */
  --nh-bg:#0a0f1e;
  --nh-card:#0f172a;
}
body{font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;}
.hero{padding:110px 0 70px;background:radial-gradient(800px 400px at 20% -10%, rgba(124,58,237,.25), transparent 60%), radial-gradient(800px 400px at 80% -10%, rgba(34,211,238,.18), transparent 60%);}
.hero .cta .btn{min-width:140px}
.btn-primary{box-shadow:0 8px 30px rgba(124,58,237,.25)}
.card{backdrop-filter: blur(4px)}
.ribbon{letter-spacing:.02em;text-transform:uppercase;font-size:12px}
.menu li a{font-weight:500}
.site-header{border-color:rgba(124,58,237,.25)}
.metric{background:rgba(124,58,237,.08);border-color:rgba(124,58,237,.28)}
.logo{opacity:.7}
.price{font-weight:800}
.card ul{margin-top:8px}
.toggle button.active{background:linear-gradient(90deg,var(--nh-primary),#2563eb)}
.acc summary{font-weight:700}
