.dark body {
    --tw-bg-opacity: 1;
    background-color: rgb(3 7 18 / var(--tw-bg-opacity));
}

html {
    scroll-behavior: smooth;
}

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

::-webkit-scrollbar-track {
    background: #f1f5f9;
}

.dark ::-webkit-scrollbar-track {
    background: #1e293b;
}

::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #64748b;
}

::selection {
    background-color: #4f46e5;
    color: white;
}

.dark ::selection {
    background-color: #6366f1;
    color: white;
}

[data-aos] {
    opacity: 0;
    transition-property: opacity, transform;
}

[data-aos].aos-animate {
    opacity: 1;
}

@keyframes gradientMove {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.gradient-text {
    background: linear-gradient(135deg, #4f46e5, #7c3aed, #2563eb);
    background-size: 200% 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradientMove 4s ease infinite;
}

.btn-primary {
    @apply px-6 py-3 bg-indigo-500 text-white rounded-lg font-medium 
           hover:bg-indigo-600 transition-all duration-300 
           shadow-md hover:shadow-lg transform hover:-translate-y-0.5;
}

.card-hover {
    @apply transition-all duration-300;
}

.card-hover:hover {
    @apply shadow-xl -translate-y-1;
}

#loading.hidden-loading {
    opacity: 0;
    pointer-events: none;
}

.navbar-scrolled {
    @apply bg-white/95 dark:bg-gray-950/95 backdrop-blur-md shadow-sm;
}

.grid-fade-in > * {
    opacity: 0;
    animation: fadeIn 0.5s ease-out forwards;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}