@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=JetBrains+Mono:wght@300;500&display=swap');

:root {

--neon-cyan: #00f2ff;

--neon-pink: #ff00ea;

--bg-dark: #030712;

}



body {

background-color: var(--bg-dark);

background-image: radial-gradient(circle at 50% 50%, #111827 0%, #030712 100%);

color: #fff;

/* Font replace kora holo */

font-family: 'Roboto', sans-serif;

overflow-x: hidden;

}



/* CSS Logic for Recycling Animation */

@keyframes marquee-recycle {

0% {

transform: translateX(0);

}

100% {

/* Ekta puro set par hoye gele abar 0 te fire ashbe seamlessly */

transform: translateX(-50%);

}

}



.marquee-content {

display: flex;

gap: 80px; /* gap-20 in tailwind is 80px */

width: max-content; /* content onujayi width nibe */

animation: marquee-recycle 25s linear infinite;

}



/* Hover korle animation pause hobe */

.marquee-container:hover .marquee-content {

animation-play-state: paused;

}



/* Ensure icons are same size for smooth loop */

.marquee-content i {

flex-shrink: 0;

width: 60px;

text-align: center;

}



/* Jodi JetBrains Mono class thake seta replace korun */

.mono-font {

font-family: 'Roboto', sans-serif;

}



.glow-area {

position: fixed;

top: 0; left: 0; width: 100%; height: 100%;

z-index: -2;

overflow: hidden;

filter: blur(80px);

opacity: 0.3;

}



.blob {

position: absolute;

border-radius: 50%;

animation: moveBlobs 20s infinite alternate;

}

.blob-1 { width: 300px; height: 300px; background: var(--neon-cyan); top: -5%; left: -5%; }

.blob-2 { width: 250px; height: 250px; background: var(--neon-pink); bottom: -5%; right: -5%; animation-delay: -5s; }



@keyframes moveBlobs {

0% { transform: translate(0, 0) scale(1); }

50% { transform: translate(50px, 20px) scale(1.1); }

100% { transform: translate(-20px, 50px) scale(1); }

}



.tech-font { font-family: 'Orbitron', sans-serif; }

.neon-text-cyan { text-shadow: 0 0 10px rgba(0, 242, 255, 0.7); }



.hero-image-container {

position: relative;

animation: floatImage 6s ease-in-out infinite;

}

@keyframes floatImage {

0%, 100% { transform: translateY(0); }

50% { transform: translateY(-15px); }

}





@keyframes scan {

0% { top: 0%; opacity: 0; }

50% { opacity: 1; }

100% { top: 100%; opacity: 0; }

}

.animate-scan { animation: scan 2.5s linear infinite; }


/* Panel Opening Animation Classes */

.panel-active {

display: block !important;

opacity: 1 !important;

transform: scale(1) !important;

}






/* Active Menu Style */

.nav-link.active {

color: #00f2ff !important; /* Neon Cyan */

position: relative;

text-shadow: 0 0 10px rgba(0, 242, 255, 0.7);

}



.nav-link.active::after {

content: '';

position: absolute;

bottom: -5px;

left: 0;

width: 100%;

height: 2px;

background: #00f2ff;

box-shadow: 0 0 10px #00f2ff;

}



.bento-card {

background: rgba(255, 255, 255, 0.02);

border: 1px solid rgba(255, 255, 255, 0.05);

backdrop-filter: blur(20px);

transition: 0.4s;

}

.bento-card:hover {

border-color: var(--neon-cyan);

box-shadow: 0 0 30px rgba(0, 242, 255, 0.2);

}

#menu.flex {

animation: fadeInDown 0.4s ease forwards;

}



.swiper-slide {

padding: 20px 0 !important; /* Slide-er ashpase ektu jaiga */

}



.bento-card p {

font-size: 1rem; /* Text ektu boro kora holo jate box bhorat lage */

line-height: 1.8;

}



.tech-font.text-sm {

font-size: 1rem !important; /* Name ektu boro kora holo */

}





.typed-cursor {

color: #22d3ee; /* cyan-400 */

font-size: 1em;

opacity: 1;

animation: typedjsBlink 0.7s infinite;

}



@keyframes typedjsBlink {

50% { opacity: 0.0; }

}







/* CSS Logic for Recycling Animation */

@keyframes marquee-recycle {

0% {

transform: translateX(0);

}

100% {

/* Ekta puro set par hoye gele abar 0 te fire ashbe seamlessly */

transform: translateX(-50%);

}

}



.marquee-content {

display: flex;

gap: 80px; /* gap-20 in tailwind is 80px */

width: max-content; /* content onujayi width nibe */

animation: marquee-recycle 25s linear infinite;

}



/* Hover korle animation pause hobe */

.marquee-container:hover .marquee-content {

animation-play-state: paused;

}



/* Ensure icons are same size for smooth loop */

.marquee-content i {

flex-shrink: 0;

width: 60px;

text-align: center;

}



@keyframes ai-scan {

0% { top: 0; opacity: 0; }

50% { opacity: 1; }

100% { top: 100%; opacity: 0; }

}



.animate-ai-scan {

animation: ai-scan 2s linear infinite;

}



#ai-chat-btn:hover + #chat-tooltip {

opacity: 1;

translate: 0;

}



/* AI Floating Animation */

#ai-chat-btn {

animation: floating-ai 3s ease-in-out infinite;

}



@keyframes floating-ai {

0%, 100% { transform: translateY(0px); }

50% { transform: translateY(-10px); }

}



@keyframes fadeInDown {

from { opacity: 0; transform: translateY(-10px); }

to { opacity: 1; transform: translateY(0); }

}


/* course details styles */
/* Mobile Scrollbar fix */
.custom-scrollbar::-webkit-scrollbar {
    width: 2px; /* Mobile-e aro chikon thakbe */
}

@media (min-width: 768px) {
    .custom-scrollbar::-webkit-scrollbar {
        width: 4px;
    }
}

/* Ensure images/videos in accordion don't overflow */
#question-container img, #question-container video {
    max-width: 100%;
    height: auto;
}

/* Smooth transition for mobile */
[id^="content-"] {
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Initial state: Puro bondho thakbe */
[id^="content-"] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Admission Page */
 /* Normal Web View Styles */
        .step-content.hidden { display: none; }
        
        /* Print Logic: Force All Steps to Show */
        @media print {
            body { background: white !important; margin: 0; padding: 0; }
            /* Hide Nav, Footer, Buttons, and Shadow backgrounds */
            nav, footer, .glow-area, #canvas, .print\:hidden, button, .bg-slate-50 { 
                display: none !important; 
            }
            
            /* Reset Container for Print */
            #admission-printable { 
                width: 100% !important; 
                max-width: 100% !important; 
                border: none !important; 
                padding: 0 !important; 
                margin: 0 !important;
                background: white !important;
                position: relative !important;
                display: block !important;
            }

            /* FORCE ALL STEPS TO SHOW ON PRINT */
            .step-content { 
                display: block !important; 
                visibility: visible !important; 
                opacity: 1 !important;
                margin-bottom: 2rem !important;
            }

            /* Signature area alignment */
            .signature-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 50px !important; }
            
            /* Input fields styling for print */
            input, select { 
                border: none !important; 
                border-bottom: 1px solid #000 !important; 
                background: transparent !important;
            }
        }
/* End */