1.pack_card {
2  position: relative;
3  display: flex;
4  flex-direction: column;
5  border-radius: 0.5rem;
6  border: 2px solid rgb(99 102 241);
7  padding: 1.5rem 1rem 1rem 1rem;
8  margin-top: 1rem;
9  background-color: #fff;
10  max-width: 300px;
11}
12
13.banner {
14  position: absolute;
15  left: 0px;
16  right: 0px;
17  top: -2rem;
18  display: flex;
19  justify-content: center;
20}
21
22.banner_tag {
23  display: flex;
24  height: 1.5rem;
25  align-items: center;
26  justify-content: center;
27  border-radius: 9999px;
28  background-color: rgb(99 102 241);
29  padding: 0.25rem 0.75rem;
30  font-size: 0.75rem;
31  line-height: 1rem;
32  font-weight: 700;
33  text-transform: uppercase;
34  letter-spacing: 0.1em;
35  color: #fff;
36}
37
38.pack_name {
39  margin-bottom: 0.5rem;
40  text-align: center;
41  font-size: 1.5rem;
42  line-height: 2rem;
43  font-weight: 700;
44  color: rgb(31 41 55 );
45}
46
47.description {
48  margin: 0 auto 2rem auto;
49  text-align: center;
50  color: rgb(107 114 128 );
51}
52
53.lists > :not([hidden]) ~ :not([hidden]) {
54  margin-top: 0.5rem;
55}
56
57.list {
58  display: flex;
59  gap: 0.5rem;
60}
61
62.list svg {
63  height: 1.5rem;
64  width: 1.5rem;
65  flex-shrink: 0;
66  color: rgb(99 102 241 );
67}
68
69.list span {
70  color: rgb( 75 85 99 );
71}
72
73.bottom {
74  margin-top: auto;
75  display: flex;
76  flex-direction: column;
77  gap: 2rem;
78}
79
80.price_container {
81  display: flex;
82  align-items: flex-end;
83  justify-content: center;
84  gap: 0.25rem;
85}
86
87.devise {
88  align-self: flex-start;
89  color: rgb( 75 85 99 );
90}
91
92.price {
93  font-size: 2.25rem;
94  line-height: 2.5rem;
95  font-weight: 700;
96  color: rgb(31 41 55 );
97}
98
99.date {
100  color: rgb(107 114 128 );
101}
102
103.btn {
104  display: block;
105  border-radius: 0.5rem;
106  background-color: rgb(99 102 241 );
107  padding: 0.75rem 2rem;
108  text-align: center;
109  font-size: 0.875rem;
110  line-height: 1.25rem;
111  font-weight: 600;
112  color: #fff;
113  outline: 2px solid transparent;
114  outline-offset: 2px;
115  transition: all .1s cubic-bezier(0.4, 0, 0.2, 1);
116}
117
118.btn:hover {
119  background-color: rgb(79 70 229 );
120}
121
122.btn:active {
123  background-color: rgb(67 56 202 );
124}