Розробка дизайну та верстка сайту для дорослих

Необхідно розробити дизайн та виконати адаптивну front-end верстку для сайту дорослої тематики. Сайт є каталогом записів стрімів. Ключові вимоги - висока швидкість завантаження, чистий код, сучасний мінімалістичний вигляд та можливість легкої зміни колірної схеми. Тобто треба 

1.  **UI/UX Дизайн:** Створення макетів для всіх сторінок сайту в **Figma**. Цей етап має бути завершений та **повністю затверджений** перед початком верстки.

2.  **Front-end верстка:** Перетворення затверджених макетів у робочий HTML/CSS/JS сайт.

**Домен:** `lexotex.com`

**Вимоги до дизайну (UI/UX)**

* **Загальний стиль:** Сучасний, мінімалістичний дизайн у **темних тонах**. Стиль має бути простим, інтуїтивно зрозумілим та функціональним, без зайвих візуальних елементів. Основний акцент – на контенті (прев'ю відео).

* **Кольорова гама:** Виконавець має запропонувати основну темну палітру. **Критично важливо:** вся кольорова схема має бути реалізована через **CSS-змінні (custom properties)**. У файлі стилів має бути окремий блок (наприклад, `:root`), де зібрані 5-7 основних змінних кольорів (основний фон, колір тексту, акцентний колір для посилань і кнопок тощо). Зміна значень цих змінних має повністю та коректно змінювати вигляд усього сайту.

* **Шрифти:** Використовувати стандартні системні шрифти (напр. Arial, Helvetica, San Francisco, Roboto) для максимальної швидкості завантаження та сумісності. **Без використання сторонніх веб-шрифтів.**

* **Логотип:** Логотип як такий не потрібен. Замість нього використовувати текстову назву сайту `lexotex.com`, стилізовану обраним шрифтом.

* **Референс:** **Pornhub** (в якості прикладу для структури, функціональності та загального компонування елементів, а не для прямого копіювання дизайну).

**Структура сайту та сторінки**

1.  **Головна сторінка:**

    * Шапка сайту (текстовий логотип, меню категорій, рядок пошуку).

    * Блок "Популярні відео".

    * Блок "Нові відео".

    * Основна сітка з прев'ю відео (зображення + назва).

    * Пагінація (класична, з номерами сторінок: 1, 2, 3...).

    * Футер (посилання на текстові сторінки).

2.  **Сторінка перегляду відео:**

    * Вбудований фрейм з відео (iframe).

    * Назва відео.

    * Список тегів/категорій, до яких належить відео.

    * Блок "Схожі відео" (дизайн та верстка).

3.  **Сторінка категорії:**

    * Аналогічна головній сторінці, але відображає відео лише з обраної категорії, має назву категорії та власну пагінацію.

4.  **Текстові сторінки (2 шт.):**

    * Правила користування (Terms of Service).

    * DMCA.

    * Сторінки мають бути зверстані, контент використати у вигляді тексту-заглушки ("lorem ipsum").

5.  **Сторінка "Зворотний зв'язок":**

    * Форма з полями (Ім'я, Email, Тема, Текст повідомлення) та кнопкою "Надіслати".

    * Дані з форми мають відправлятися на вказану пошту.

    * Форма має бути захищена від спаму за допомогою **Google reCAPTCHA v2**.

**Технічні вимоги до верстки**

* **Валідність:** 100% валідний HTML-код, перевірений на `validator.w3.org` без помилок.

* **Швидкість:** Показник **Google PageSpeed Insights 95+** для мобільної та десктопної версій. Обов'язкова оптимізація зображень. Мініфікація не потрібна CSS/JS, бо CMS це зробить.

* **Адаптивність:** Єдиний HTML для всіх пристроїв (Mobile-first підхід). Верстка має коректно відображатися на всіх популярних розширеннях екранів.

* **Кросбраузерність:** Коректне відображення в останніх версіях браузерів Chrome, Firefox, Safari, Edge. Підтримка Internet Explorer не потрібна.

* **Семантична верстка:** Використання відповідних тегів (header, footer, nav, article, section) для покращення SEO.

* **Favicon:** Підключення іконок favicon для різних пристроїв.

* **Легка зміна теми:** Цей пункт дублює вимогу з розділу дизайну для наголосу: **увесь CSS має базуватися на змінних** для швидкого ребрендингу сайту.

**Технологічний стек**

* **HTML5**

* **CSS3** (бажано без використання препроцесора **SCSS**, бо не вмію в таке).

* Нативний **JavaScript (ES6+)**.

* **Без використання jQuery, Bootstrap, Tailwind** чи інших великих JS/CSS фреймворків.

**Результат роботи**

1.  Посилання на фінальний, затверджений проект у Figma (або якийсь аналог).

2.  Архів з усіма файлами верстки (HTML, CSS, JS, оптимізовані зображення, шрифти) та короткою інструкцією щодо структури файлів.

Чекаю на ваші пропозиції з оцінкою вартості та термінів виконання проекту. Будь ласка, вкажіть у заявці посилання на ваше портфоліо з аналогічними роботами.