feat: Implement dynamic typing animation for the home page hero title and customize the footer template.

custom/public/assets/css/oribi.css

@@ -59,6 +59,55 @@ footer {
     -webkit-text-fill-color: transparent;
 }
 
+.orange-heart {
+    color: var(--custom-primary) !important;
+    background: none !important;
+    -webkit-background-clip: unset !important;
+    background-clip: unset !important;
+    -webkit-text-fill-color: var(--custom-primary) !important;
+    display: inline-block;
+    filter: drop-shadow(0 0 5px rgba(208, 64, 0, 0.8));
+    text-shadow: none !important;
+    margin-left: 0.3ch;
+}
+
+.orange-heart::after,
+.orange-heart::before {
+    content: none !important;
+    display: none !important;
+}
+
+@keyframes cursor-blink {
+
+    from,
+    to {
+        opacity: 1;
+    }
+
+    50% {
+        opacity: 0;
+    }
+}
+
+.typing-text {
+    display: inline-block;
+    position: relative;
+}
+
+/* Blinking cursor that moves with the text */
+.typing-text::after {
+    content: "";
+    display: inline-block;
+    width: 2px;
+    height: 1.1em;
+    background-color: var(--custom-primary);
+    animation: cursor-blink 1s step-end infinite;
+    box-shadow: 0 0 8px var(--custom-primary);
+    margin-left: 2px;
+    vertical-align: middle;
+    transform: translateY(-0.05em);
+}
+
 .hero-subtitle {
     font-size: 1.5rem;
     color: #888;