merge in new changes

src/styles/global.css

@@ -1,26 +1,39 @@
 @import 'tailwindcss';
+@import 'preline/variants.css';
+@plugin '@tailwindcss/typography';
+@plugin '@tailwindcss/forms';
 
 /* Dark mode support for Tailwind CSS v4 */
 /* https://tailwindcss.com/docs/dark-mode */
 @custom-variant dark (&:where(.dark, .dark *));
 
-/* Add custom color palette */
+/* Add custom colors */
 @theme {
   --color-midnight: #0c354d;
   --color-turquoise: #0da797;
+  --color-steel: #4682b4;
   --color-bermuda: #7fbab4;
   --color-desert: #f9deb2;
   --color-bronze: #9e7f5e;
+  --color-gitea-primary: #609926;
+  --color-gitea-secondary: #4c7a33;
 }
 
 @layer base {
   :root {
-    font-family: 'Inter', sans-serif;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     --theme-transition: 0.3s ease;
   }
 
+  *,
+  ::after,
+  ::before,
+  ::backdrop,
+  ::file-selector-button {
+    border-color: var(--color-gray-200, currentColor);
+  }
+
   html {
     scroll-behavior: smooth;
     scroll-padding-top: 5rem;
@@ -28,13 +41,17 @@
   }
 
   body {
-    @apply min-h-screen bg-white text-zinc-900 dark:bg-zinc-900 dark:text-zinc-100;
     margin: 0;
     padding: 0;
     overflow-x: hidden;
+    --swup-fade-theme-duration: 0.2s;
+  }
+
+  button:not(:disabled),
+  [role='button']:not(:disabled) {
+    cursor: pointer;
   }
 
-  /* Simple theme transition */
   body,
   a,
   button {
@@ -45,110 +62,10 @@
   }
 }
 
-/* Minimal responsive styles */
-@media (max-width: 640px) {
-  html {
-    scroll-padding-top: 4rem;
-  }
-
-  /* Touch targets on mobile */
-  button,
-  a {
-    @apply min-h-[44px];
-  }
-}
-
-/* Add smooth animations */
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes slideUp {
-  from {
-    transform: translateY(20px);
-    opacity: 0;
-  }
-  to {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-
-@keyframes slideDown {
-  from {
-    transform: translateY(-20px);
-    opacity: 0;
-  }
-  to {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-
-@keyframes scaleIn {
-  from {
-    transform: scale(0.95);
-    opacity: 0;
-  }
-  to {
-    transform: scale(1);
-    opacity: 1;
-  }
-}
-
-/* Apply animations to elements */
-.animate-fade-in {
-  animation: fadeIn 0.6s ease forwards;
-}
-
-.animate-slide-up {
-  animation: slideUp 0.6s ease forwards;
-}
-
-.animate-slide-down {
-  animation: slideDown 0.6s ease forwards;
-}
-
-.animate-scale-in {
-  animation: scaleIn 0.6s ease forwards;
-}
-
-/* Staggered animation delays */
-.delay-100 {
-  animation-delay: 0.1s;
-}
-
-.delay-200 {
-  animation-delay: 0.2s;
-}
-
-.delay-300 {
-  animation-delay: 0.3s;
-}
-
-.delay-400 {
-  animation-delay: 0.4s;
-}
-
-/* Smooth hover transitions */
-a,
-button {
-  transition: all 0.5s ease;
-}
-
 /* Content reveal animations */
-.hero-text h1,
-.hero-text span,
-.hero-text p,
-.hero-text + p,
-.hero-text ~ div,
-article.group,
-a.group.flex.flex-col {
+.smooth-reveal,
+.smooth-reveal-2,
+.smooth-reveal-cards {
   opacity: 0;
   transform: translateY(20px);
   transition:
@@ -160,3 +77,16 @@ a.group.flex.flex-col {
   opacity: 1 !important;
   transform: translateY(0) !important;
 }
+
+.smooth-reveal-fade {
+  opacity: 0;
+  transform: translateY(0px);
+  transition:
+    opacity 1.8s ease,
+    transform 0.8s ease;
+}
+
+.animate-reveal-fade {
+  opacity: 1 !important;
+  transform: translateY(0) !important;
+}