/* ========== Alfunun Academy - Custom Styles ========== */

/* Animations */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

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

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

@keyframes ping {
    75%, 100% { transform: scale(2); opacity: 0; }
}

@keyframes spotlight {
    0% { opacity: 0; transform: translate(-72%, -62%) scale(0.5); }
    100% { opacity: 1; transform: translate(-50%, -40%) scale(1); }
}

.animate-fadeInUp { animation: fadeInUp 0.8s ease-out forwards; }
.animate-fadeIn { animation: fadeIn 0.6s ease-out forwards; }
.animate-ping { animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; }

/* Marquee */
.marquee-scroll {
    animation: marqueeScroll 40s linear infinite;
}
.marquee-scroll-reverse {
    animation: marqueeScrollReverse 45s linear infinite;
}
.marquee-scroll:hover, .marquee-scroll-reverse:hover {
    animation-play-state: paused;
}

/* Glass effects */
.glass {
    background: rgba(9, 9, 11, 0.5);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.glass-card {
    background: #18181B;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    border-radius: 24px;
    padding: 2rem;
    transition: all 500ms;
}
.glass-card:hover {
    border-color: rgba(0, 163, 255, 0.4);
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(0, 163, 255, 0.1);
}

/* IntersectionObserver reveal */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Course card hover */
.course-card {
    transition: all 300ms;
}
.course-card:hover {
    transform: translateY(-10px);
    border-color: rgba(0, 163, 255, 0.3) !important;
}
.course-card:hover .course-title {
    color: #00A3FF;
}
.course-card:hover .course-icon-wrap {
    background: rgba(255, 255, 255, 0.1);
}

/* Team card hover */
.team-card:hover .team-image {
    transform: scale(1.1);
}

/* Review card */
.review-card {
    transition: all 300ms;
}
.review-card:hover {
    border-color: rgba(0, 163, 255, 0.5) !important;
    box-shadow: 0 0 30px -5px rgba(0, 163, 255, 0.15);
}

/* Bento feature card */
.feature-card {
    transition: all 300ms;
}
.feature-card:hover {
    border-color: rgba(0, 163, 255, 0.3) !important;
}

/* Gallery carousel item */
.gallery-item {
    transition: all 700ms cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
    user-select: none;
}

/* Scrollbar */
.custom-scrollbar::-webkit-scrollbar { width: 6px; }
.custom-scrollbar::-webkit-scrollbar-track { background: #18181B; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #3f3f46; border-radius: 3px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #52525b; }

/* Proof button hover */
.proof-btn:hover {
    background: white !important;
    color: black !important;
    border-color: white !important;
}

/* Stat counter animation */
.stat-item {
    opacity: 0;
    transform: scale(0.5);
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.stat-item.visible {
    opacity: 1;
    transform: scale(1);
}

/* Admin sidebar active link */
.admin-link-active {
    background: rgba(0, 163, 255, 0.1);
    color: #00A3FF;
    border: 1px solid rgba(0, 163, 255, 0.2);
}

/* Container utility for full-width sections */
.container-fluid {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Fix for Tailwind container */
.container {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}