Landing Page

Технологічний стек:
HTML5: Семантична структура сторінки.
CSS3 (Vanilla CSS): Стилізація, адаптивна верстка (Media Queries), кастомні властивості (CSS Variables) для керування кольоровою схемою та шрифтами.
JavaScript (ES6+): Логіка взаємодії (меню, зміна заголовка при скролі, активні посилання).
ScrollReveal: Бібліотека для створення плавних анімацій появи елементів при скролі.
Google Fonts (Poppins): Сучасна типографіка.

Основні розділи та функціонал
Header & Navigation:

Адаптивне меню (Mobile First).
Ефект scroll-header: зміна фону шапки при прокручуванні сторінки.
Активні посилання: навігаційна панель підсвічує відповідний розділ залежно від позиції скролу.
Home Section (Hero):

Головне зображення навушників з ефектом появи.
Опис продукту та кнопка "Add to Bag" з ціною.
Використання градієнтного тексту для заголовків.
Sponsor Section:

Логотипи партнерів або брендів, розміщені в адаптивній сітці.
Specs Section (Характеристики):

Детальна інформація про технічні параметри (Bluetooth 5.2, Battery 40h, Fast charge, Siri support).
Візуалізація характеристик за допомогою SVG-іконок.
Case & Discount Sections:

Блок про захисний кейс.
Акційний блок з інтерактивною анімацією та кнопкою "Shop Now".
Products Section:

Картки товарів у різних кольорах (Black, Red, Silver, Green, Blue).
Кожна картка містить зображення, назву, ціну та кнопку покупки.
Footer:

Посилання за категоріями (Products, Support).
Форма підписки на новини.
Іконки соціальних мереж та копірайт.
#Landing #HTML-верстальщик