.scroll-sticky-navigation {
    background: var(--bg-color);
    padding-top: var(--padding-top);
    padding-bottom: var(--padding-bottom);
    border-bottom: 1px solid var(--color);
}

a.scroll-navigate-items {
    display: block;
    color: var(--color);
    font-size: 18px;
    text-transform: capitalize;
}

a.scroll-navigate-items:hover {
    color: var(--color);
}

.main-scroll-sticky-navigation {
    width: fit-content;
    margin: 0 auto;
    position: relative;
}

.scroll-sticky-navigation-flex {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    width: fit-content;
    margin: 0 auto;
}

.scroll-navigation-coll {
    position: sticky;
    top: 0;
    z-index: 99;
}

.as-high-line-sticky {
    width: var(--active-line-width);
    height: 3px;
    transform: translate3d(var(--active-line-translate-x), 0, 0);
    background-color: #fff;
    position: absolute;
    bottom: -16px;
    transition: all 0.5s;
}

header.header.section--padding.is-sticky.hide-header {
    z-index: -1;
    visibility: hidden;
}

@media(max-width: 768px) {
    .scroll-sticky-navigation {
        padding-top: var(--padding-top-mobile);
        padding-bottom: var(--padding-bottom-mobile);
    }

    a.scroll-navigate-items {
        font-size: 15px;
    }

    .scroll-sticky-navigation-flex {
        gap: 1.2rem;
    }
}