/* CUSTOM ANIMATIONS */
@keyframes slow-zoom {
    0% { transform: scale(1.05); }
    100% { transform: scale(1.15); }
}

.animate-slow-zoom {
    animation: slow-zoom 20s ease-in-out infinite alternate;
}

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

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

/* SCROLL REVEAL CLASSES */
.opacity-0 { opacity: 0; }
.opacity-100 { opacity: 1; }
.translate-y-4 { transform: translateY(1rem); }
.translate-y-8 { transform: translateY(2rem); }
.translate-y-0 { transform: translateY(0); }

/* FAQ ACCORDION TRANSITION */
[data-faq-answer] {
    transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* CUSTOM CURSOR (Optional premium touch) */
@media (min-width: 1024px) {
    body {
        cursor: crosshair;
    }

    a, button {
        cursor: pointer;
    }
}

/* SELECTION COLOR */
::selection {
    background-color: #0066FF;
    color: white;
}

/* SCROLLBAR */
::-webkit-scrollbar {
    width: 6px;
}

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

::-webkit-scrollbar-thumb {
    background: #333333;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #0066FF;
}

/* MOBILE MENU ACTIVE STATE */
#mobile-menu.active {
    transform: translateX(0);
}

/* BURGER ICON ANIMATION */
#menu-toggle {
    z-index: 130;
    transition: transform 0.3s ease;
}

#menu-toggle:hover {
    transform: scale(1.1);
}

#menu-toggle:active {
    transform: scale(0.95);
}

#menu-toggle span {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transform-origin: center;
    background-color: white;
}

#menu-toggle span:nth-child(1) {
    transform: translate(-50%, calc(-50% - 8px));
}

#menu-toggle span:nth-child(3) {
    transform: translate(-50%, calc(-50% + 8px));
}

#menu-toggle.active span:nth-child(1) {
    transform: translate(-50%, -50%) rotate(45deg);
}

#menu-toggle.active span:nth-child(2) {
    opacity: 0;
    transform: translate(-50%, -50%) scaleX(0);
}

#menu-toggle.active span:nth-child(3) {
    transform: translate(-50%, -50%) rotate(-45deg);
}
