/* ==========================================================================
   ANIMATIONS STYLESHEET - PREMIUM WEDDING INVITATION
   ========================================================================== */

/* --- KEYFRAMES --- */

/* Rotate Floral Logo */
@keyframes rotateLogo {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Music Disc Rotation */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Pulsing Outer Glow */
@keyframes pulseGlow {
    0% {
        transform: scale(0.95);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.3);
        opacity: 0;
    }
    100% {
        transform: scale(0.95);
        opacity: 0;
    }
}

/* Leaf/Petal Floating */
@keyframes drift {
    0% {
        transform: translateY(-50px) translateX(0) rotate(0deg);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    90% {
        opacity: 0.9;
    }
    100% {
        transform: translateY(105vh) translateX(100px) rotate(360deg);
        opacity: 0;
    }
}

/* Simple Wish Slide In */
@keyframes slideInWish {
    0% {
        transform: translateY(20px);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Floating Animation for Elements */
@keyframes floatElement {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0px);
    }
}

/* --- 3D ENVELOPE STATES & GSAP ACTIONS --- */

/* Opened State Class (managed via GSAP/JS) */
.envelope.open .envelope-flap {
    transform: rotateX(180deg);
    z-index: 1; /* Pushed behind letter when open */
    border-top-color: #ebdcb5; /* Changes color representation when flipped */
}

/* Initial styling before envelope animations start */
.envelope-letter.letter-out {
    transform: translateY(-220px);
    z-index: 3;
}

@media (max-width: 768px) {
    .envelope-letter.letter-out {
        transform: translateY(-160px);
    }
}

@media (max-width: 480px) {
    .envelope-letter.letter-out {
        transform: translateY(-130px);
    }
}

/* --- TEXT GLOW & HIGHLIGHTS --- */
.text-gold {
    color: var(--color-gold) !important;
    background: linear-gradient(120deg, var(--color-gold) 0%, var(--color-gold-light) 50%, var(--color-gold-dark) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none !important;
}

/* Interactive hover cards */
.hover-float {
    animation: floatElement 4s ease-in-out infinite;
}

/* --- CUSTOM TRANSITION CLASSES --- */
.fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 1s ease, transform 1s ease;
}

.fade-in-up.appear {
    opacity: 1;
    transform: translateY(0);
}

.scale-in {
    transform: scale(0.9);
    opacity: 0;
    transition: transform 1.2s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 1s ease;
}

.scale-in.appear {
    transform: scale(1);
    opacity: 1;
}