created animation + hoverAnimation helperFunction. Also Hero + Techstack (prev) styled and animated.

src/css/TechStack.css

@@ -0,0 +1,53 @@
+.techStackContainer {
+  grid-area: 4 / 1 / 8 / 5;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  animation-duration: 1s;
+}
+
+.techStackContainer:hover {
+  animation-duration: 0.5s;
+}
+
+.techStackContainer h2 {
+  margin-bottom: 10px;
+  align-self: flex-start;
+}
+
+.techIcon {
+  width: 4rem;
+  height: 4rem;
+  filter: grayscale(0.7);
+  transition: transform 0.3s ease, filter 0.3s ease;
+}
+
+.techIcon:hover {
+  filter: none;
+  animation: tada 1s;
+  cursor: pointer;
+}
+
+.techStack {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-wrap: wrap;
+  gap: 10px;
+  margin-bottom: 1rem;
+}
+
+.techStackShowMore {
+  font-size: 1.2rem;
+  color: rgb(151, 151, 151);
+  text-decoration: none;
+  border-bottom: 1px solid rgb(151, 151, 151);
+  /*   align-self: flex-start; */
+}
+
+@keyframes techIconHover {
+  10% {
+    transform: scale();
+  }
+}