.card {
  background: var(--surface);
  color: var(--text);
  border-radius: var(--radius);
  border: none;
  box-shadow: 0 6px 20px rgba(0,0,0,.15);
  transition: transform .25s ease, box-shadow .25s ease;
}

.card:hover {
  transform: translateY(-8px);
  box-shadow: 0 14px 36px rgba(0,0,0,.25);
}

.card p {
  color: var(--text-muted);
  margin-bottom: 0.5rem;
}

.card h5 {
  font-weight: 700;
  margin-bottom: 0.8rem;
}

.btn-primary {
  background: linear-gradient(135deg,var(--primary),var(--accent));
  border: none;
  border-radius: 999px;
  padding: 12px 28px;
  font-weight: 600;
  transition: transform .2s ease;
}

.btn-primary:hover {
  transform: scale(1.05);
}

.badge-pop {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #ffbe0b;
  color: #000;
  font-weight: 600;
  padding: 0.4rem 0.6rem;
  border-radius: 12px;
  font-size: 0.8rem;
}