added kvk and btw number back, updated text colour text-muted

src/components/CustomStyles.astro

@@ -37,7 +37,7 @@ import '@fontsource-variable/inter';
 
     --aw-color-text-heading: rgb(0 0 0);
     --aw-color-text-default: rgb(16 16 16);
-    --aw-color-text-muted: rgb(16 16 16 / 40%);
+    --aw-color-text-muted: rgb(0, 0, 0);
     --aw-color-bg-page: rgb(255 255 255);
 
     --aw-color-bg-page-dark: rgb(3 6 32);

src/components/ui/ModernTimeline.astro

@@ -134,7 +134,7 @@ const {
   /* Hover effect for details */
   [data-details] {
     transform-origin: top;
-    transition: max-height 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
+    transition: max-height 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                 opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
     will-change: max-height, opacity;
   }
@@ -146,7 +146,7 @@ const {
   }
   
   .group:hover [data-details] {
-    max-height: 500px; /* Large enough to fit content but still allows animation */
+    max-height: 550px; /* Large enough to fit content but still allows animation */
   }
   
   @keyframes fadeIn {

src/components/widgets/Footer.astro

@@ -84,12 +84,10 @@ const {
             <Icon name="circle-flags:eu" class="h-5 w-auto flag-square" />
           </span>
         </a>
-        <div class="flex items-center space-x-4 text-sm text-white-500">
-          {secondaryLinks.map(({ text, href }) => (
-            <a class="hover:text-gray-700 hover:underline dark:hover:text-gray-200 transition duration-150 ease-in-out" href={href}>
-              {text}
-            </a>
-          ))}
+        <!-- Business Information (Dutch Law Requirements) -->
+        <div class="text-sm text-white-500 space-y-1">
+          <p>KVK: 87654321 | BTW: NL123456789B01</p>
+          <p>info@365devnet.eu</p>
         </div>
       </div>
 
@@ -115,7 +113,13 @@ const {
         }
 
         <!-- Terms & Privacy Policy Links -->
-        
+        <div class="flex items-center space-x-4 text-sm text-white-500">
+          {secondaryLinks.map(({ text, href }) => (
+            <a class="hover:text-gray-700 hover:underline dark:hover:text-gray-200 transition duration-150 ease-in-out" href={href}>
+              {text}
+            </a>
+          ))}
+        </div>
       </div>
     </div>
   </div>

src/components/widgets/Hero.astro

@@ -57,7 +57,7 @@ const {
           {
             subtitle && (
               <p
-                class="text-xl text-muted mb-6 dark:text-slate-300 intersect-once intersect-quarter motion-safe:md:opacity-0 motion-safe:md:intersect:animate-fade content-backdrop p-2 rounded-md"
+                class="text-xl mb-6 dark:text-slate-300 intersect-once intersect-quarter motion-safe:md:opacity-0 motion-safe:md:intersect:animate-fade content-backdrop p-2 rounded-md"
                 set:html={subtitle}
               />
             )