:root {
    --wt-bg: #09090d;
    --wt-surface: #12121a;
    --wt-text: #f7f7fb;
    --wt-muted: #a4a4b5;
    --wt-accent: #e50914;
}

* { box-sizing: border-box; }

.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgb(9 9 13 / 92%);
    border-bottom: 1px solid rgb(255 255 255 / 8%);
    backdrop-filter: blur(16px);
}

.site-header__inner {
    width: min(1200px, calc(100% - 40px));
    min-height: 72px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 42px;
}

.site-header__brand {
    position: relative;
    flex: 0 0 160px;
    width: 160px;
    height: 64px;
    overflow: hidden;
    color: var(--wt-text);
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font: 800 1.25rem/1 system-ui, sans-serif;
    letter-spacing: -.045em;
    text-decoration: none;
    white-space: nowrap;
}
.site-header__brand img {
    position: absolute;
    top: -42px;
    left: 0;
    display: block;
    width: 160px !important;
    height: 160px !important;
    max-width: none !important;
    object-fit: fill;
}
.site-header__brand > span:last-child span { color: var(--wt-accent); }
.site-header__brand-mark {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    color: white;
    background: var(--wt-accent);
    border-radius: 8px 8px 8px 2px;
    font-size: .9rem;
}

.site-header__nav { display: flex; align-items: center; gap: 28px; }
.site-header__link {
    position: relative;
    padding: 27px 0 25px;
    color: var(--wt-muted);
    font: 600 .9rem/1 system-ui, sans-serif;
    text-decoration: none;
    transition: color .2s ease;
}
.site-header__link::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 3px;
    background: var(--wt-accent);
    border-radius: 3px 3px 0 0;
    content: '';
    opacity: 0;
    transform: scaleX(.4);
    transition: opacity .2s ease, transform .2s ease;
}
.site-header__link:hover, .site-header__link:focus-visible, .site-header__link.is-active { color: var(--wt-text); }
.site-header__link.is-active::after { opacity: 1; transform: scaleX(1); }

.site-header__actions { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.site-header__search, .site-header__account {
    min-height: 38px;
    border-radius: 8px;
    font: 600 .85rem/1 system-ui, sans-serif;
}
.site-header__search {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    color: var(--wt-text);
    background: transparent;
    border: 1px solid transparent;
    cursor: pointer;
}
.site-header__search:hover, .site-header__search:focus-visible { background: rgb(255 255 255 / 8%); }
.site-header__search svg { width: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 1.8; }
.site-header__account { display: grid; place-items: center; padding: 0 15px; color: white; background: var(--wt-accent); text-decoration: none; }
.site-header__account:hover, .site-header__account:focus-visible { background: #ff1a25; }

.site-header__menu-toggle { display: none; width: 40px; height: 38px; padding: 9px; color: white; background: transparent; border: 0; cursor: pointer; }
.site-header__menu-toggle span { display: block; height: 2px; margin: 4px 0; background: currentColor; border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }

@media (max-width: 760px) {
    .site-header__inner { min-height: 64px; width: min(100% - 28px, 1200px); gap: 0; }
    .site-header__nav { position: absolute; top: 64px; right: 0; left: 0; display: grid; gap: 0; padding: 10px 14px 18px; background: var(--wt-bg); border-bottom: 1px solid rgb(255 255 255 / 8%); opacity: 0; pointer-events: none; transform: translateY(-8px); transition: opacity .2s ease, transform .2s ease; }
    .site-header.is-menu-open .site-header__nav { opacity: 1; pointer-events: auto; transform: translateY(0); }
    .site-header__link { padding: 14px 8px; }
    .site-header__link::after { display: none; }
    .site-header__search span, .site-header__account { display: none; }
    .site-header__search { padding: 0 8px; }
    .site-header__menu-toggle { display: block; }
    .site-header__brand { flex-basis: 142px; width: 142px; height: 58px; }
    .site-header__brand img { top: -37px; width: 142px !important; height: 142px !important; }
    .site-header.is-menu-open .site-header__menu-toggle span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
    .site-header.is-menu-open .site-header__menu-toggle span:nth-child(2) { opacity: 0; }
    .site-header.is-menu-open .site-header__menu-toggle span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
}

@media (prefers-reduced-motion: reduce) { .site-header *, .site-header *::after { transition: none; } }
