/* AI Agents Hub — theme sombre premium, violet/bleu neon, glassmorphism */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@600;700;800&display=swap');
:root{
  --bg:#070b18; --bg2:#0b1230; --card:rgba(255,255,255,.055); --stroke:rgba(255,255,255,.12);
  --vio:#8b5cf6; --blu:#38bdf8; --teal:#2dd4bf; --ink:#eef2ff; --mut:#9aa7c7;
  --grad:linear-gradient(120deg,#8b5cf6,#38bdf8);
}
*{font-family:'Inter',system-ui,sans-serif}
h1,h2,h3,.font-d{font-family:'Poppins','Inter',sans-serif}
body{background:radial-gradient(1100px 500px at 85% -5%,rgba(139,92,246,.22),transparent),radial-gradient(900px 500px at 5% 15%,rgba(56,189,248,.14),transparent),var(--bg);color:var(--ink);min-height:100vh}
a{color:var(--blu)} a:hover{color:#7dd3fc}
.text-mut{color:var(--mut)!important}
/* navbar */
.navbar{background:rgba(7,11,24,.72)!important;backdrop-filter:blur(14px);border-bottom:1px solid var(--stroke)}
.navbar .nav-link{color:var(--ink);font-weight:600;opacity:.85}
.navbar .nav-link:hover,.navbar .nav-link.active{opacity:1;color:#fff}
.logo-badge{width:40px;height:40px;border-radius:12px;background:var(--grad);display:inline-flex;align-items:center;justify-content:center;font-size:1.3rem;box-shadow:0 0 24px rgba(139,92,246,.55)}
/* buttons */
.btn-grad{background:var(--grad);border:0;color:#fff;font-weight:700;border-radius:.8rem;padding:.7rem 1.6rem;box-shadow:0 8px 26px rgba(139,92,246,.4);transition:.2s}
.btn-grad:hover{color:#fff;transform:translateY(-2px);box-shadow:0 12px 32px rgba(56,189,248,.45)}
.btn-ghost{border:1px solid var(--stroke);color:var(--ink);border-radius:.8rem;padding:.7rem 1.6rem;font-weight:600;background:rgba(255,255,255,.04)}
.btn-ghost:hover{border-color:var(--vio);color:#fff}
/* glass cards */
.glass{background:var(--card);border:1px solid var(--stroke);border-radius:1.2rem;backdrop-filter:blur(12px)}
.agent-card{transition:.25s;overflow:hidden;position:relative}
.agent-card:hover{transform:translateY(-6px);border-color:rgba(139,92,246,.6);box-shadow:0 20px 50px rgba(139,92,246,.25)}
.avatar-ai{width:96px;height:96px;border-radius:28px;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:2.6rem;font-weight:800;font-family:'Poppins';color:#fff;box-shadow:0 0 30px rgba(56,189,248,.5)}
.avatar-sm{width:56px;height:56px;border-radius:16px;font-size:1.4rem}
/* hero */
.hero{padding:5rem 0 3rem;position:relative}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;pointer-events:none}
.kpi{font-size:2rem;font-weight:800;font-family:'Poppins'}
.step-num{width:52px;height:52px;border-radius:16px;background:var(--grad);font-weight:800;font-size:1.3rem;display:flex;align-items:center;justify-content:center}
/* skills bars */
.skill-bar{height:8px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.skill-bar>div{height:100%;border-radius:99px;background:var(--grad)}
.timeline{border-left:2px solid rgba(139,92,246,.4);padding-left:1.2rem}
.timeline-item{position:relative;padding-bottom:1.4rem}
.timeline-item::before{content:"";position:absolute;left:calc(-1.2rem - 6px);top:.3rem;width:10px;height:10px;border-radius:50%;background:var(--blu);box-shadow:0 0 12px var(--blu)}
.chip{display:inline-block;padding:.3rem .8rem;border-radius:99px;background:rgba(139,92,246,.15);border:1px solid rgba(139,92,246,.4);font-size:.82rem;margin:.15rem}
/* forms */
.form-control,.form-select{background:rgba(255,255,255,.06);border:1px solid var(--stroke);color:var(--ink);border-radius:.7rem}
.form-control:focus,.form-select:focus{background:rgba(255,255,255,.09);border-color:var(--vio);color:#fff;box-shadow:0 0 0 .2rem rgba(139,92,246,.25)}
.form-control::placeholder{color:#7c8bb0}
label.form-label{font-weight:600}
/* dashboard */
.side{background:rgba(255,255,255,.03);border-right:1px solid var(--stroke);min-height:calc(100vh - 66px)}
.side .nav-link{color:var(--ink);opacity:.8;border-radius:.7rem;margin:2px 0;font-weight:600}
.side .nav-link:hover,.side .nav-link.active{opacity:1;background:linear-gradient(90deg,rgba(139,92,246,.35),rgba(56,189,248,.2));color:#fff}
.topbar-d{border-bottom:1px solid var(--stroke);background:rgba(7,11,24,.6);backdrop-filter:blur(10px)}
.table{color:var(--ink)} .table thead th{color:var(--mut);text-transform:uppercase;font-size:.72rem;letter-spacing:.08em;border-bottom:1px solid var(--stroke)}
.table tbody td{border-bottom:1px solid rgba(255,255,255,.06)}
.badge{border-radius:.6rem}
.alert{border-radius:.9rem}
/* faq */
.accordion-item{background:var(--card);border:1px solid var(--stroke)!important;color:var(--ink);border-radius:.9rem!important;overflow:hidden;margin-bottom:.6rem}
.accordion-button{background:transparent;color:var(--ink);font-weight:700}
.accordion-button:not(.collapsed){background:rgba(139,92,246,.15);color:#fff}
.accordion-button::after{filter:invert(1)}
footer{border-top:1px solid var(--stroke);background:rgba(0,0,0,.3)}
@media print{ .no-print{display:none!important} body{background:#fff;color:#000} .glass{border:1px solid #ccc;background:#fff} }
@media(max-width:768px){ .hero{padding:3rem 0 2rem} .kpi{font-size:1.5rem} }
