* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: Arial, sans-serif; color: #fff; background: #111; }
.logo {
  height: 60px;
  display: block;
  margin-right: auto;
}

header { display: flex; justify-content: space-between; align-items: center; padding: 20px; background: #000; }
header .logo { font-size: 1.5rem; font-weight: bold; }
nav ul { list-style: none; display: flex; gap: 15px; }
nav a { color: #fff; text-decoration: none; }
.hero { text-align: center; padding: 100px 20px; }
.hero h1 { font-size: 3rem; }
.hero p { font-size: 1.2rem; margin: 20px 0; }
.btn { display: inline-block; padding: 10px 20px; background: #0af; color: #000; text-decoration: none; border-radius: 5px; }
section { padding: 60px 20px; }
.cards { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; }
.card { background: #222; padding: 20px; border-radius: 10px; width: 300px; text-align: center; }
form { display: flex; flex-direction: column; gap: 10px; max-width: 400px; margin: auto; }
input, textarea { padding: 10px; border: none; border-radius: 5px; }
button { padding: 10px; border: none; border-radius: 5px; background: #0af; color: #000; cursor: pointer; }
footer { text-align: center; padding: 20px; background: #000; }