Bootstrap 5 Progress card with hover effect snippet

1<div class="container ccl">
2		<div class="card">
3			<div class="box">
4				<div class="percent">
5					<svg>
6						<circle cx="70" cy="70" r="70"></circle>
7						<circle cx="70" cy="70" r="70"></circle>
8					</svg>
9					<div class="number">
10						<h2>20<span>%</span></h2>
11					</div>
12				</div>
13				<h2 class="text">PIZZA</h2>
14			</div>
15		</div>
16		<div class="card">
17			<div class="box">
18				<div class="percent">
19					<svg>
20						<circle cx="70" cy="70" r="70"></circle>
21						<circle cx="70" cy="70" r="70"></circle>
22					</svg>
23					<div class="number">
24						<h2>90<span>%</span></h2>
25					</div>
26				</div>
27				<h2 class="text">BURGER</h2>
28			</div>
29		</div>
30		<div class="card">
31			<div class="box">
32				<div class="percent">
33					<svg>
34						<circle cx="70" cy="70" r="70"></circle>
35						<circle cx="70" cy="70" r="70"></circle>
36					</svg>
37					<div class="number">
38						<h2>70<span>%</span></h2>
39					</div>
40				</div>
41				<h2 class="text">NOODELS</h2>
42			</div>
43		</div>
44	</div>