.welcome-blurb-container {
    order: 0;
}
.halo-a-container {
    order: 1;
}
.halo-a-blurb-container {
    order: 2;
}
.halo-b-container {
    order: 4;
}
.halo-b-blurb-container {
    order: 3;
}
.halo-c-container {
    order: 5;
}
.halo-c-blurb-container {
    order: 6;
}
.halo-d-container {
    order: 8;
}
.halo-d-blurb-container {
    order: 7;
}
.halo-footer-container {
    order: 9;
}

@media (width < 960px) {
    .welcome-blurb-container {
        order: 0;
    }
    .halo-a-container {
        order: 1;
    }
    .halo-a-blurb-container {
        order: 2;
    }
    .halo-b-container {
        order: 3;
    }
    .halo-b-blurb-container {
        order: 4;
    }
    .halo-c-container {
        order: 5;
    }
    .halo-c-blurb-container {
        order: 6;
    }
    .halo-d-container {
        order: 7;
    }
    .halo-d-blurb-container {
        order: 8;
    }
    .halo-footer-container {
        order: 9;
    }
    .halo-blurb-container {
        margin-bottom: 64px;   
    }
}

/* Splash Screen */
#app-loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: opacity 0.5s ease-out, visibility 0.5s;
}

.loading-icon {
    width: 100px;
    height: 100px;
    animation: pulse 2s infinite ease-in-out;
}

@keyframes pulse {
    0%, 100% { transform: scale(1); opacity: 0.8; }
    50% { transform: scale(1.1); opacity: 1; }
}

/* Theme colors for splash screen */
.light-mode #app-loading {
    background-color: #F9FAEF; /* surfaceLight */
}

.dark-mode #app-loading {
    background-color: #12140E; /* surfaceDark */
}

.system-mode #app-loading {
    background-color: #F9FAEF;
}

@media (prefers-color-scheme: dark) {
    .system-mode #app-loading {
        background-color: #12140E;
    }
    
    .system-mode .loading-icon {
        content: url("../images/appIconNoBgDark.webp");
    }
}

/* Hide splash screen when Blazor is loaded */
body.loaded #app-loading {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}