feat: complete UI/UX improvements, vuesax icons, media server, and section management

apps/web/app/components/sections/Standards.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { FileSearch, ShieldCheck } from "lucide-vue-next";
+import VuesaxIcon from "~/components/ui/VuesaxIcon.vue";
 import Reveal from "~/components/ui/Reveal.vue";
 import SectionHead from "~/components/ui/SectionHead.vue";
 
@@ -26,7 +26,7 @@ const standards = computed(() => useSiteStore().sections.standards);
           <SectionHead heading-id="standards-title" v-bind="standards.head" />
           <Reveal v-if="standards.note" :delay="0.25">
             <div class="mt-8 flex items-start gap-4 rounded-xl border border-accent/25 bg-accent/5 p-5">
-              <FileSearch class="size-6 shrink-0 text-accent" />
+              <VuesaxIcon name="document-filter" class="size-6 shrink-0 text-accent" />
               <p class="text-sm leading-8 text-ink/80">
                 {{ standards.note }}
               </p>
@@ -37,7 +37,7 @@ const standards = computed(() => useSiteStore().sections.standards);
               href="#contact"
               class="group mt-8 inline-flex items-center gap-2.5 rounded-full border border-line px-6 py-3.5 text-sm font-bold transition-colors hover:border-accent hover:text-accent"
             >
-              <ShieldCheck class="size-4 text-accent" />
+              <VuesaxIcon name="shield-tick" class="size-4 text-accent" />
               {{ standards.ctaLabel }}
             </a>
           </Reveal>