  .card-grid-3-col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-top: 1rem;
  }

  @media (max-width: 900px) {
    .card-grid-3-col {
      grid-template-columns: repeat(2, 1fr);
    }
  }

  @media (max-width: 600px) {
    .card-grid-3-col {
      grid-template-columns: 1fr;
    }
  }

  .card-link {
    text-decoration: none;
    color: inherit;
    display: block;
    border: 1px solid #eee9e9;
    border-radius: 8px;
    padding: 1rem;
    transition: box-shadow 0.3s ease, transform 0.2s ease;
    background-color: inherit;
  }

  .card-link:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
  }
