/* Ensure the parent container can hold the overlay */
.desktop-navigation.active {
    overflow: hidden;
    /* Prevents overlay overflow */
}

/* Background image layer */
.desktop-navigation.active::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url("../img/navbar-overlay.png") no-repeat center center;
    background-size: cover;
    opacity: 0.1;
    z-index: -1;
    /* Places it behind navbar content */
}

/* Ensure navbar content stays above overlay */
.desktop-navigation>* {
    position: relative;
    z-index: 2;
}

@keyframes shine {
    0% {
        left: -100%;
    }

    100% {
        left: 150%;
        /* End far enough to the right to clear the container */
    }
}

.about-page {
    position: relative;

}

.about-page::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../../assets/img/mountain-line2.png");
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.08;
    z-index: -1;
}