html {
    scroll-behavior: smooth;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

.glass-card {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
}

.dark .glass-card {
    background: rgba(16, 25, 34, 0.7);
}

/* Mobile Menu Animation */
#mobile-menu {
    transition: all 0.3s ease-in-out;
    transform-origin: top;
}

#mobile-menu.hidden {
    opacity: 0;
    transform: scaleY(0);
    display: none; /* Keep display: none for accessibility/layout when hidden, but we might need to toggle classes differently for animation */
}

/* 
   To animate from hidden (display:none) is tricky. 
   Better to use a class that handles visibility and transform.
   Let's assume we will toggle a class 'open' or similar, 
   but for now let's stick to the requested "animasyonlu yap" 
   using standard CSS transitions on max-height or transform.
*/

.mobile-menu-enter {
    animation: slideDown 0.3s ease-out forwards;
}

.mobile-menu-exit {
    animation: slideUp 0.3s ease-in forwards;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideUp {
    from {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
        transform: translateY(-10px);
    }
}