.aurora {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    filter: blur(150px);
}

.aurora-layer {
    position: absolute;
    opacity: 0.8;
    border-radius: 50%;
}

.aurora-glow {
    position: absolute;
    border-radius: 50%;
}

.aurora-glow-1 {
    width: 70%;
    height: 70%;
    top: 45%;
    left: -40%;
    background: radial-gradient(ellipse at 70% 80%, rgba(25, 90, 180, 0.7) 0%, rgba(20, 80, 170, 0.5) 25%, rgba(20, 70, 160, 0.3) 50%, transparent 75%);
    filter: blur(100px);
    animation: glow-drift-1 12s ease-in-out infinite;
}

.aurora-glow-2 {
    width: 65%;
    height: 65%;
    top: -5%;
    right: 0%;
    background: radial-gradient(ellipse at 30% 20%, rgba(25, 90, 180, 0.65) 0%, rgba(20, 80, 170, 0.45) 25%, rgba(20, 70, 160, 0.25) 50%, transparent 75%);
    filter: blur(100px);
    animation: glow-drift-2 14s ease-in-out infinite;
}

@keyframes glow-drift-1 {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.8; }
    50% { transform: translate(5%, 3%) scale(1.1); opacity: 0.9; }
}

@keyframes glow-drift-2 {
    0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.75; }
    50% { transform: translate(-3%, 4%) scale(1.08); opacity: 0.85; }
}

.aurora-1 {
    width: 90%;
    height: 90%;
    top: 30%;
    left: -60%;
    background: radial-gradient(ellipse 100% 50% at 50% 100%,
        transparent 50%,
        rgba(20, 60, 150, 0.3) 55%,
        rgba(25, 80, 170, 0.5) 62%,
        rgba(0, 220, 180, 0.9) 70%,
        rgba(0, 180, 150, 0.75) 78%,
        rgba(25, 100, 180, 0.6) 84%,
        rgba(30, 90, 170, 0.45) 90%,
        rgba(25, 80, 160, 0.3) 95%,
        transparent 100%);
    transform: rotate(-20deg);
    border-radius: 50%;
    animation: aurora-drift-1 12s ease-in-out infinite;
}

.aurora-2 {
    width: 85%;
    height: 85%;
    top: -20%;
    right: -25%;
    background: radial-gradient(ellipse 100% 50% at 50% 0%,
        transparent 50%,
        rgba(20, 60, 150, 0.3) 56%,
        rgba(25, 80, 170, 0.45) 63%,
        rgba(0, 210, 175, 0.85) 72%,
        rgba(0, 175, 155, 0.7) 80%,
        rgba(25, 100, 180, 0.55) 86%,
        rgba(30, 90, 170, 0.4) 92%,
        rgba(25, 80, 160, 0.25) 97%,
        transparent 100%);
    transform: rotate(15deg);
    border-radius: 50%;
    animation: aurora-drift-2 14s ease-in-out infinite;
}

@keyframes aurora-drift-1 {
    0%, 100% { transform: rotate(-20deg) translate(0, 0) scale(1); }
    25% { transform: rotate(-15deg) translate(5%, 3%) scale(1.05); }
    50% { transform: rotate(-22deg) translate(2%, -2%) scale(0.98); }
    75% { transform: rotate(-18deg) translate(-3%, 4%) scale(1.02); }
}

@keyframes aurora-drift-2 {
    0%, 100% { transform: rotate(15deg) translate(0, 0) scale(1); }
    25% { transform: rotate(18deg) translate(-4%, 2%) scale(1.03); }
    50% { transform: rotate(12deg) translate(-2%, -3%) scale(1.06); }
    75% { transform: rotate(20deg) translate(3%, 5%) scale(0.97); }
}