@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap');
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Inter',sans-serif; background:#060b18; color:white; line-height:1.7;}
nav{display:flex; justify-content:space-between; padding:22px 8%; background:#020617; position:sticky; top:0; z-index:10;}
nav a{color:white; text-decoration:none; margin-left:25px; font-weight:500; transition:.2s;}
nav a:hover{color:#60a5fa;}
.hero{padding:120px 20px; text-align:center; background:linear-gradient(135deg,#4f46e5,#2563eb); border-radius:12px;}
.hero h1{font-size:56px; margin-bottom:15px; animation:fadeIn 1s;}
.hero p{margin-bottom:25px; animation:fadeIn 2s;}
.btn{padding:14px 30px; background:white; color:#111; border-radius:10px; font-weight:bold; text-decoration:none; transition:.3s;}
.btn:hover{background:#60a5fa; color:white;}
.container{max-width:1100px; margin:auto; padding:80px 20px;}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:30px;}
.card{background:#020617; padding:30px; border-radius:16px; transition:.3s;}
.card:hover{transform:translateY(-10px);}
footer{padding:50px; text-align:center; background:#020617; margin-top:40px;}
h2{margin-bottom:30px; text-align:center;}
.blog-post{background:#111827; padding:25px; border-radius:14px; margin-bottom:25px;}
@keyframes fadeIn{0%{opacity:0; transform:translateY(20px);}100%{opacity:1; transform:translateY(0);}}