body {
  background: linear-gradient(145deg, #f0f8ff 0%, #ffe5ec 100%);
}

.navbar {
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}

.card {
  border-radius: 18px;
  border: none;
}

.btn-warning, .btn-primary {
  border-radius: 12px;
  font-weight: bold;
}

h1, h2, h3, h4 {
  font-family: 'Poppins', sans-serif;
}

.card-img-top.same-size-img {
  height: 220px;           /* or whatever uniform height you want */
  width: 100%;             /* makes image stretch to card width */
  object-fit: cover;       /* crops image nicely within given space */
  object-position: center; /* centers crop */
}