feat: responsive mobile header, OpenGraph tags and og:image for landing page

.gitignore

@@ -24,6 +24,8 @@ media/
 *.png
 *.gif
 *.webp
+# Исключение: картинка для OpenGraph (og:image) должна быть в репозитории
+!cabinet_service/static/og-image.png
 
 # Логи
 *.log

cabinet_service/templates/landing.html

@@ -5,6 +5,23 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>ИИ Пресс-секретарь — умный контент для вашего бизнеса</title>
     <meta name="description" content="ИИ Пресс-секретарь — сервис, который создаёт контент-план, генерирует посты и картинки для вашего бизнеса и публикует их в Telegram.">
+
+    <!-- OpenGraph -->
+    <meta property="og:type" content="website">
+    <meta property="og:site_name" content="ИИ Пресс-секретарь">
+    <meta property="og:title" content="ИИ Пресс-секретарь — умный контент для вашего бизнеса">
+    <meta property="og:description" content="Создавайте контент-план, генерируйте посты и картинки для своего бизнеса и публикуйте их в Telegram — всё в одном сервисе.">
+    <meta property="og:url" content="https://press.my-dpr.ru/">
+    <meta property="og:image" content="https://press.my-dpr.ru/static/og-image.png">
+    <meta property="og:image:width" content="1536">
+    <meta property="og:image:height" content="1024">
+    <meta property="og:image:alt" content="ИИ Пресс-секретарь — сервис для генерации контента и публикации в Telegram">
+    <meta property="og:locale" content="ru_RU">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="ИИ Пресс-секретарь — умный контент для вашего бизнеса">
+    <meta name="twitter:description" content="Создавайте контент-план, генерируйте посты и картинки для своего бизнеса и публикуйте их в Telegram.">
+    <meta name="twitter:image" content="https://press.my-dpr.ru/static/og-image.png">
+
     <script>
         // Тёмная тема по умолчанию; светлая — по выбору пользователя (сохраняется в localStorage)
         (function () {
@@ -206,6 +223,29 @@
             .hero { padding: 48px 0 40px; }
             .hero h1 { font-size: 32px; }
             .hero p { font-size: 17px; }
+
+            /* Адаптивный хедер для мобильных */
+            .header { padding: 12px 0; }
+            .header-inner { gap: 8px; }
+            .brand { gap: 8px; font-size: 16px; }
+            .brand-icon { width: 28px; height: 28px; font-size: 16px; }
+            .header-actions { gap: 6px; }
+            .header-actions .btn { padding: 8px 12px; font-size: 14px; }
+            /* Скрываем текст кнопки "Войти", оставляем компактную */
+            .header-actions .btn-ghost:not(.theme-toggle) {
+                padding: 8px 10px;
+            }
+            .theme-toggle { padding: 8px 10px; }
+        }
+
+        @media (max-width: 400px) {
+            /* На очень узких экранах скрываем текст кнопки "Войти" */
+            .header-actions .btn-ghost:not(.theme-toggle) span { display: none; }
+            .header-actions .btn-ghost:not(.theme-toggle) {
+                width: 36px;
+                padding: 8px 0;
+                text-align: center;
+            }
         }
     </style>
 </head>
@@ -218,7 +258,7 @@
             </a>
             <div class="header-actions">
                 <button type="button" class="btn btn-ghost theme-toggle" data-theme-toggle aria-label="Переключить тему">🌙</button>
-                <a class="btn btn-ghost" href="/login">Войти</a>
+                <a class="btn btn-ghost" href="/login"><span>Войти</span></a>
                 <a class="btn btn-primary" href="/register">Регистрация</a>
             </div>
         </div>

deploy/generate_og_image.py

@@ -0,0 +1,37 @@
+"""Генерация картинки для OpenGraph (og:image) через PiAPI."""
+import sys
+from pathlib import Path
+
+from ai_core.image_generator import ImageGenerator
+
+# Промпт для og:image — отражает суть сервиса "ИИ Пресс-секретарь"
+PROMPT = (
+    "Modern professional social media marketing banner for an AI press secretary service. "
+    "A sleek robot assistant character with a friendly smile, surrounded by floating elements: "
+    "a calendar, a chat bubble, a megaphone, a pencil, and a smartphone showing a Telegram app. "
+    "Dark navy blue background (#0f172a) with soft blue gradient accents (#60a5fa). "
+    "Clean, minimal, high-tech corporate style, flat vector illustration, bold shapes, "
+    "wide horizontal composition, no text, no letters, no words."
+)
+
+SIZE = "wide"  # 1536x1024 для gpt-image-1
+
+
+def main():
+    out_path = Path(__file__).resolve().parent.parent / "cabinet_service" / "static" / "og-image.png"
+    out_path.parent.mkdir(parents=True, exist_ok=True)
+
+    print(f"Генерация картинки ({SIZE})...")
+    gen = ImageGenerator()
+    try:
+        data = gen.generate(PROMPT, size=SIZE)
+    except Exception as e:
+        print(f"❌ Ошибка генерации: {e}")
+        sys.exit(1)
+
+    out_path.write_bytes(data)
+    print(f"✅ Картинка сохранена: {out_path} ({len(data)} байт)")
+
+
+if __name__ == "__main__":
+    main()