radionica3d/src/pages/Privacy.vue

<template>
  <div class="min-h-screen bg-background text-foreground pt-32 pb-24">
    <div class="container mx-auto px-4 max-w-3xl">
      <h1 class="font-display text-4xl md:text-5xl font-extrabold tracking-tight mb-6">
        {{ t("privacy.title") }}
      </h1>
      <p class="text-xl text-foreground/60 font-medium mb-16">
        {{ t("privacy.subtitle") }}
      </p>

      <div class="space-y-12">
        <section v-for="section in sections" :key="section" class="space-y-4">
          <h2 class="font-display text-2xl font-bold tracking-tight text-foreground">
            {{ t(`privacy.sections.${section}.title`) }}
          </h2>
          <p class="text-foreground/70 leading-relaxed font-medium">
            {{ t(`privacy.sections.${section}.content`) }}
          </p>
        </section>
      </div>
      
      <!-- Back to Home -->
      <div class="mt-16 pt-8 border-t border-black/[0.1]">
        <router-link to="/" class="inline-flex items-center gap-2 text-sm font-bold text-foreground hover:text-primary transition-colors">
          &larr; {{ t("auth.back") }}
        </router-link>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import { useI18n } from "vue-i18n";

const { t } = useI18n();
const sections = ["collection", "sharing", "retention", "rights"];
</script>