.discord-promo {
    background-color: #5865f2be;
    border-radius: 10px;
    padding: 40px;
    margin-top: 40px;
    text-align: left;
    color: white;
    position: relative;
    clip-path: inset(0 round 10px);
}

.discord-promo::before {
    content: "";
    position: absolute;
    top: -15px;
    right: -40px;
    width: 16em;
    height: 16em;
    background: url('../static/discord-symbol-white.svg') no-repeat center center;
    transform: rotate(12deg);
    background-size: 16em;
    opacity: 0.1;
    pointer-events: none;
    z-index: 0;
}

.discord-promo h1 {
    color: white !important;
}

.discord-promo p {
    padding-top: 0px; /* for some reason this dumb shit needs it */
}

.discord-promo > * {
    position: relative;
    z-index: 1;
}

.discord-promo h1 {
    font-size: 1.8em;
    line-height: 1.4em;
    margin-top: 10px;
}

.discord-promo a {
    background-color: #E0E3FF33;
    color: white !important;
    margin: 30px 0px 5px 0px !important;
}

.discord-promo a:hover {
    background-color: #E0E3FF22;
}

#discord-promo-stars {
    position: relative;
    box-shadow: 0 0px 16px #fff3, 0 0px 32px #ffe06620;
}

#discord-promo-stars::before {
    content: "✨";
    position: absolute;
    top: -5px;
    right: -15px;
    font-size: 1.5em;
    pointer-events: none;
    z-index: 0;
    animation: bounce-stars 4s linear infinite;
}

#discord-online-count {
    margin-left: 16px;
}

@media (max-width: 550px) {
    #discord-online-count {
        display: block;
        margin-left: 0;
        margin-top: 12px; /* optional spacing when moved to new line */
        width: 237px; /* optional fixed width for better alignment */
        text-align: center; /* center text when on new line */
    }
}

@keyframes bounce-stars {
    0%, 100% {
        transform: translateY(-4px);
        text-shadow: 0 2px 8px #fff4, 0 0px 16px #ffe06655;
        opacity: 0.7;
    }
    25%, 75% {
        opacity: 1;
    }
    50% {
        transform: translateY(-7px);
        text-shadow: 0 2px 8px #fff4, 0 0px 16px #ffe06655;
        opacity: 0.7;
    }
}