body{
  margin:0;
  min-height:100vh;
  font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;
  background:#050b1e;
  color:#e8f0ff;
}

header{
  padding:40px;
  text-align:center;
}

h1{
  margin:0;
  font-size:3rem;
}

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:20px;
  padding:40px;
}

.card{
  display:flex;
  align-items:center;
  justify-content:center;
  height:140px;
  background:#0b1f4d;
  border-radius:16px;
  text-decoration:none;
  color:#fff;
  font-size:1.2rem;
  box-shadow:0 10px 30px rgba(0,0,0,.5);
  transition:.2s;
}

.card:hover{
  background:#12307a;
  transform:translateY(-4px);
}