/* Vendai · Tools Hub — Neon/Black */
:root{
  --bg: #0a0a0a; --panel: #0f0f10; --text: #e9fef1; --muted: #9feabf;
  --accent: #00ff95; --accent-weak: #00c977; --card: #111214; --border: #1b1c1f; --shadow: rgba(0,0,0,.35);
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Arial,sans-serif;background:radial-gradient(1000px 600px at 30% -10%, rgba(0,255,149,.1), transparent 60%), var(--bg);color:var(--text)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border);background:linear-gradient(180deg, rgba(0,255,149,.05), rgba(0,0,0,0));position:sticky; top:0; z-index:10; backdrop-filter: blur(6px);}
.brand{display:flex; align-items:center; gap:14px;} .logo{height:42px; width:auto; filter: drop-shadow(0 0 6px rgba(0,255,149,.35));}
.title-wrap{display:flex; flex-direction:column; gap:6px;} .title{margin:0; font-size:22px; letter-spacing:.4px;}
.kitt-bar{position:relative;height:6px;width:210px;background:linear-gradient(90deg,#022,#044);border-radius:999px;overflow:hidden;box-shadow:inset 0 0 10px rgba(0,255,149,.25)}
.kitt-bar .scanner{position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(0,255,149,.0) 20%,rgba(0,255,149,.85) 50%,rgba(0,255,149,.0) 80%,transparent 100%);width:40%;animation:scan 2.8s ease-in-out infinite}
@keyframes scan{0%{transform: translateX(-60%);}50%{transform: translateX(120%);}100%{transform: translateX(-60%);}}
.home{color:var(--muted);text-decoration:none;border:1px solid var(--border);padding:8px 12px;border-radius:10px}
.home:hover{border-color:var(--accent-weak); color:var(--accent);}
.container{max-width:1100px;margin:32px auto;padding:0 16px}
.grid{display:grid;grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap:18px}
.card{display:block;background:linear-gradient(180deg, rgba(0,255,149,.05), rgba(0,0,0,0)); border:1px solid var(--border);border-radius:16px;padding:18px;text-decoration:none;color:var(--text);box-shadow: 0 10px 30px var(--shadow);transition: transform .18s ease, border-color .18s, box-shadow .18s ease}
.card:hover{transform: translateY(-3px);border-color: var(--accent-weak);box-shadow: 0 18px 40px rgba(0,255,149,.15)} .card h2{margin:0 0 8px; font-size:18px} .card p{margin:0;color:var(--muted)}
.footer{margin-top:30px; opacity:.8; font-size:13px; color:var(--muted)}