/* Custom Styles for Emerald Oasis */

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* Marquee Animation */
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.animate-marquee {
    animation: marquee 20s linear infinite;
}

/* Blob Animation */
@keyframes float {
    0% { transform: translate(0, 0) rotate(0deg); }
    50% { transform: translate(20px, 40px) rotate(10deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}

.blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.6;
    animation: float 10s ease-in-out infinite;
}

.blob-1 {
    top: 10%;
    left: 10%;
    width: 300px;
    height: 300px;
    background: #D1F2E6;
}

.blob-2 {
    bottom: 10%;
    right: 10%;
    width: 400px;
    height: 400px;
    background: #FFF0D0;
    animation-delay: -5s;
}

/* Mobile Menu Transitions */
#mobile-menu.open {
    transform: translateX(0);
}

#menu-btn.active #line1 {
    transform: rotate(45deg) translate(5px, 5px);
}

#menu-btn.active #line2 {
    opacity: 0;
}

#menu-btn.active #line3 {
    transform: rotate(-45deg) translate(5px, -5px);
}