/* سربرگ مشترک همهٔ صفحات عمومی؛ با هویت هخامنشی و رفتار یکسان. */
:root {
    --public-header-height: 76px;
}
:root:has(.site-header.is-compact) {
    --public-header-height: 64px;
}
.site-header {
    --header-height: var(--public-header-height);
    --color-heading: #fff;
    --color-text: #d5d9e7;
    --color-muted: #b8c0d4;
    --color-surface: #0f1730;
    --color-border: rgba(212, 168, 75, 0.17);
    --color-primary: #d8bd80;
    --color-primary-soft: rgba(212, 168, 75, 0.08);
    --focus-ring: 0 0 0 4px rgba(167, 139, 250, 0.3);
    background: rgba(10, 16, 32, 0.94);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(212, 168, 75, 0.3);
    isolation: isolate;
    color-scheme: dark;
}
.site-header::before {
    content: '';
    pointer-events: none;
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, rgba(10, 16, 32, 0.7), rgba(10, 16, 32, 0.25), rgba(10, 16, 32, 0.7)),
        url('../../images/home/persepolis-640.webp') center 62% / cover;
    opacity: 0.17;
}
.site-header::after {
    content: '';
    position: absolute;
    inset-inline: 24px;
    bottom: 3px;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(212, 168, 75, 0.25) 20%,
        rgba(212, 168, 75, 0.25) 80%,
        transparent
    );
}
.site-header__inner {
    min-height: 76px;
    transition: min-height 0.25s ease;
}
.site-header.is-compact .site-header__inner {
    min-height: 64px;
}
.site-header .brand__logo--light {
    display: none;
}
.site-header .brand__logo--dark {
    display: block;
}
.site-header .brand__word strong {
    color: #fff;
}
.site-header .brand__word small {
    color: #d1b67c;
}
.site-header .site-nav__link {
    color: #eee9dd;
    font-size: 13px;
}
.site-header .site-nav__link:hover,
.site-header .site-nav__link[aria-current='page'] {
    color: #efd5a2;
    background: rgba(212, 168, 75, 0.08);
}
.site-header .site-nav__mega {
    background: #0f1730;
    border-color: rgba(212, 168, 75, 0.2);
}
.site-header a:focus-visible {
    outline: 2px solid #c4b5fd;
    outline-offset: 4px;
}
img.trader-avatar {
    object-fit: cover;
    border-radius: 50%;
}
@media (max-width: 58rem) {
    :root {
        --public-header-height: 64px;
    }
    .site-header__inner {
        min-height: 64px;
    }
    .site-header .site-nav__link {
        font-size: 15px;
    }
    .site-header .site-nav__submenu {
        background: transparent;
    }
}
@media (prefers-reduced-motion: reduce) {
    .site-header__inner {
        transition: none;
    }
}
