/* Hero Canvas Layers */
#gl-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

#ui-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}

.hero-sticky-wrapper {
    position: sticky;
    top: 0;
    height: 100vh;
    width: 100%;
    overflow: hidden;
    z-index: 0;
    background-color: #09090b;
    /* Behind content */
}

.scroll-track {
    height: 200vh;
    /* Scroll distance for animation */
    position: relative;
    z-index: 10;
}

 .faq-answer {
                max-height: 0;
                overflow: hidden;
                transition: max-height 0.3s ease-out, opacity 0.3s ease-out, margin-top 0.3s ease;
                opacity: 0;
            }

            .faq-item.active .faq-answer {
                max-height: 200px;
                /* Arbitrary large height */
                opacity: 1;
                margin-top: 1rem;
            }

            .faq-icon {
                transition: transform 0.3s ease;
            }

            .faq-item.active .faq-icon {
                transform: rotate(45deg);
            }