*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}
body{background:#0f172a;color:#fff;overflow-x:hidden}
#particles{position:fixed;inset:0;z-index:-1}
.navbar{position:fixed;top:0;width:100%;display:flex;justify-content:space-between;padding:20px;background:rgba(15,23,42,.85);backdrop-filter:blur(10px)}
.navbar ul{display:flex;gap:20px;list-style:none}
.navbar a{text-decoration:none;color:#fff}
.menu{display:none}
.hero{height:100vh;display:flex;justify-content:center;align-items:center;text-align:center;background:linear-gradient(135deg,#0f172a,#1d4ed8)}
.hero h1{font-size:4rem}
.hero h2{color:#38bdf8}
.btn{display:inline-block;margin-top:20px;padding:12px 24px;background:#2563eb;color:#fff;text-decoration:none;border-radius:10px}
section{padding:100px 10%}
.glass,.card,.stats div{background:rgba(255,255,255,.08);backdrop-filter:blur(15px);padding:25px;border-radius:18px}
.grid,.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.timeline{border-left:3px solid #38bdf8;padding-left:20px}
.item{margin-bottom:20px}
.counter{font-size:2rem;font-weight:bold}
@media(max-width:768px){
.navbar ul{display:none;position:absolute;top:70px;left:0;width:100%;background:#111827;flex-direction:column;padding:20px}
.navbar ul.active{display:flex}
.menu{display:block}
.hero h1{font-size:2.5rem}
}