:root { --ink:#1c1c21; --panel:#26262c; --muted:#686882; --paper:#fff; }

.site-header {
    position:fixed;
    z-index:100;
    top:0;
    left:0;
    right:0;
    height:90px;
    padding:30px 40px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#fff;
    transition:background-color .35s ease,box-shadow .35s ease,backdrop-filter .35s ease;
}
.site-header.is-scrolled,.site-header.header--solid {
    background:rgba(0,0,0,.7);
    box-shadow:0 8px 24px rgba(0,0,0,.12);
    backdrop-filter:blur(10px);
}
@media (min-width:1101px) and (hover:hover) {
    .site-header.is-scrolled:not(.header--solid) {
        background:transparent !important;
        box-shadow:none !important;
        backdrop-filter:none !important;
    }
    .site-header.is-scrolled:not(.header--solid):hover {
        background:rgba(0,0,0,.7) !important;
        box-shadow:0 8px 24px rgba(0,0,0,.12) !important;
        backdrop-filter:blur(10px) !important;
    }
}
.site-logo { color:inherit; font-size:25px; font-weight:700; text-decoration:none; }
.site-nav { display:flex; align-items:center; gap:73px; font-size:20px; font-weight:700; }
.site-nav a { color:inherit; text-decoration:none; }
.site-nav > a,.nav-item { min-height:40px; display:flex; align-items:center; }
.site-nav > a,.nav-link { position:relative; }
.site-nav > a::after,.nav-link::after {
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-7px;
    height:2px;
    background:#fff;
    transform:scaleX(0);
    transition:transform .25s ease;
}
.site-nav > a:hover::after,.site-nav > a:focus-visible::after,.site-nav > a[aria-current="page"]::after,
.nav-link:hover::after,.nav-link:focus-visible::after,.nav-link[aria-current="page"]::after,.nav-link.is-active::after { transform:scaleX(1); }
.nav-item--dropdown { position:relative; gap:4px; }
.submenu-toggle { width:28px; height:28px; padding:2px; display:flex; align-items:center; justify-content:center; color:#fff; border:0; background:transparent; cursor:pointer; }
.submenu-toggle img { width:24px; height:24px; transition:transform .25s ease; }
.submenu {
    visibility:hidden;
    opacity:0;
    position:absolute;
    top:calc(100% + 18px);
    left:50%;
    width:210px;
    padding:12px;
    transform:translate(-50%,10px);
    border:1px solid rgba(255,255,255,.14);
    border-radius:14px;
    background:rgba(28,28,33,.96);
    box-shadow:0 18px 50px rgba(0,0,0,.28);
    transition:opacity .2s ease,transform .2s ease,visibility .2s;
}
.submenu a { display:block; padding:13px 15px; border-radius:9px; font-size:17px; line-height:1.4; white-space:nowrap; }
.submenu a:hover,.submenu a:focus-visible { background:rgba(255,255,255,.1); outline:none; }
.nav-item--dropdown:hover .submenu,.nav-item--dropdown:focus-within .submenu,.nav-item--dropdown.is-open .submenu { visibility:visible; opacity:1; transform:translate(-50%,0); }
.nav-item--dropdown:hover .submenu-toggle img,.nav-item--dropdown:focus-within .submenu-toggle img,.nav-item--dropdown.is-open .submenu-toggle img { transform:rotate(180deg); }
.site-menu-button { display:none; width:42px; height:42px; padding:9px; color:#fff; border:1px solid rgba(255,255,255,.45); border-radius:50%; background:transparent; }
.site-menu-button span { display:block; width:100%; height:2px; margin:5px 0; background:currentColor; }

@media (max-width:1100px) {
    .site-nav { gap:28px; font-size:17px; }
}
@media (max-width:760px) {
    .site-header { height:72px; padding:15px 20px; }
    .site-logo { font-size:22px; }
    .site-menu-button { display:block; position:relative; z-index:3; }
    .site-nav {
        display:none;
        position:absolute;
        z-index:2;
        left:16px;
        right:16px;
        top:64px;
        padding:18px;
        flex-direction:column;
        align-items:stretch;
        gap:0;
        color:var(--ink);
        background:#fff;
        border-radius:16px;
        box-shadow:0 16px 40px rgba(0,0,0,.2);
    }
    .site-nav.is-open { display:flex; }
    .site-nav > a,.nav-item { min-height:0; padding:0; border-bottom:1px solid #eee; }
    .site-nav > a,.nav-link { width:100%; padding:14px 8px; }
    .site-nav > a::after,.nav-link::after { display:none; }
    .nav-item--dropdown { display:grid; grid-template-columns:1fr 44px; gap:0; }
    .submenu-toggle { width:44px; height:100%; color:var(--ink); }
    .submenu-toggle img { filter:invert(1); }
    .submenu {
        display:none;
        visibility:visible;
        opacity:1;
        position:static;
        grid-column:1 / -1;
        width:100%;
        padding:0 8px 10px 18px;
        transform:none;
        border:0;
        border-radius:0;
        background:transparent;
        box-shadow:none;
    }
    .nav-item--dropdown:hover .submenu,.nav-item--dropdown:focus-within .submenu { display:none; transform:none; }
    .nav-item--dropdown.is-open .submenu { display:block; transform:none; }
    .submenu a { padding:11px 14px; color:#4c4c55; font-size:16px; }
    .submenu a:hover,.submenu a:focus-visible { color:var(--ink); background:#f4f4f5; }
    .site-nav > a:last-child { border-bottom:0; }
}