/* ── /keysy/ — скрол-сцена на ScrollSmoother ────────────────────────────
Надбудова НАД keys.css: звідти беруться змінні, шрифти, сабсет FA,
шапка, футер і кнопка .btn-26. Тут — лише композиція сторінки-вітрини
й усе, що потрібно анімації. keys.css НЕ чіпаємо: підстрінки кейсів
лишаються як були.
Порядок підключення обов'язковий:
потім
Специфічність тут скрізь дорівнює або вища за keys.css, і перевизначення
працюють лише другим файлом.
────────────────────────────────────────────────────────────────────── */
/* ☠ ScrollSmoother і `scroll-behavior:smooth` разом не працюють: браузер
анімує скрол сам, смузер анімує трансформ — виходить смикання й
промахи по якорях. keys.css вмикає smooth глобально, тут знімаємо. */
html{scroll-behavior:auto}
/* Смузер загортає сторінку в трансформований контейнер, а всередині
такого контейнера `position:sticky` і `fixed` рахуються від нього,
а не від вікна. Тому шапка винесена в розмітці ПОЗА #smooth-wrapper
і тут стає fixed. */
.nav{position:fixed;left:0;right:0;top:0}
/* Смузер керує висотою сам — тілу лишається тільки не мати своїх полів. */
body{overflow-x:hidden}
#smooth-wrapper{overflow:hidden}
/* ── ФОН НА ВСЮ СТОРІНКУ ──────────────────────────────────────────────
Одне фото під усіма чотирма кейсами: слайди проїжджають поверх
нерухомого кадру, звідси глибина без жодного параллаксу.
☠ Шар лежить у розмітці ПОЗА `#smooth-wrapper` — усередині смузера
`position:fixed` рахується від трансформованого контейнера, і фон
поїхав би зі сторінкою.
⚠ Шар лежить на `z-index:0`, а не на -1 — чому саме так, розписано
нижче біля самого правила. Коротко: на -1 його повністю накриває фон
`body`, і фото не видно взагалі.
Числа зібрані в змінних навмисно: панель `?bgtest=1` крутить саме їх,
і те, що власник виставив, переноситься сюди один в один. */
/* ⚠ Затемнення тут ДВА і вони перемножуються: рівне `--bg-dim` і градієнт
у `::after`. Перший захід ставив 0.72 + градієнт до 0.75 — разом ~0.93,
і фото читалось як чорний прямокутник (заміряно на скріншоті: різниця
з чистим `#001621` майже нульова). Тримати суму нижче ~0.75. */
/* ⚠ Саме фото темне: середня яскравість кадру 62 з 255 (заміряно по
зменшеній копії). Тому тут є `--bg-bright` — без нього будь-яке
затемнення перетворює його на рівну темну заливку. */
:root{
--bg-dim:0.57; /* сила затемнення поверх фото */
--bg-blur:3px; /* розмиття кадру */
--bg-sat:0.45; /* насиченість: 1 = як у джерелі */
--bg-bright:0.7; /* яскравість: 1 = як у джерелі */
--bg-pos:50%; /* вертикальна точка кадру */
--bg-scale:1; /* масштаб */
--bg-move:16; /* хід фону за всю сторінку, у vh (0 = стоїть намертво) */
--bg-shift:0; /* поточний зсув — його крутить скрол, руками не чіпати */
/* ── Кадр фону: у кожної вітрини свій ───────────────────────────────
Власник 05.09.2026: «все вкладки кейси имеют одну и ту же фотку фон,
хотя я просил сделать разные фоны». Фон малювався одним правилом на
чотири сторінки, тому й був однаковий.
Тут стоїть значення за замовчуванням — воно для `/keysy/` (сайти).
Три вітрини перевизначають ці дві змінні власним `