#so-band {
    --so-band-height: 36px;
    --so-band-speed: 32s;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999999;
    background: #111;
    border-bottom: 1px solid rgba(201, 168, 76, .22);
    display: flex;
    align-items: center;
    height: var(--so-band-height);
    font-family: "DM Sans", sans-serif, Arial;
}

.so-b-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #c9a84c;
    animation: so-bdot 1.5s infinite;
    flex-shrink: 0;
    margin: 0 10px 0 13px;
}

@keyframes so-bdot {
    0%,100% { opacity: 1; }
    50% { opacity: .2; }
}

.so-b-track {
    flex: 1;
    overflow: hidden;
    height: 100%;
    display: flex;
    align-items: center;
}

.so-b-inner {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    animation: so-ticker var(--so-band-speed) linear infinite;
}

.so-b-track:hover .so-b-inner {
    animation-play-state: paused;
}

@keyframes so-ticker {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.so-b-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 22px;
    font-size: .74rem;
    color: #ccc;
    letter-spacing: .01em;
}

.so-b-tag {
    font-size: .58rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #c9a84c;
    background: rgba(201, 168, 76, .1);
    border: .5px solid rgba(201, 168, 76, .28);
    padding: 2px 6px;
    flex-shrink: 0;
}

.so-b-text {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
}

.so-b-desc {
    color: #6b6760;
    font-size: .7rem;
}

.so-b-item a {
    color: #c9a84c;
    text-decoration: none;
    font-size: .68rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    border-bottom: .5px solid rgba(201, 168, 76, .35);
    padding-bottom: 1px;
    flex-shrink: 0;
    transition: color .15s, border-color .15s;
}

.so-b-item a:hover {
    color: #fff;
    border-bottom-color: #fff;
}

.so-b-sep {
    color: rgba(201, 168, 76, .2);
    padding: 0 4px;
    font-size: .7rem;
}

.so-b-close {
    flex-shrink: 0;
    background: none;
    border: none;
    color: #555;
    font-size: .78rem;
    cursor: pointer;
    padding: 0 11px;
    height: 100%;
    display: flex;
    align-items: center;
    transition: color .15s;
}

.so-b-close:hover {
    color: #ede8e0;
}

body.so-band-open #main-header,
body.so-band-open #main-header.et-fixed-header {
    top: var(--so-band-offset, var(--so-band-height)) !important;
}

@media (max-width: 767px) {
    .so-b-item {
        padding: 0 16px;
    }
}
