.egb-marquee {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: var(--egb-height, 86px);
    overflow: hidden;
    background: linear-gradient(var(--egb-gradient, 90deg), var(--egb-c1, #25f27c), var(--egb-c2, #62a7ff), var(--egb-c3, #f0a2ff));
    color: var(--egb-text, #050505);
    box-sizing: border-box;
    isolation: isolate;
}

.egb-track {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: var(--egb-gap, 54px);
    min-width: max-content;
    padding-right: var(--egb-gap, 54px);
    animation: egb-scroll var(--egb-speed, 24s) linear infinite;
    will-change: transform;
}

.egb-marquee:hover .egb-track,
.egb-marquee.is-paused .egb-track {
    animation-play-state: paused;
}

.egb-item {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    color: var(--egb-text, #050505);
    font-size: var(--egb-size, 40px);
    font-weight: var(--egb-weight, 900);
    line-height: 1;
    letter-spacing: 0;
    font-family: inherit;
}

.egb-uppercase .egb-item {
    text-transform: uppercase;
}

.egb-separator {
    flex: 0 0 auto;
    color: var(--egb-separator, #050505);
}

.egb-separator-star {
    position: relative;
    width: .95em;
    height: .95em;
    transform: rotate(45deg);
}

.egb-separator-star::before,
.egb-separator-star::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    background: currentColor;
}

.egb-separator-star::before {
    width: 100%;
    height: 24%;
}

.egb-separator-star::after {
    width: 24%;
    height: 100%;
}

.egb-separator-dot {
    width: .34em;
    height: .34em;
    border-radius: 50%;
    background: currentColor;
}

.egb-separator-plus {
    font-size: var(--egb-size, 40px);
    font-weight: 900;
    line-height: 1;
}

.egb-toggle {
    position: absolute;
    right: 22px;
    top: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #050505;
    color: #ffffff;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
    transform: translateY(-50%);
}

.egb-toggle-pause,
.egb-toggle-play {
    display: block;
}

.egb-toggle-pause {
    width: 16px;
    height: 19px;
    border-left: 5px solid currentColor;
    border-right: 5px solid currentColor;
}

.egb-toggle-play {
    display: none;
    width: 0;
    height: 0;
    margin-left: 4px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 17px solid currentColor;
}

.egb-marquee.is-paused .egb-toggle-pause {
    display: none;
}

.egb-marquee.is-paused .egb-toggle-play {
    display: block;
}

.egb-no-button .egb-track {
    padding-right: var(--egb-gap, 54px);
}

@keyframes egb-scroll {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(-100%, 0, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .egb-track {
        animation-duration: calc(var(--egb-speed, 24s) * 2);
    }
}

@media (max-width: 768px) {
    .egb-marquee {
        height: var(--egb-mobile-height, 62px);
    }

    .egb-item,
    .egb-separator-plus {
        font-size: var(--egb-mobile-size, 25px);
    }

    .egb-track {
        gap: calc(var(--egb-gap, 54px) * .58);
        padding-right: calc(var(--egb-gap, 54px) * .58);
    }

    .egb-toggle {
        right: 12px;
        width: 42px;
        height: 42px;
    }

    .egb-toggle-pause {
        width: 13px;
        height: 16px;
        border-left-width: 4px;
        border-right-width: 4px;
    }

    .egb-toggle-play {
        border-top-width: 9px;
        border-bottom-width: 9px;
        border-left-width: 14px;
    }
}