first commit

frontend/src/components/preise/HeroSection.astro

@@ -0,0 +1,56 @@
+---
+import HeroContent from './HeroContent.astro';
+import { authService } from '@/lib/authService';
+
+// Инициализация PocketBase
+const pb = authService.createClientFromRequest(Astro.request);
+
+// 1. Получаем запись из коллекции напрямую.
+// Если записи нет, Astro выбросит ошибку (это гарантирует отсутствие статических заглушек)
+const record = await pb.collection('preise_hero').getFirstListItem('');
+
+// 2. Генерируем прямую ссылку на картинку
+const imageUrl = pb.files.getURL(record, record.image);
+
+// 3. Формируем объект данных
+const heroData = {
+    title: record.title,
+    subtitle: record.subtitle,
+    imageUrl: imageUrl,
+    altText: record.alt_text
+};
+---
+
+<!--
+    Анимация появления блока.
+    Убран client:visible, так как данные уже получены на сервере.
+-->
+<div class="opacity-0 animate-fadeInUp delay-200">
+    <HeroContent
+            title={heroData.title}
+            subtitle={heroData.subtitle}
+            imageUrl={heroData.imageUrl}
+            altText={heroData.altText}
+    />
+</div>
+
+<style>
+    @keyframes fadeInUp {
+        from {
+            opacity: 0;
+            transform: translateY(20px);
+        }
+        to {
+            opacity: 1;
+            transform: translateY(0);
+        }
+    }
+
+    .animate-fadeInUp {
+        animation: fadeInUp 0.8s ease-out forwards;
+    }
+
+    .delay-200 {
+        animation-delay: 0.2s;
+    }
+</style>