Initial Nuxt frontend import

- Complete GGZ Ecademy Nuxt.js user portal
- Learning products browser and management
- Member management interface
- User authentication and roles
- Multi-language support (NL/EN)
- Vuex store for state management
- Component-based architecture

components/Card.vue

@@ -0,0 +1,57 @@
+<template>
+  <v-hover v-slot:default="{ hover }">
+    <v-card flat :elevation="hover ? 8 : 0" @click.prevent="$router.push(route)" color="primary">
+      <v-card-text class="d-flex justify-space-between">
+        <div class="d-flex">
+          <v-avatar
+            size="60"
+            :color="hover ? 'accent' : 'deep-orange lighten-5'"
+          >
+            <v-icon :color="hover ? 'white' : 'accent'">{{ icon }}</v-icon>
+          </v-avatar>
+
+          <div v-if="count" class="mx-6 txt--text">
+            <v-card-title class="font-weight-bold my-0 pa-0">
+              {{ count }}
+            </v-card-title>
+
+            <v-card-subtitle v-if="count" class="my-0 pa-0">
+              {{ label }}
+            </v-card-subtitle>
+          </div>
+
+          <div v-else class="mx-6 txt--text d-flex align-center">
+            <v-card-title class="my-0 pa-0 text-subtitle-1">
+              {{ label }}
+            </v-card-title>
+          </div>
+        </div>
+
+        <slot></slot>
+      </v-card-text>
+    </v-card>
+  </v-hover>
+</template>
+
+<script>
+export default {
+  props: {
+    count: {
+      type: Number,
+      default: 0,
+    },
+    label: {
+      type: String,
+      default: '',
+    },
+    icon: {
+      type: String,
+      default: '',
+    },
+    route: {
+      type: String,
+      default: '',
+    },
+  },
+}
+</script>