init

src/components/AppHeader.vue

@@ -0,0 +1,31 @@
+<template>
+  <header class="flex items-center justify-between px-6 py-4 md:px-12 border-b border-gray-800 sticky top-0 bg-gray-900/80 backdrop-blur-xs z-50">
+    <div class="flex items-center gap-3">
+      <img src="//sub.uvpn.shop/static/turbo.png" alt="uVPN logo" class="size-8" />
+      <span class="text-xl font-bold tracking-tight">uVPN</span>
+    </div>
+
+    <!-- Якорные ссылки -->
+    <nav class="hidden md:flex items-center gap-6 text-sm text-gray-300">
+      <a href="#hero" @click.prevent="scrollTo('hero')" class="hover:text-white transition">Главная</a>
+      <a href="#features" @click.prevent="scrollTo('features')" class="hover:text-white transition">Преимущества</a>
+      <a href="#pricing" @click.prevent="scrollTo('pricing')" class="hover:text-white transition">Тарифы</a>
+      <a href="#steps" @click.prevent="scrollTo('steps')" class="hover:text-white transition">Как начать</a>
+      <a href="#testimonials" @click.prevent="scrollTo('testimonials')" class="hover:text-white transition">Отзывы</a>
+      <a href="#footer" @click.prevent="scrollTo('footer')" class="hover:text-white transition">Контакты</a>
+    </nav>
+
+    <button class="bg-blue-600 hover:bg-blue-700 transition px-5 py-2 rounded-lg font-medium text-sm">
+      Попробовать бесплатно
+    </button>
+  </header>
+</template>
+
+<script setup>
+const scrollTo = (id) => {
+  const el = document.getElementById(id)
+  if (el) {
+    el.scrollIntoView({ behavior: 'smooth' })
+  }
+}
+</script>