.hero {
  background-color: #f5f8fa;
}

.card {
  border-radius: 12px;
  transition: transform 0.2s;
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

.footer {
  background-color: #ffffff;
  border-top: 1px solid #eaeef2;
}

details > summary {
  cursor: pointer;
}

details > summary::-webkit-details-marker {
  display: none;
}

details > summary::after {
  float: right;
  font-weight: 700;
}

details[open] > summary::after {
  content: "−";
}

details:not([open]) > summary::after {
  content: "+";
}