update home page

components/shared/CardShared.module.css

@@ -0,0 +1,51 @@
+.iconWrapper {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  background-color: #FFFFFF;
+  border-top-left-radius: 30px;
+  border-bottom-right-radius: 25px;
+  padding: 10px 10px 0 10px;
+  z-index: 20;
+}
+
+.iconWrapper::before {
+  content: "";
+  position: absolute;
+  top: -20px;
+  right: 0;
+  width: 20px;
+  height: 20px;
+  background: radial-gradient(circle at 0 0, transparent 20px, #ffffff 20.5px);
+}
+
+.iconWrapper::after {
+  content: "";
+  position: absolute;
+  bottom: 0;
+  left: -20px;
+  width: 20px;
+  height: 20px;
+  background: radial-gradient(circle at 0 0, transparent 20px, #ffffff 20.5px);
+}
+
+.iconSlideAslant {
+  overflow: hidden;
+}
+
+.iconSlideAslantInner {
+  display: inline-flex;
+  transform: translate3d(-12px, 12px, 0);
+  transition: transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
+  will-change: transform;
+}
+
+.iconSlideAslantInner svg {
+  flex: 0 0 auto;
+  margin: 0 12px;
+}
+
+.iconSlideAslant:hover .iconSlideAslantInner,
+:global(.aiero-card:hover) .iconSlideAslantInner {
+  transform: translate3d(12px, -12px, 0);
+}