@keyframes fade-in {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-20px); }
    60% { transform: translateY(-10px); }
}

.animate-fade-in {
    animation: fade-in 1s ease forwards;
}

.delay-100 {
    animation-delay: 0.1s;
}

.delay-200 {
    animation-delay: 0.2s;
}

.animate-bounce {
    animation: bounce 2s infinite;
}


body {
    
    background: linear-gradient(to bottom, 
        #FFFBF5 0%,   
        #FFF5E6 25%,  
        #FFEED9 50%,  
        #FFF5E6 75%,  
        #FFFBF5 100%  
    );
   
    background-attachment: fixed; 
}



::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: rgba(192, 108, 62, 0.4); 
    border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(192, 108, 62, 0.6); 
}


html {
    scroll-behavior: smooth;
}


.link-underline {
    position: relative;
    display: inline-block;
}

.link-underline::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #C06C3E; 
    transition: width 0.3s ease;
}

.link-underline:hover::after {
    width: 100%;
}


@keyframes fade-in-up {
    from { opacity: 0; transform: translateY(50px); }
    to { opacity: 1; transform: translateY(0); }
}
.scroll-animate {
    opacity: 0;
    transform: translateY(50px);
    will-change: transform, opacity; 
}
.scroll-animate.animated {
    animation: fade-in-up 0.8s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}
.scroll-animate.animated.delay-100 { animation-delay: 0.1s; }
.scroll-animate.animated.delay-200 { animation-delay: 0.2s; }

.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }


.micro-blur {
    filter: blur(2px) !important;
    -webkit-filter: blur(2px) !important;
}
.h-dvh {
    height: 100vh;
    height: 100dvh; 
}
@media (max-width: 768px) {
    .h-dvh video.micro-blur {
        filter: blur(2px) !important; 
        -webkit-filter: blur(2px) !important;
        transform: translateZ(0);
    }
}

#gallery-slider {
    flex-wrap: nowrap;
    animation: infinite-scroll 20s linear infinite;
}
#gallery-slider:hover {
    animation-play-state: paused;
}
@keyframes infinite-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}


@media (max-width: 768px) {
    #gallery-slider {
        animation: none;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
    }
}

