feat: интеграция Fancybox и добавление формы обратной связи

- Подключён Fancybox для улучшения пользовательского интерфейса
- Добавлена интерактивная форма обратной связи в секции FAQ
- Обновлены стили и скрипты для поддержки новых функций
- Исправлена ссылка на страницу входа в header

templates/_fragments/header.html

@@ -36,7 +36,7 @@
                         <path d="M0 2.5A.5.5 0 0 1 .5 2H2a.5.5 0 0 1 .485.379L2.89 4H14.5a.5.5 0 0 1 .485.621l-1.5 6A.5.5 0 0 1 13 11H4a.5.5 0 0 1-.485-.379L1.61 3H.5a.5.5 0 0 1-.5-.5M3.14 5l1.25 5h8.22l1.25-5zM5 13a1 1 0 1 0 0 2 1 1 0 0 0 0-2m-2 1a2 2 0 1 1 4 0 2 2 0 0 1-4 0m9-1a1 1 0 1 0 0 2 1 1 0 0 0 0-2m-2 1a2 2 0 1 1 4 0 2 2 0 0 1-4 0"></path>
                     </svg>
                 </a>
-                <a href="#">
+                <a href="/users/login/">
                     <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
                          class="bi bi-person" viewBox="0 0 16 16">
                         <path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6m2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0m4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4m-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10s-3.516.68-4.168 1.332c-.678.678-.83 1.418-.832 1.664z"></path>

templates/_layouts/base.html

@@ -12,7 +12,9 @@
     <link rel="stylesheet" href="{% static 'css/normalize.css' %}">
     <link rel="stylesheet" href="{% static 'css/style.css' %}">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.css"/>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@6.1/dist/fancybox/fancybox.css"/>
     <script src="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@6.1/dist/fancybox/fancybox.umd.js"></script>
     {% block add_css %}
         <!-- Additional CSS -->
     {% endblock %}

templates/home/_fragments/faq.html

@@ -42,10 +42,41 @@
 
     </div>
 
+    <div id="back-form" style="display: none;" class="back-form">
+        <h2>НЕ НАШЛИ ОТВЕТ НА ВАШ ВОПРОС?</h2>
+        <form action="">
+            <label class="q-label" for="name" style="margin-top: 69px;">
+                <input type="text" placeholder="Имя" id="name">
+            </label>
+
+            <label class="q-label" for="number">
+                <input type="text" placeholder="Номер телефона" id="number">
+            </label>
+
+            <label class="q-label" for="question">
+                <input type="text" placeholder="Ваш вопрос" id="question">
+            </label>
+
+            <div class="back-form-accept-checkbox">
+                <input type="checkbox" id="accept" name="accept">
+                <label for="accept">Я согласен с политикой обработки персональных данных</label>
+            </div>
+
+            <button class="back-form-submit" type="submit">ОТПРАВИТЬ ВОПРОС</button>
+        </form>
+    </div>
+
     <div class="faq-cta">
-        <a href="#">
+        <a href="#back-form" data-fancybox>
             <div>?</div>
             ЗАДАТЬ ВОПРОС
         </a>
     </div>
-</section>
+
+</section>
+
+<script>
+    document.addEventListener('DOMContentLoaded', function () {
+        Fancybox.bind('[data-fancybox]')
+    })
+</script>