/* Липка шапка (логіка — /js/sticky-header.js). Ховаємо через top, а не transform/backdrop-filter:
   вони роблять шапку «контейнером» для position: fixed і ламають мобільне меню всередині неї. */
html.hdr-sticky header.header {
    position: fixed;
    top: -200px;
    z-index: 30;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
/* шапка обмежена max-width: 1920px, тож фон — окремий шар на всю ширину вікна */
html.hdr-sticky header.header::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    background-color: rgba(18, 18, 18, .98);
    box-shadow: 0 6px 24px rgba(0, 0, 0, .25);
    z-index: -1;
}
html.hdr-sticky.hdr-anim header.header { transition: top .3s ease; }
html.hdr-sticky.hdr-pinned header.header { top: 0; }
@media (prefers-reduced-motion: reduce) {
    html.hdr-sticky.hdr-anim header.header { transition: none; }
}