/* ========================================= */
/* LA VINIA – ANIMATIONS (FINAL VERSION)     */
/* Premium Black/Gold Motion System          */
/* ========================================= */


/* ========================================= */
/* 1) HERO – FADE-IN CONTAINER               */
/* ========================================= */
@keyframes fadeContainer {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* HERO block */
.hero-block {
    opacity: 0;
    animation: fadeContainer 1.2s ease-out forwards;
}


/* ========================================= */
/* 2) HERO – TEXT FADE-IN                    */
/* ========================================= */
@keyframes fadeInHero {
    0%   { opacity: 0; transform: translateY(26px); }
    100% { opacity: 1; transform: translateY(0); }
}

.hero-content {
    opacity: 0;
    animation: fadeInHero 1.4s ease-out forwards;
}


/* ========================================= */
/* 3) GOLD SHINE ANIMATION (HEADERS)         */
/* ========================================= */
@keyframes goldShine {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}


/* ========================================= */
/* 4) HERO BACKGROUND ZOOM                   */
/* ========================================= */
@keyframes heroZoom {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.06); }
    100% { transform: scale(1); }
}

.hero-image {
    animation: heroZoom 12s ease-in-out infinite;
}


/* ========================================= */
/* 5) PANEL FADE (USED ON MANY PAGES)        */
/* ========================================= */
@keyframes fadePanel {
    0% { opacity:0; transform: translateY(20px); }
    100% { opacity:1; transform: translateY(0); }
}

.panel {
    opacity: 0;
    animation: fadePanel 1s ease-out forwards;
}


/* ========================================= */
/* 6) FEATURES SECTION ANIMATION             */
/* ========================================= */
@keyframes fadeFeatures {
    0%   { opacity: 0; transform: translateY(24px); }
    100% { opacity: 1; transform: translateY(0); }
}

.feature-box {
    opacity: 0;
    animation: fadeFeatures 1.2s ease-out forwards;
}


/* ========================================= */
/* 7) UNIVERSAL FADE-UP / FADE-IN SYSTEM     */
/* (Reservation page + all other pages)      */
/* ========================================= */

/* Fade up */
.fade-up {
    opacity: 0;
    transform: translateY(22px);
    animation: fadeUpAnim 1s ease-out forwards;
}

@keyframes fadeUpAnim {
    0% {
        opacity: 0;
        transform: translateY(22px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Simple fade-in */
.fade-in {
    opacity: 0;
    animation: fadeInAnim 1s ease-out forwards;
}

@keyframes fadeInAnim {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Delayed appearances */
.fade-delay-1 { animation-delay: 0.20s !important; }
.fade-delay-2 { animation-delay: 0.35s !important; }
.fade-delay-3 { animation-delay: 0.50s !important; }
.fade-delay-4 { animation-delay: 0.65s !important; }


/* ========================================= */
/* END OF FILE                                */
/* ========================================= */