body {
  font-family: 'Segoe UI', sans-serif;
  padding-top: 70px;
}

/* HERO */
.hero {
  margin-top: -10px; /* reduces gap */
  background: linear-gradient(135deg, #000, #0d6efd);
  padding: 100px 20px;
}

/* CARDS */
.card {
  border: none;
  border-radius: 15px;
  transition: 0.3s;
  height: 100%;
}

.card:hover {
  transform: translateY(-10px);
}

/* CTA */
.cta {
  background: linear-gradient(135deg, #0d6efd, #000);
}

/* BUTTONS */
button, .btn {
  border-radius: 30px;
}

/* NAVBAR */
.navbar {
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}

/* 📱 MOBILE FIXES */
@media (max-width: 768px) {

  .hero {
    margin-top: -10px; /* reduces gap */
    padding: 80px 15px;
  }

  .hero h1 {
    font-size: 28px;
  }

  .hero p {
    font-size: 14px;
  }

  .card {
    padding: 15px;
  }

  h2 {
    font-size: 22px;
  }
}

.card ul li {
  margin: 8px 0;
}