body {
    scrollbar-width: thin;
    scrollbar-color: #30303b #18181a;
}

::-webkit-scrollbar {
    width: 4px;
}

::-webkit-scrollbar-track {
    background: #18181a;
}

::-webkit-scrollbar-thumb {
    background: #30303b;
}

.glitch-text {
    text-shadow: 2px 0 #ff00c1, -2px 0 #00fff9;
    position: relative;
}

/* FLOW Text Scroll Animation */
.flow-letter {
    display: inline-block;
    position: relative;
    overflow: hidden;
    clip-path: inset(0 100% 0 0);
    transition: clip-path 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.flow-letter.space {
    width: 0.25em;
}

.flow-letter.writing {
    clip-path: inset(0 0% 0 0);
    animation: writeLetter 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.flow-letter.revealed {
    clip-path: inset(0 0% 0 0);
}

@keyframes writeLetter {
    0% {
        clip-path: inset(0 100% 0 0);
    }
    100% {
        clip-path: inset(0 0% 0 0);
    }
}

.horizontal-scroll {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.horizontal-scroll::-webkit-scrollbar {
    display: none;
}

.snap-item {
    scroll-snap-align: start;
}

/* Editorial Hero Text Animation */
.editorial-hero-char {
    display: inline-block;
    opacity: 0;
    animation: editorialHeroFadeIn 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.editorial-hero-char.space {
    width: 0.25em;
}

.editorial-quote-char {
    display: inline-block;
    opacity: 0;
    animation: editorialQuoteFadeIn 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.editorial-quote-char.space {
    width: 0.25em;
}

@keyframes editorialHeroFadeIn {
    0% {
        opacity: 0;
        transform: translateY(0.1em);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes editorialQuoteFadeIn {
    0% {
        opacity: 0;
        transform: translateY(0.15em);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}