/* Custom Scrollbar to maintain aesthetics */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #0A1020;
}
::-webkit-scrollbar-thumb {
    background: #4C2C72;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #D95BA8;
}

/* Hide scrollbar for horizontal scrolling elements but keep functionality */
.hide-scrollbar::-webkit-scrollbar {
    display: none;
}
.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Smooth Scrolling over scrolling components */
html {
    scroll-behavior: smooth;
}

/* Typewriter effect for Transmission */
.typewriter {
    overflow: hidden;
    white-space: nowrap;
    border-right: 2px solid #35D6E8;
    animation: typing 3s steps(40, end), blink-caret .75s step-end infinite;
    max-width: fit-content;
}

@keyframes typing {
    from { width: 0 }
    to { width: 100% }
}
@keyframes blink-caret {
    from, to { border-color: transparent }
    50% { border-color: #35D6E8; }
}

/* Constellation particles */
.particle {
    position: absolute;
    background-color: rgba(245, 243, 238, 0.5); /* Pearl White with opacity */
    border-radius: 50%;
    animation: float 20s infinite ease-in-out;
    box-shadow: 0 0 4px rgba(245, 243, 238, 0.4);
}

@keyframes float {
    0%, 100% { transform: translateY(0) translateX(0); }
    50% { transform: translateY(-30px) translateX(20px); }
}