/* ═══════════════════════════════════════════════
   AURORA — pure CSS, fără shader, fără GPU drain.
   Animez orb-urile existente cu CSS keyframes pe transform
   (compositor-only, fără paint/layout). Battery-friendly.
═══════════════════════════════════════════════ */

@keyframes auroraOrb1 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    25%      { transform: translate3d(50px, -30px, 0) scale(1.05); }
    50%      { transform: translate3d(-30px, 40px, 0) scale(0.95); }
    75%      { transform: translate3d(40px, 30px, 0) scale(1.02); }
}

@keyframes auroraOrb2 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    33%      { transform: translate3d(-60px, 50px, 0) scale(1.08); }
    66%      { transform: translate3d(50px, -20px, 0) scale(0.94); }
}

@keyframes auroraOrb3 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50%      { transform: translate3d(70px, -50px, 0) scale(1.12); }
}

/* Pornim animatia. Durate diferite ca sa nu sincronizeze niciodata,
   easing soft pentru drift natural. */
.orb-1 { animation: auroraOrb1 32s cubic-bezier(0.45, 0, 0.55, 1) infinite; will-change: transform; }
.orb-2 { animation: auroraOrb2 41s cubic-bezier(0.45, 0, 0.55, 1) infinite; will-change: transform; }
.orb-3 { animation: auroraOrb3 26s cubic-bezier(0.45, 0, 0.55, 1) infinite; will-change: transform; }

/* Mai colorat si mai vizibil — completam paleta cu un al 4-lea orb pink */
body::after {
    content: '';
    position: fixed;
    width: 420px; height: 420px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(236,72,153,0.06) 0%, transparent 70%);
    filter: blur(120px);
    pointer-events: none;
    z-index: 0;
    top: 55%; right: 12%;
    animation: auroraOrb2 38s cubic-bezier(0.45, 0, 0.55, 1) infinite reverse;
    will-change: transform;
}

/* Respect prefers-reduced-motion — fara animatii pentru useri cu accessibility */
@media (prefers-reduced-motion: reduce) {
    .orb-1, .orb-2, .orb-3, body::after { animation: none; }
}
