body{margin:0;font-family:Arial;background:#0a0a0a;color:#fff}
.nav{display:flex;justify-content:space-between;padding:15px;background:#000;position:sticky;top:0}
nav a{color:white;margin:10px;text-decoration:none}
.hero{height:80vh;display:flex;flex-direction:column;justify-content:center;align-items:center;
background:linear-gradient(45deg,#141e30,#243b55);animation:grad 8s infinite;background-size:400%}
@keyframes grad{0%{background-position:0%}50%{background-position:100%}100%{background-position:0%}}
section{padding:40px;text-align:center}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.card{background:#111;padding:20px;border-radius:10px;transition:0.3s}
.card:hover{transform:scale(1.05)}
iframe{width:100%;height:300px;border:0}
footer{padding:20px;background:#000}