start making FAQ page

src/app/ui/faq/frequently-asked-questions.tsx

@@ -0,0 +1,33 @@
+export default function FrequentlyAskedQuestions() {
+	return (
+		<div>
+			<div className="faq-section">
+				<h2>
+					<span></span>
+					Защита контента
+					<span>(2 вопросов)</span>
+				</h2>
+
+				<div className="faq-item">
+					<div className="faq-question">
+						<span>Как скрытый водяной знак защищает контент?</span>
+						<div className="faq-toggle">+</div>
+					</div>
+					<div className="faq-answer">
+						Скрытый водяной знак встраивается незаметно в ваш контент и позволяет отслеживать его использование в интернете. Технология работает на основе скрытого водяного знака No Copy и не влияет на качество изображений, видео или аудио.
+					</div>
+				</div>
+
+				<div className="faq-item">
+					<div className="faq-question">
+						<span>Насколько надежна защита?</span>
+						<div className="faq-toggle">+</div>
+					</div>
+					<div className="faq-answer">
+						Наша многослойная защита обеспечивает 99.8% точность определения авторства даже после обработки файлов.
+					</div>
+				</div>
+			</div>
+		</div>
+	)
+}

src/app/ui/faq/popular-asked-questions.tsx

@@ -0,0 +1,23 @@
+export default function PopularAskedQuestions() {
+	return (
+		<div className="popular-questions">
+			<h2>
+				Популярные вопросы
+			</h2>
+			<div className="popular-grid">
+				<div>
+					<h4>Как работает защита?</h4>
+					<p>Мы встраиваем невидимые водяные знаки в ваш контент</p>
+				</div>
+				<div>
+					<h4>Сколько файлов можно загрузить?</h4>
+					<p>Зависит от вашего тарифного плана</p>
+				</div>
+				<div>
+					<h4>Безопасность данных</h4>
+					<p>Все файлы хранятся на защищенных серверах</p>
+				</div>
+			</div>
+		</div>
+	)
+}

src/app/ui/header/userMenuButton.tsx

@@ -74,7 +74,7 @@ export default function UserMenuButton() {
 						</svg>
 						{t('settings')}
 					</Link>
-					<Link href="#" className="user-menu-item">
+					<Link href="/pages/faq" className="user-menu-item">
 						<svg viewBox="0 0 24 24" fill="currentColor">
 							<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"></path>
 						</svg>