:root {
  --primary: #fffe7f;
  --primary-hover: #eceb84;
  --secondary: hsl(188, 92%, 62%);
  --secondary-hover: #51b3e7;
  --neutral: hsl(188, 73%, 90%);
  --neutral-hover: #e0e0e0;
  --ff-body: "Assistant", sans-serif;
  --ff-heading: "Assistant", sans-serif;
}
.message-content {
  ul {
    li::marker {
      content: "✔\00a0\00a0";
      color: var(--secondary);
      font-size: 1.1em;
    }
  }
}
.ul-title {
  border-bottom: 3px solid var(--primary);
  width: fit-content;
}
header.card-header {
  color: var(--light-color);
}
.card-main-image::before {
  background: rgb(49 36 36 / 40%);
}

@media (min-width: 45em) {
  .card-main-image {
    background-size: cover;
    background-position: center center;
    min-height: 80svh;
  }
}