﻿
.header { background-color: transparent !important; }
.header__menu, .header__menu * { background-color: transparent !important; }
.header-right, .header-right * { background-color: transparent !important; }
.logo, .logo * { background-color: transparent !important; }

.header {
    --blur-tint: 11, 12, 13;
    --blur-tint-alpha: 0.55;
    transition: background-color 320ms ease, backdrop-filter 320ms ease,
        color 320ms ease;
}
.header.is-scrolled {
    background-color: rgba(var(--blur-tint), var(--blur-tint-alpha)) !important;
    -webkit-backdrop-filter: blur(12px) saturate(140%);
    backdrop-filter: blur(12px) saturate(140%);
}

.logo__svg--white { transition: opacity 320ms ease; }
.logo__svg--black {
    position: absolute; top: 0; left: 0;
    opacity: 0;
    transition: opacity 320ms ease;
}
.header--light .logo__svg--white { opacity: 0; }
.header--light .logo__svg--black { opacity: 1; }
.header--light { color: #0B0C0D; --blur-tint: 245, 242, 224; --blur-tint-alpha: 0.6; }
.header--light .lang-toggle { border-color: rgba(11, 12, 13, 0.3); }

.header-right {
    position: absolute; right: 100px; top: 0;
    height: 80px; display: flex; align-items: center; gap: 16px;
}
.lang-toggle {
    font-family: "ClashDisplay-Medium", Arial, sans-serif;
    font-size: 12px; font-weight: 700; letter-spacing: .08em;
    color: currentColor; background: transparent;
    border: 1px solid rgba(245,242,224,0.4);
    border-radius: 6px; padding: 5px 10px; cursor: url('../cursor/cursor-pointer.svg?v=4') 15 16, pointer;
    transition: border-color 277ms, color 277ms; display: flex; align-items: center; gap: 3px;
}
.lang-toggle:hover { border-color: currentColor; }
.lang-sep { opacity: 0.35; }
.lang-active { opacity: 1; }
.lang-inactive { opacity: 0.4; }
.header-book-btn {
    font-family: "ClashDisplay-Medium", Arial, sans-serif;
    font-size: 13px; font-weight: 700; letter-spacing: .04em;
    color: currentColor; border: 1.5px solid currentColor;
    padding: 7px 18px; border-radius: 40vw;
    text-decoration: none;
    transition: background 277ms, color 277ms, border-color 277ms, transform 277ms;
    white-space: nowrap;
}
.header-book-btn:hover {
    background: #0B0C0D;
    color: #efebe5;
    border-color: #0B0C0D;
    transform: translateY(-1px);
}

@media (max-width: 1020px) {
    .header-right { display: none; }
}

.menu-burger.hover--bg-orange:hover {
    background: linear-gradient(135deg, #8B5CF6, #EC4899, #F97316);
}

.lang-switch {
    display: inline-flex;
    align-items: center;
    color: currentColor;
}

.header__menu .menu-item.lang-switch__nav-item {
    display: inline-flex;
    align-items: center;
    margin-right: 24px;
}
.lang-switch__btn {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    color: currentColor;
    letter-spacing: inherit;
    opacity: 0.4;
    cursor: url('../cursor/cursor-pointer.svg?v=4') 15 16, pointer;
    transition: opacity 277ms ease;
}
.lang-switch__btn:hover,
.lang-switch__btn.is-active { opacity: 1; }
.lang-switch__sep { opacity: 0.3; margin: 0 4px; }

.lang-switch--mobile { display: none; }

.lang-switch--mobile {
    color: var(--text-primary);
    transition: color 320ms ease;
}
.header--light .lang-switch--mobile { color: var(--text-on-light); }
@media (max-width: 800px) {
    .lang-switch--mobile {
        display: inline-flex;
        position: absolute;
        top: 0;
        right: 84px;
        height: 80px;
        padding: 0 14px;
        font-size: 14px;
        line-height: 1;
        letter-spacing: .04em;
        z-index: 10;
    }
}
@media (max-width: 500px) {
    .lang-switch--mobile { right: 74px; height: 74px; padding: 0 10px; font-size: 13px; }
}
@media (max-width: 360px) {
    .lang-switch--mobile { padding: 0 6px; font-size: 12px; }
}
