div#loading {
    width: 100%;
    height: 100%;
    display: none;
    background-image: url('https://storage.googleapis.com/eunoic-2.appspot.com/files/visuals/gifs/loading.gif');
    background-repeat: no-repeat;
    position: absolute;
    }

#banner-container {
    position: fixed; /* Fixed position relative to the viewport */
    top: 0; /* Align to the top of the viewport */
    left: 0; /* Align to the left of the viewport */
    width: 100%; /* Span the full width of the viewport */
    z-index: 1000; /* High z-index to ensure it floats above other content */
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5); /* Optional: Adds shadow for better visibility */
    }
/* Smooth dropdown animation (cannot be achieved with Tailwind transitions alone) */
.dropdown-content {
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

/* Mobile menu slide animation (Tailwind transform alone isn't sufficient) */
.mobile-menu {
    transition: transform 0.3s ease;
}

/* Film-grain overlay for the landing page gradient panels. Generated with an SVG
   feTurbulence filter, which Tailwind has no utility for. Pair with a gradient
   background and blend it in via `opacity-30 mix-blend-overlay`. */
.wallpaper-noise {
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22250%22%20height%3D%22250%22%20viewBox%3D%220%200%20100%20100%22%3E%20%3Cfilter%20id%3D%22n%22%3E%20%3CfeTurbulence%20type%3D%22turbulence%22%20baseFrequency%3D%221.4%22%20numOctaves%3D%221%22%20seed%3D%222%22%20stitchTiles%3D%22stitch%22%20result%3D%22n%22%20%2F%3E%20%3CfeComponentTransfer%20result%3D%22g%22%3E%20%3CfeFuncR%20type%3D%22linear%22%20slope%3D%224%22%20intercept%3D%221%22%20%2F%3E%20%3CfeFuncG%20type%3D%22linear%22%20slope%3D%224%22%20intercept%3D%221%22%20%2F%3E%20%3CfeFuncB%20type%3D%22linear%22%20slope%3D%224%22%20intercept%3D%221%22%20%2F%3E%20%3C%2FfeComponentTransfer%3E%20%3CfeColorMatrix%20type%3D%22saturate%22%20values%3D%220%22%20in%3D%22g%22%20%2F%3E%20%3C%2Ffilter%3E%20%3Crect%20width%3D%22100%25%22%20height%3D%22100%25%22%20filter%3D%22url%28%23n%29%22%20%2F%3E%20%3C%2Fsvg%3E");
}