Voodoo2Docker/deepsite-project-2wvaa
0
1<!DOCTYPE html>2<html lang="ru">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>Тарифы — Genealogy AI</title>7 <meta name="description" content="Выберите тариф для исследования семейной истории. От базового до премиум.">8 9 <script src="https://cdn.tailwindcss.com"></script>10 <link rel="preconnect" href="https://fonts.googleapis.com">11 <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;600;700&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">12 13 <script>14 tailwind.config = {15 theme: {16 extend: {17 colors: {18 'paper': '#F5F1E8',19 'paper-light': '#FAF7F0',20 'terracotta': '#C65D3B',21 'terracotta-dark': '#A84B2D',22 'ink': '#2C3E50',23 'ink-light': '#5D6D7E',24 'sepia': '#8B7355'25 },26 fontFamily: {27 'serif': ['Cormorant Garamond', 'serif'],28 'sans': ['Inter', 'sans-serif']29 }30 }31 }32 }33 </script>34 35 <style>36 .textured-paper {37 background-color: #F5F1E8;38 background-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23noise)' opacity='0.08'/%3E%3C/svg%3E");39 }40 .vintage-border { border: 2px solid #8B7355; box-shadow: 4px 4px 0px rgba(139, 115, 85, 0.2); }41 .ornament::before, .ornament::after { content: '❦'; color: #C65D3B; margin: 0 1rem; }42 .ornament { text-align: center; }43 .popular-badge {44 background: linear-gradient(135deg, #C65D3B 0%, #A84B2D 100%);45 }46 </style>47</head>48<body class="textured-paper text-ink font-sans">49 50 <!-- Navigation -->51 <nav class="sticky top-0 z-50 bg-paper/95 backdrop-blur-sm border-b border-sepia/20">52 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">53 <div class="flex justify-between items-center h-20">54 <a href="index.html" class="flex items-center space-x-2">55 <i data-lucide="scroll-text" class="w-8 h-8 text-terracotta"></i>56 <span class="font-serif text-2xl font-bold text-ink">Genealogy AI</span>57 </a>58 <div class="hidden md:flex space-x-8">59 <a href="index.html" class="text-ink hover:text-terracotta transition">Главная</a>60 <a href="how-it-works.html" class="text-ink hover:text-terracotta transition">Как это работает</a>61 <a href="pricing.html" class="text-terracotta font-medium">Тарифы</a>62 <a href="blog.html" class="text-ink hover:text-terracotta transition">Блог</a>63 <a href="about.html" class="text-ink hover:text-terracotta transition">О нас</a>64 </div>65 <a href="app/dashboard.html" class="bg-terracotta text-white px-6 py-2.5 rounded-sm hover:bg-terracotta-dark transition">Начать</a>66 </div>67 </div>68 </nav>69 70 <!-- Header -->71 <section class="py-20 text-center">72 <div class="max-w-4xl mx-auto px-4">73 <h1 class="font-serif text-5xl font-bold text-ink mb-6 ornament">Выберите свой путь к семейной истории</h1>74 <p class="text-xl text-ink-light">От базового исследования до премиального издания с твёрдым переплётом</p>75 </div>76 </section>77 78 <!-- Pricing Cards -->79 <section class="pb-20">80 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">81 <div class="grid lg:grid-cols-3 gap-8 items-start">82 83 <!-- Basic -->84 <div class="bg-white rounded-lg vintage-border p-8 hover:shadow-xl transition">85 <div class="text-center mb-8">86 <h3 class="font-serif text-2xl font-bold text-ink mb-2">Базовый</h3>87 <p class="text-ink-light text-sm mb-4">Для небольшого исследования</p>88 <div class="flex items-baseline justify-center">89 <span class="font-serif text-5xl font-bold text-ink">5 900</span>90 <span class="text-ink-light ml-2">₽</span>91 </div>92 </div>93 94 <ul class="space-y-4 mb-8">95 <li class="flex items-start">96 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>97 <span class="text-ink-light">1 ветка рода (прямые предки)</span>98 </li>99 <li class="flex items-start">100 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>101 <span class="text-ink-light">Исследование ~5 000 знаков</span>102 </li>103 <li class="flex items-start">104 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>105 <span class="text-ink-light">8-полосная газета PDF</span>106 </li>107 <li class="flex items-start">108 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>109 <span class="text-ink-light">Срок: 7 дней</span>110 </li>111 </ul>112 113 <button class="w-full border-2 border-terracotta text-terracotta py-3 rounded-sm hover:bg-terracotta hover:text-white transition font-medium">114 Выбрать базовый115 </button>116 </div>117 118 <!-- Standard -->119 <div class="bg-white rounded-lg vintage-border p-8 relative transform lg:-translate-y-4 shadow-2xl">120 <div class="absolute -top-4 left-1/2 transform -translate-x-1/2 popular-badge text-white px-4 py-1 rounded-full text-sm font-medium shadow-lg">121 Популярный выбор122 </div>123 124 <div class="text-center mb-8 pt-4">125 <h3 class="font-serif text-2xl font-bold text-ink mb-2">Стандарт</h3>126 <p class="text-ink-light text-sm mb-4">Оптимальный баланс</p>127 <div class="flex items-baseline justify-center">128 <span class="font-serif text-5xl font-bold text-terracotta">9 900</span>129 <span class="text-ink-light ml-2">₽</span>130 </div>131 </div>132 133 <ul class="space-y-4 mb-8">134 <li class="flex items-start">135 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>136 <span class="text-ink-light">2 ветки рода (мама + папа)</span>137 </li>138 <li class="flex items-start">139 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>140 <span class="text-ink-light">Исследование ~10 000 знаков</span>141 </li>142 <li class="flex items-start">143 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>144 <span class="text-ink-light">12-полосная газета PDF</span>145 </li>146 <li class="flex items-start">147 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>148 <span class="text-ink-light">Интерактивное древо</span>149 </li>150 <li class="flex items-start">151 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>152 <span class="text-ink-light">Срок: 14 дней</span>153 </li>154 </ul>155 156 <button class="w-full bg-terracotta text-white py-3 rounded-sm hover:bg-terracotta-dark transition font-medium shadow-lg">157 Выбрать стандарт158 </button>159 </div>160 161 <!-- Premium -->162 <div class="bg-white rounded-lg vintage-border p-8 hover:shadow-xl transition">163 <div class="text-center mb-8">164 <h3 class="font-serif text-2xl font-bold text-ink mb-2">Премиум</h3>165 <p class="text-ink-light text-sm mb-4">Полное погружение</p>166 <div class="flex items-baseline justify-center">167 <span class="font-serif text-5xl font-bold text-ink">19 900</span>168 <span class="text-ink-light ml-2">₽</span>169 </div>170 </div>171 172 <ul class="space-y-4 mb-8">173 <li class="flex items-start">174 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>175 <span class="text-ink-light">4 ветки рода (все прадеды)</span>176 </li>177 <li class="flex items-start">178 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>179 <span class="text-ink-light">Расширенное исследование</span>180 </li>181 <li class="flex items-start">182 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>183 <span class="text-ink-light">16-полосная газета</span>184 </li>185 <li class="flex items-start">186 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>187 <span class="text-ink-light">Твёрдый переплёт</span>188 </li>189 <li class="flex items-start">190 <i data-lucide="check" class="w-5 h-5 text-terracotta mr-3 mt-0.5"></i>191 <span class="text-ink-light">Приоритетное обслуживание</span>192 </li>193 </ul>194 195 <button class="w-full border-2 border-terracotta text-terracotta py-3 rounded-sm hover:bg-terracotta hover:text-white transition font-medium">196 Выбрать премиум197 </button>198 </div>199 </div>200 </div>201 </section>202 203 <!-- Comparison Table -->204 <section class="py-20 bg-paper-light border-y border-sepia/10">205 <div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">206 <h2 class="font-serif text-3xl font-bold text-ink mb-12 text-center ornament">Сравнение тарифов</h2>207 208 <div class="overflow-x-auto">209 <table class="w-full bg-white rounded-lg shadow-lg">210 <thead>211 <tr class="border-b-2 border-terracotta">212 <th class="py-4 px-6 text-left font-serif text-lg">Возможности</th>213 <th class="py-4 px-6 text-center font-serif text-lg">Базовый</th>214 <th class="py-4 px-6 text-center font-serif text-lg text-terracotta">Стандарт</th>215 <th class="py-4 px-6 text-center font-serif text-lg">Премиум</th>216 </tr>217 </thead>218 <tbody class="divide-y divide-sepia/10">219 <tr>220 <td class="py-4 px-6">Количество веток</td>221 <td class="py-4 px-6 text-center">1</td>222 <td class="py-4 px-6 text-center font-medium text-terracotta">2</td>223 <td class="py-4 px-6 text-center">4</td>224 </tr>225 <tr>226 <td class="py-4 px-6">Объём текста</td>227 <td class="py-4 px-6 text-center">5 000 зн.</td>228 <td class="py-4 px-6 text-center font-medium text-terracotta">10 000 зн.</td>229 <td class="py-4 px-6 text-center">20 000+ зн.</td>230 </tr>231 <tr>232 <td class="py-4 px-6">Газета (полос)</td>233 <td class="py-4 px-6 text-center">8</td>234 <td class="py-4 px-6 text-center font-medium text-terracotta">12</td>235 <td class="py-4 px-6 text-center">16</td>236 </tr>237 <tr>238 <td class="py-4 px-6">Генеалогическое древо</td>239 <td class="py-4 px-6 text-center"><i data-lucide="x" class="w-5 h-5 text-gray-300 mx-auto"></i></td>240 <td class="py-4 px-6 text-center"><i data-lucide="check" class="w-5 h-5 text-terracotta mx-auto"></i></td>241 <td class="py-4 px-6 text-center"><i data-lucide="check" class="w-5 h-5 text-terracotta mx-auto"></i></td>242 </tr>243 <tr>244 <td class="py-4 px-6">Твёрдый переплёт</td>245 <td class="py-4 px-6 text-center"><i data-lucide="x" class="w-5 h-5 text-gray-300 mx-auto"></i></td>246 <td class="py-4 px-6 text-center"><i data-lucide="x" class="w-5 h-5 text-gray-300 mx-auto"></i></td>247 <td class="py-4 px-6 text-center"><i data-lucide="check" class="w-5 h-5 text-terracotta mx-auto"></i></td>248 </tr>249 </tbody>250 </table>251 </div>252 </div>253 </section>254 255 <!-- FAQ -->256 <section class="py-20">257 <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8">258 <h2 class="font-serif text-3xl font-bold text-ink mb-12 text-center ornament">Вопросы о тарифах</h2>259 260 <div class="space-y-4">261 <div class="bg-white p-6 rounded-lg vintage-border">262 <h3 class="font-serif text-lg font-bold text-ink mb-2">Можно ли изменить тариф после оплаты?</h3>263 <p class="text-ink-light">Да, вы можете доплатить разницу и перейти на более высокий тариф в любой момент до завершения проекта.</p>264 </div>265 266 <div class="bg-white p-6 rounded-lg vintage-border">267 <h3 class="font-serif text-lg font-bold text-ink mb-2">Что если я не знаю много о своей семье?</h3>268 <p class="text-ink-light">Наши исследователи работают с минимальными данными. Достаточно знать ФИО и примерные даты бабушек и дедушек.</p>269 </div>270 271 <div class="bg-white p-6 rounded-lg vintage-border">272 <h3 class="font-serif text-lg font-bold text-ink mb-2">Какие способы оплаты принимаете?</h3>273 <p class="text-ink-light">Мы принимаем банковские карты, ЮKassa, Robokassa и безналичный перевод для юридических лиц.</p>274 </div>275 </div>276 </div>277 </section>278 279 <!-- Footer -->280 <footer class="bg-ink text-paper/80 py-12 border-t-4 border-terracotta">281 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">282 <div class="grid md:grid-cols-4 gap-8 mb-8">283 <div class="col-span-2">284 <div class="flex items-center space-x-2 mb-4">285 <i data-lucide="scroll-text" class="w-8 h-8 text-terracotta"></i>286 <span class="font-serif text-2xl font-bold text-paper">Genealogy AI</span>287 </div>288 <p class="text-sm text-paper/60 mb-4">Превращаем семейные истории в наследие. AI-исследования, генеалогические древа и семейные газеты.</p>289 <div class="flex space-x-4 items-center">290 <a href="https://vk.com" target="_blank" class="hover:text-terracotta transition text-paper/80 font-medium text-sm">VK</a>291 <a href="https://telegram.org" target="_blank" class="hover:text-terracotta transition"><i data-lucide="send" class="w-5 h-5"></i></a>292 <a href="https://max.com" target="_blank" class="hover:text-terracotta transition text-paper/80 font-medium text-sm">MAX</a>293 </div>294 </div>295 296 <div>297 <h4 class="font-serif text-lg font-bold text-paper mb-4">Правовая информация</h4>298 <ul class="space-y-2 text-sm">299 <li><a href="privacy.html" class="hover:text-terracotta transition">Положение о конфиденциальности</a></li>300 <li><a href="terms.html" class="hover:text-terracotta transition">Пользовательское соглашение</a></li>301 <li><a href="personal-data.html" class="hover:text-terracotta transition">Работа с персональными данными</a></li>302 </ul>303 </div>304 305 <div>306 <h4 class="font-serif text-lg font-bold text-paper mb-4">Контакты</h4>307 <ul class="space-y-2 text-sm">308 <li class="flex items-center"><i data-lucide="mail" class="w-4 h-4 mr-2 text-terracotta"></i> gen@gen.ru</li>309 <li class="flex items-center"><i data-lucide="map-pin" class="w-4 h-4 mr-2 text-terracotta"></i> Москва, Россия</li>310 </ul>311 </div>312 </div>313 314 <div class="border-t border-paper/20 pt-8 flex flex-col md:flex-row justify-between items-center text-sm text-paper/60">315 <p>© 2024 Genealogy AI. Все права защищены.</p>316 </div>317 </div>318 </footer>319 320 <script src="https://unpkg.com/lucide@latest"></script>321 <script>lucide.createIcons();</script>322</body>323</html>