/**
 * Animations — Rub a Lamp
 * Fade-in animationer til page load og scroll
 * Tokens hentes fra tokens.css
 * Opdateret: 2026-03-02
 *
 * Brug:
 *   .fade-in-up              — above-the-fold, kører ved page load
 *   .fade-in-on-scroll       — under fold, kører når element scroller ind
 *   .delay-1 til .delay-9    — page load delays (0.2s–1.8s)
 *   .scroll-delay-1 til -9   — scroll delays (0.2s–1.8s)
 */


/* ============================================================
   FÆLLES KEYFRAME
   ============================================================ */

@keyframes fadeInUp {
    from {
        opacity:   0;
        transform: translateY(60px);
    }
    to {
        opacity:   1;
        transform: translateY(0);
    }
}


/* ============================================================
   PAGE LOAD — above-the-fold elementer
   Kører med det samme (+ valgfri delay)
   ============================================================ */

.fade-in-up {
    opacity:   0;
    transform: translateY(60px);
    animation: fadeInUp 0.8s ease-out forwards;
}


/* ============================================================
   SCROLL — under fold elementer
   Venter på IntersectionObserver (.visible)
   ============================================================ */

.fade-in-on-scroll {
    opacity:   0;
    transform: translateY(60px);
}

.fade-in-on-scroll.visible {
    animation: fadeInUp 0.8s ease-out forwards;
}


/* ============================================================
   DELAY-KLASSER — Page load
   ============================================================ */

.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; }
.delay-4 { animation-delay: 0.8s; }
.delay-5 { animation-delay: 1.0s; }
.delay-6 { animation-delay: 1.2s; }
.delay-7 { animation-delay: 1.4s; }
.delay-8 { animation-delay: 1.6s; }
.delay-9 { animation-delay: 1.8s; }


/* ============================================================
   DELAY-KLASSER — Scroll
   ============================================================ */

.scroll-delay-1 { animation-delay: 0.2s; }
.scroll-delay-2 { animation-delay: 0.4s; }
.scroll-delay-3 { animation-delay: 0.6s; }
.scroll-delay-4 { animation-delay: 0.8s; }
.scroll-delay-5 { animation-delay: 1.0s; }
.scroll-delay-6 { animation-delay: 1.2s; }
.scroll-delay-7 { animation-delay: 1.4s; }
.scroll-delay-8 { animation-delay: 1.6s; }
.scroll-delay-9 { animation-delay: 1.8s; }


/* ============================================================
   ELEMENTOR EDITOR — deaktivér animationer
   Så indhold er synligt under redigering
   ============================================================ */

.elementor-editor-active [class*="fade-in-"] {
    opacity:   1 !important;
    transform: none !important;
    animation: none !important;
}