1.card {
2  max-width: 300px;
3  border-radius: 0.5rem;
4  background-color: #fff;
5  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
6  border: 1px solid transparent;
7}
8
9.content {
10  padding: 1.1rem;
11}
12
13.image {
14  object-fit: cover;
15  width: 100%;
16  height: 150px;
17  background-color: rgb(239, 205, 255);
18}
19
20.title {
21  color: #111827;
22  font-size: 1.125rem;
23  line-height: 1.75rem;
24  font-weight: 600;
25}
26
27.desc {
28  margin-top: 0.5rem;
29  color: #6B7280;
30  font-size: 0.875rem;
31  line-height: 1.25rem;
32}
33
34.action {
35  display: inline-flex;
36  margin-top: 1rem;
37  color: #ffffff;
38  font-size: 0.875rem;
39  line-height: 1.25rem;
40  font-weight: 500;
41  align-items: center;
42  gap: 0.25rem;
43  background-color: #2563EB;
44  padding: 4px 8px;
45  border-radius: 4px;
46}
47
48.action span {
49  transition: .3s ease;
50}
51
52.action:hover span {
53  transform: translateX(4px);
54}
55