enable feature flags for app, add docs

webapp/src/views/DeflockApp.vue

@@ -40,6 +40,20 @@
                   <span v-if="appLinks.android">Get on Android</span>
                   <span v-else>Android Coming Soon</span>
                 </v-btn>
+                
+                <!-- Documentation Link -->
+                <v-btn
+                  size="large"
+                  variant="text"
+                  color="white"
+                  href="https://blog.deflock.me/deflock-mobile-guide/"
+                  target="_blank"
+                  prepend-icon="mdi-book-open-variant"
+                  class="download-btn doc-btn"
+                >
+                  View Mobile App Guide
+                  <v-icon icon="mdi-open-in-new" size="small" class="ml-1" />
+                </v-btn>
               </div>
             </div>
           </v-col>
@@ -217,8 +231,11 @@
 
 <script setup lang="ts">
 import Footer from '@/components/layout/Footer.vue';
+import { useFeatureFlags } from '@/composables/useFeatureFlags';
 import { ref, computed } from 'vue';
 
+const { flags } = useFeatureFlags();
+
 interface Feature {
   id: number;
   title: string;
@@ -252,10 +269,10 @@ interface PrivacyPrinciple {
   description: string;
 }
 
-const appLinks = {
+const appLinks = computed(() => ({
   android: 'https://play.google.com/store/apps/details?id=me.deflock.deflockapp',
-  ios: undefined,
-}
+  ios: flags.value?.iosApp.enabled ? flags.value.iosApp.appUrl : undefined,
+}));
 
 // App features
 const features: Feature[] = [
@@ -475,6 +492,17 @@ const visibleScreenshots = computed(() =>
   color: white !important;
 }
 
+.doc-btn {
+  color: white !important;
+  opacity: 0.9;
+  transition: all 0.3s ease;
+}
+
+.doc-btn:hover {
+  opacity: 1;
+  transform: translateY(-2px);
+}
+
 .hero-image {
   display: flex;
   justify-content: center;