/* Custom CSS to replace framer-motion and some Tailwind plugins */

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

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

/* Reveal Animations (Intersection Observer) */
.reveal-up {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-up.active {
    opacity: 1;
    transform: translateY(0);
}

.reveal-scale {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.reveal-scale.active {
    opacity: 1;
    transform: scale(1);
}

.reveal-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}

.reveal-right {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

/* Navbar Scrolled State */
.nav-scrolled {
    background-color: rgba(15, 23, 42, 0.8) !important; /* slate-900/80 */
    backdrop-filter: blur(24px);
    border-bottom: 1px solid rgba(30, 41, 59, 1); /* slate-800 */
    box-shadow: 0 4px 30px rgba(0,0,0,0.1);
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
}

/* Hide scrollbar for clean look */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #020617; /* slate-950 */
}
::-webkit-scrollbar-thumb {
    background: #1e293b; /* slate-800 */
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #008B8B; /* cyan-accent */
}
