body{
  margin:0;
  font-family:Arial,sans-serif;
  background:#0d1117;
  color:white;
}

.hero{
  height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:linear-gradient(135deg,#0d1117,#1f2937,#111827);
  position:relative;
  overflow:hidden;
}

.overlay{
  position:absolute;
  width:300px;
  height:300px;
  background:#3b82f6;
  filter:blur(120px);
  animation:float 6s infinite ease-in-out;
}

@keyframes float{
  0%{transform:translateY(0px);}
  50%{transform:translateY(-30px);}
  100%{transform:translateY(0px);}
}

.content{
  position:relative;
  z-index:2;
}

h1{
  font-size:70px;
  margin-bottom:10px;
  letter-spacing:5px;
}

p{
  color:#d1d5db;
}

.btn{
  display:inline-block;
  margin-top:20px;
  padding:12px 24px;
  background:#2563eb;
  color:white;
  text-decoration:none;
  border-radius:10px;
}

.section{
  padding:80px 20px;
  text-align:center;
}

.cards{
  display:flex;
  gap:20px;
  justify-content:center;
  flex-wrap:wrap;
}

.card{
  background:#161b22;
  padding:20px;
  border-radius:15px;
  width:250px;
  box-shadow:0 0 20px rgba(59,130,246,0.2);
}

.dark{
  background:#111827;
}

footer{
  padding:20px;
  text-align:center;
  background:#0b0f14;
}
.section p{
  font-size:18px;
  line-height:1.8;
}