*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Poppins',sans-serif;
}

body{
background:#f5f7fb;
}

.navbar{

display:flex;

justify-content:space-between;

align-items:center;

padding:20px 8%;

background:#0b1f3a;

}

.logo{

display:flex;

align-items:center;

gap:12px;

color:white;

}

.logo i{

font-size:35px;

color:#FFD700;

}

.logo h2{

font-size:24px;

font-weight:700;

}

.nav-links{

display:flex;

list-style:none;

gap:30px;

}

.nav-links a{

text-decoration:none;

color:white;

font-size:17px;

font-weight:500;

transition:.3s;

}

.nav-links a:hover{

color:#00d9ff;

}

.navbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:15px 6%;
    background:#0b1f3a;
}

.logo{
    display:flex;
    align-items:center;
    gap:10px;
}

.logo i{
    font-size:32px;
    color:#FFD700;
}

.logo h2{
    font-size:22px;
    font-weight:700;
    color:#fff;
    line-height:1.2;
}

.nav-links{
    display:flex;
    gap:22px;
    list-style:none;
    align-items:center;
}

.nav-links a{
    color:#fff;
    text-decoration:none;
    font-size:16px;
    font-weight:500;
}

.apply-btn{
    padding:10px 20px;
    font-size:15px;
    font-weight:600;
    border:none;
    border-radius:25px;
    background:#00d9ff;
    color:#fff;
    cursor:pointer;
    min-width:120px;
    height:42px;
}

.hero-description{

    max-width:700px;

    margin:35px auto 60px;

    font-size:18px;

    line-height:2;

    color:#f5f5f5;

    text-align:center;

}
.hero-buttons{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:30px;

    margin-top:10px;

    margin-bottom:80px;

}.hero-content{

    position:relative;

    z-index:10;

    max-width:850px;

    text-align:center;

    color:white;

}
.hero{
    position: relative;
    min-height: calc(100vh - 80px);

    background-image:
    linear-gradient(rgba(7,18,45,0.65),rgba(7,18,45,0.65)),
    url("hero-bg.jpg");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    padding:80px 8%;

    color:white;
}
.hero h1{

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

    font-size:68px;

    font-weight:900;

    line-height:1.15;

    letter-spacing:-2px;

    text-shadow:
        0 8px 25px rgba(0,0,0,.45);

    margin-bottom:20px;

}
.hero h1 span{

    background:linear-gradient(90deg,#00d9ff,#64ffda);

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

}
.hero h3{

    font-size:30px;

    font-weight:600;

    color:#ffffff;

    margin-top:10px;

    margin-bottom:25px;

}
.btn-primary{

padding:18px 45px;

background:#00D9FF;

color:#fff;

font-size:18px;

font-weight:600;

border-radius:50px;

transition:.4s;

}

.btn-primary:hover{

background:#fff;

color:#0B1F3A;

transform:translateY(-8px);

}

.btn-secondary{

padding:18px 45px;

border:2px solid white;

color:white;

font-size:18px;

font-weight:600;

border-radius:50px;

transition:.4s;

}

.btn-secondary:hover{

background:white;

color:#0B1F3A;

}.hero-stats{

position:absolute;

bottom:40px;

display:flex;

gap:30px;

z-index:20;

flex-wrap:wrap;

justify-content:center;

}

.stat-box{

width:180px;

padding:25px;

background:rgba(255,255,255,.12);

backdrop-filter:blur(15px);

border-radius:20px;

border:1px solid rgba(255,255,255,.2);

transition:.4s;

}

.stat-box:hover{

transform:translateY(-10px);

background:rgba(0,217,255,.20);

}

.stat-box h2{

font-size:35px;

color:#00D9FF;

margin-bottom:10px;

}

.stat-box p{

color:white;

font-size:18px;

}
.hero-content{

    position:relative;

    z-index:10;

    max-width:900px;

    text-align:center;

    color:#fff;

}overflow-x:hidden;
/*=========================================
            ABOUT SECTION
=========================================*/

.about{

    width:100%;

    padding:120px 8%;

    background:#ffffff;

}

.about-container{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.about-image{

    position:relative;

}

.about-image img{

    width:100%;

    border-radius:25px;

    object-fit:cover;

    box-shadow:0 20px 60px rgba(0,0,0,.15);

    transition:.5s;

}

.about-image img:hover{

    transform:scale(1.03);

}

.about-content{

    display:flex;

    flex-direction:column;

}
.section-tag{

    color:#00bfff;

    font-size:16px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-bottom:20px;

}

.about-content h2{

    font-size:48px;

    font-weight:800;

    color:#0b1f3a;

    line-height:1.3;

    margin-bottom:25px;

}

.about-content p{

    font-size:18px;

    line-height:1.9;

    color:#555;

    margin-bottom:40px;

}
.about-features{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;

    margin-bottom:45px;

}

.feature-card{

    background:#f5f8ff;

    padding:30px;

    border-radius:20px;

    text-align:center;

    transition:.4s;

    border:1px solid #e5e5e5;

}

.feature-card:hover{

    background:#00d9ff;

    color:white;

    transform:translateY(-10px);

}

.feature-card i{

    font-size:40px;

    color:#00bfff;

    margin-bottom:15px;

}

.feature-card:hover i{

    color:white;

}

.feature-card h4{

    font-size:20px;

    font-weight:700;

}.about-btn{

    display:inline-block;

    width:200px;

    text-align:center;

    padding:18px 40px;

    border-radius:50px;

    background:#00d9ff;

    color:white;

    text-decoration:none;

    font-size:18px;

    font-weight:600;

    transition:.4s;

}

.about-btn:hover{

    background:#0b1f3a;

    transform:translateY(-6px);

}
/*=========================================
        EXPERIENCE CARD
=========================================*/

.experience-card{

    position:absolute;

    bottom:-30px;

    right:-30px;

    width:220px;

    background:#00d9ff;

    color:white;

    padding:30px;

    border-radius:20px;

    text-align:center;

    box-shadow:0 20px 50px rgba(0,0,0,.25);

    animation:floatCard 3s ease-in-out infinite;

}

.experience-card h2{

    font-size:55px;

    font-weight:800;

}

.experience-card p{

    font-size:17px;

    margin-top:10px;

    line-height:1.6;

}

@keyframes floatCard{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-12px);

}

100%{

transform:translateY(0px);

}

}
/*=========================================
VISION & MISSION
=========================================*/

.vision-mission{

display:flex;

gap:25px;

margin-top:60px;

}

.vm-box{

flex:1;

padding:35px;

background:white;

border-radius:20px;

box-shadow:0 10px 35px rgba(0,0,0,.08);

transition:.4s;

}

.vm-box:hover{

transform:translateY(-10px);

background:#00d9ff;

color:white;

}

.vm-box i{

font-size:45px;

color:#00bfff;

margin-bottom:20px;

}

.vm-box:hover i{

color:white;

}

.vm-box h3{

font-size:28px;

margin-bottom:18px;

}

.vm-box p{

font-size:17px;

line-height:1.8;

}
/*=========================================
        DEPARTMENTS SECTION
=========================================*/

.departments{

    padding:120px 8%;

    background:#f5f8fc;

}

.section-title{

    text-align:center;

    max-width:850px;

    margin:0 auto 70px;

}

.section-title span{

    color:#00bfff;

    font-size:16px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

}

.section-title h2{

    font-size:50px;

    color:#0b1f3a;

    margin:18px 0;

    font-weight:800;

}

.section-title p{

    font-size:18px;

    color:#666;

    line-height:1.8;

}

.department-container{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(340px,1fr));

    gap:35px;

}.department-card i{

    width:90px;

    height:90px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#eaf9ff;

    color:#00bfff;

    font-size:40px;

    margin-bottom:25px;

    transition:.4s;

}

.department-card:hover i{

    background:#00bfff;

    color:white;

    transform:rotate(360deg);

}

.department-card h3{

    font-size:28px;

    color:#0b1f3a;

    margin-bottom:18px;

}

.department-card p{

    color:#666;

    line-height:1.9;

    margin-bottom:30px;

    font-size:17px;

}
.department-info{

    display:flex;

    justify-content:space-between;

    padding-top:20px;

    border-top:1px solid #e5e5e5;

}

.department-info span{

    font-weight:600;

    color:#00bfff;

    font-size:15px;

}
/*=========================================
        PLACEMENT SECTION
=========================================*/

.placement{

    padding:120px 8%;

    background:linear-gradient(135deg,#071c3d,#0b2d63);

    color:#fff;

}

.placement-title{

    text-align:center;

    max-width:850px;

    margin:0 auto 70px;

}

.placement-title span{

    color:#00d9ff;

    font-size:16px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

}

.placement-title h2{

    font-size:52px;

    font-weight:800;

    margin:20px 0;

}

.placement-title p{

    font-size:18px;

    line-height:1.9;

    color:#d9e7ff;

}

.placement-container{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

    gap:35px;

}

.placement-card{

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(15px);

    border:1px solid rgba(255,255,255,.15);

    border-radius:25px;

    padding:40px 30px;

    text-align:center;

    transition:.45s;

    box-shadow:0 15px 40px rgba(0,0,0,.20);

}

.placement-card:hover{

    transform:translateY(-15px);

    background:rgba(0,217,255,.18);

}

.placement-card i{

    width:90px;

    height:90px;

    margin:auto;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#00d9ff;

    color:white;

    font-size:40px;

    margin-bottom:25px;

    transition:.4s;

}

.placement-card:hover i{

    transform:rotate(360deg) scale(1.1);

}

.placement-card h2{

    font-size:48px;

    color:#00d9ff;

    margin-bottom:15px;

    font-weight:800;

}

.placement-card h4{

    font-size:24px;

    margin-bottom:18px;

}

.placement-card p{

    color:#dbe6ff;

    line-height:1.8;

    font-size:17px;

}
/*=========================================
        TOP RECRUITERS
=========================================*/

.recruiters{

    padding:100px 8%;

    background:#ffffff;

}

.logo-slider{

    overflow:hidden;

    position:relative;

    margin-top:50px;

}

.logo-track{

    display:flex;

    gap:60px;

    width:max-content;

    animation:scrollLogos 30s linear infinite;

}

.logo-track img{

    width:140px;

    height:70px;

    object-fit:contain;

    filter:grayscale(100%);

    transition:.4s;

}

.logo-track img:hover{

    filter:grayscale(0);

    transform:scale(1.15);

}

@keyframes scrollLogos{

0%{

transform:translateX(0);

}

100%{

transform:translateX(-50%);

}

}
/*=========================================
        AI ASSISTANT
=========================================*/

.ai-button{

position:fixed;

bottom:35px;

right:35px;

width:75px;

height:75px;

border:none;

border-radius:50%;

background:#00d9ff;

color:white;

font-size:32px;

cursor:pointer;

box-shadow:0 15px 35px rgba(0,0,0,.3);

z-index:9999;

transition:.4s;

}

.ai-button:hover{

transform:scale(1.1);

}

.ai-chat-box{

position:fixed;

bottom:125px;

right:35px;

width:360px;

background:white;

border-radius:20px;

box-shadow:0 20px 60px rgba(0,0,0,.25);

display:none;

overflow:hidden;

z-index:9999;

}

.chat-header{

background:#0b1f3a;

color:white;

padding:18px;

display:flex;

align-items:center;

gap:12px;

}

.chat-body{

padding:20px;

max-height:250px;

overflow-y:auto;

}

.bot-message{

background:#eef7ff;

padding:12px;

margin-bottom:12px;

border-radius:12px;

}

.chat-options{

padding:18px;

display:grid;

gap:10px;

}

.chat-options button{

padding:12px;

border:none;

border-radius:10px;

background:#00d9ff;

color:white;

cursor:pointer;

font-size:15px;

transition:.3s;

}

.chat-options button:hover{

background:#0b1f3a;

}
/*=========================================
        DARK MODE & MOBILE MENU
=========================================*/

.theme-toggle,
.menu-toggle{

    width:50px;
    height:50px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#00d9ff;

    color:white;

    font-size:22px;

    cursor:pointer;

    transition:.4s;

    margin-left:15px;

}

.theme-toggle:hover,
.menu-toggle:hover{

    transform:rotate(360deg);

    background:#0b1f3a;

}

body.dark{

    background:#0b1220;

    color:white;

}

body.dark .about,
body.dark .departments,
body.dark .recruiters{

    background:#111827;

}

body.dark .department-card,
body.dark .feature-card,
body.dark .vm-box{

    background:#1f2937;

    color:white;

}

body.dark .section-title h2,
body.dark .about-content h2{

    color:white;

}

body.dark p{

    color:#d1d5db;

}
@media(max-width:991px){

.nav-links{

display:none;

}

.menu-toggle{

display:flex;

}

.logo h2{

font-size:18px;

}

}
html{

scroll-behavior:smooth;

}.about-description{

margin-top:30px;

line-height:1.9;

font-size:17px;

color:#555;

text-align:justify;

}

.about-description p{

margin-bottom:20px;

}.section-title{

text-align:center;

margin-bottom:60px;

}

.section-title span{

color:#00d9ff;

font-size:18px;

font-weight:700;

letter-spacing:3px;

text-transform:uppercase;

}

.section-title h2{

font-size:46px;

margin:20px 0;

font-weight:800;

color:#0b1f3a;

}

.section-title p{

max-width:850px;

margin:auto;

font-size:19px;

line-height:1.8;

color:#666;

}

.about-description{

max-width:1100px;

margin:50px auto;

text-align:center;

font-size:18px;

line-height:2;

color:#555;

}

.about-description p{

margin-bottom:25px;

}

.mission-vision{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(350px,1fr));

gap:30px;

margin-top:60px;

}

.vm-box{

padding:40px;

border-radius:18px;

background:white;

box-shadow:0 10px 30px rgba(0,0,0,.08);

transition:.4s;

text-align:center;

}

.vm-box:hover{

transform:translateY(-10px);

}

.vm-box h3{

font-size:28px;

margin-bottom:20px;

color:#0b1f3a;

}

.vm-box p{

line-height:1.9;

font-size:17px;

color:#666;

}
.admissions{
padding:100px 8%;
background:#f8fbff;
}

.admission-stats{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:25px;
margin-top:50px;
}

.stat-card{
background:#fff;
padding:35px;
border-radius:15px;
text-align:center;
box-shadow:0 10px 30px rgba(0,0,0,.08);
transition:.4s;
}

.stat-card:hover{
transform:translateY(-10px);
}

.stat-card h3{
font-size:45px;
margin-bottom:15px;
}

.stat-card h2{
font-size:34px;
color:#0b1f3a;
margin-bottom:10px;
}

.stat-card p{
font-size:17px;
color:#666;
}

.admission-process{
margin-top:70px;
text-align:center;
}

.admission-process h2{
margin-bottom:35px;
}

.steps{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:20px;
}

.steps div{
background:#0b1f3a;
color:white;
padding:25px;
border-radius:12px;
font-weight:600;
}

.admission-features{
margin-top:70px;
}

.admission-features h2{
text-align:center;
margin-bottom:25px;
}

.admission-features ul{
max-width:700px;
margin:auto;
line-height:2.2;
font-size:18px;
list-style:none;
}

.admission-contact{
margin-top:60px;
text-align:center;
}

.admission-contact h2{
margin-bottom:20px;
}

.admission-contact p{
font-size:18px;
margin:10px 0;
}
/*=========================
      GALLERY
==========================*/

.gallery{

padding:100px 8%;

background:#f8fbff;

}

.gallery-container{

display:grid;

grid-template-columns:repeat(3,1fr);

grid-auto-rows:250px;

gap:20px;

margin-top:60px;

}

.gallery-item{

position:relative;

overflow:hidden;

border-radius:18px;

cursor:pointer;

box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.gallery-item img{

width:100%;

height:100%;

object-fit:cover;

transition:.6s;

}

.gallery-item:hover img{

transform:scale(1.12);

}

.gallery-item.big{

grid-column:span 2;

grid-row:span 2;

}

.gallery-item.wide{

grid-column:span 2;

}

.overlay{

position:absolute;

left:0;

bottom:0;

width:100%;

padding:25px;

background:linear-gradient(to top,rgba(0,0,0,.85),transparent);

color:#fff;

opacity:0;

transition:.5s;

}

.gallery-item:hover .overlay{

opacity:1;

}

.overlay h3{

font-size:24px;

margin-bottom:8px;

}

.overlay p{

font-size:15px;

}

@media(max-width:992px){

.gallery-container{

grid-template-columns:repeat(2,1fr);

}

.gallery-item.big,

.gallery-item.wide{

grid-column:span 2;

}

}

@media(max-width:768px){

.gallery-container{

grid-template-columns:1fr;

}

.gallery-item.big,

.gallery-item.wide{

grid-column:span 1;

grid-row:span 1;

}

}
/*=========================
      CONTACT
=========================*/

.contact{

padding:100px 8%;

background:#ffffff;

}

.contact-container{

display:grid;

grid-template-columns:1fr 1fr;

gap:50px;

margin-top:50px;

align-items:center;

}

.contact-info{

background:#0b1f3a;

color:white;

padding:40px;

border-radius:20px;

}

.contact-info h3{

margin-top:25px;

margin-bottom:10px;

font-size:24px;

color:#00d9ff;

}

.contact-info p{

line-height:1.8;

font-size:17px;

}

.contact-form{

background:#f7f9fc;

padding:40px;

border-radius:20px;

box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.contact-form input,

.contact-form textarea{

width:100%;

padding:16px;

margin-bottom:20px;

border:1px solid #ddd;

border-radius:10px;

font-size:16px;

outline:none;

}

.contact-form input:focus,

.contact-form textarea:focus{

border-color:#00d9ff;

}

.contact-form button{

width:100%;

padding:16px;

background:#00d9ff;

color:white;

border:none;

font-size:18px;

font-weight:600;

border-radius:10px;

cursor:pointer;

transition:.3s;

}

.contact-form button:hover{

background:#0b1f3a;

}
/*=========================
        FOOTER
=========================*/

footer{

background:#0b1f3a;

color:white;

padding:60px 8% 20px;

}

.footer-content{

display:grid;

grid-template-columns:2fr 1fr 1fr;

gap:40px;

margin-bottom:30px;

}

.footer-content h2,

.footer-content h3{

margin-bottom:20px;

}

.footer-content p,

.footer-content li{

margin-bottom:12px;

color:#ddd;

}

.footer-content ul{

list-style:none;

padding:0;

}

.footer-content a{

color:#ddd;

text-decoration:none;

}

.footer-content a:hover{

color:#00d9ff;

}

footer hr{

margin:30px 0;

border:1px solid rgba(255,255,255,.2);

}

.copyright{

text-align:center;

font-size:15px;

color:#bbb;

}
/* ==========================================
   EXPLORE PAGE - HERO
========================================== */

.course-hero{
    width:100%;
    min-height:90vh;
    background:linear-gradient(rgba(6,20,45,.75),rgba(6,20,45,.75)),
    url("../images/hero.jpg");
    background-size:cover;
    background-position:center;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    padding:80px 8%;
}

.hero-content{
    max-width:900px;
}

.hero-content h1{
    font-size:65px;
    color:#fff;
    font-weight:800;
    line-height:1.2;
    margin-bottom:25px;
}

.hero-content p{
    color:#f5f5f5;
    font-size:22px;
    line-height:1.8;
    margin-bottom:40px;
}

.hero-buttons{
    display:flex;
    justify-content:center;
    gap:20px;
    flex-wrap:wrap;
}

.hero-btn{
    padding:16px 38px;
    background:#00c6ff;
    color:#fff;
    text-decoration:none;
    border-radius:50px;
    font-size:18px;
    font-weight:600;
    transition:.4s;
}

.hero-btn:hover{
    background:#fff;
    color:#0b1f3a;
}

.outline-btn{
    background:transparent;
    border:2px solid #fff;
}

.outline-btn:hover{
    background:#fff;
}

/* ==========================================
   WHY CHOOSE ASPIRE
========================================== */

.why-aspire{
    padding:100px 8%;
    background:#f8fbff;
    text-align:center;
}

.why-aspire h2{
    font-size:42px;
    color:#0b1f3a;
    margin-bottom:60px;
}

.why-container{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:30px;
}

.why-card{
    background:#fff;
    padding:35px;
    border-radius:18px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    transition:.4s;
}

.why-card:hover{
    transform:translateY(-10px);
}

.why-card i{
    font-size:50px;
    color:#00c6ff;
    margin-bottom:20px;
}

.why-card h3{
    font-size:24px;
    color:#0b1f3a;
    margin-bottom:15px;
}

.why-card p{
    color:#666;
    line-height:1.8;
}

/* ==========================================
   COURSES
========================================== */

.courses{
    padding:100px 8%;
    background:#fff;
}

.courses h2{
    text-align:center;
    font-size:42px;
    color:#0b1f3a;
    margin-bottom:60px;
}

.course-container{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
    gap:35px;
}
/*=====================================
        COURSE CARDS
=====================================*/

.course-card{

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:0 10px 25px rgba(0,0,0,.12);

    transition:.4s;

    display:flex;

    flex-direction:column;

    height:100%;

}

.course-card:hover{

    transform:translateY(-12px);

    box-shadow:0 20px 40px rgba(0,0,0,.18);

}

.course-card img{

    width:100%;

    height:240px;

    object-fit:cover;

    display:block;

}

.course-details{

    padding:25px;

    display:flex;

    flex-direction:column;

    flex:1;

}

.course-details h3{

    font-size:28px;

    color:#0b1f3a;

    margin-bottom:18px;

    line-height:1.4;

    min-height:80px;

}

.course-details p{

    color:#666;

    font-size:16px;

    line-height:1.8;

    text-align:justify;

    margin-bottom:20px;

    min-height:110px;

}

.course-info{

    display:flex;

    justify-content:space-between;

    margin-bottom:25px;

    font-size:16px;

    font-weight:600;

    color:#0b1f3a;

}

.apply-course-btn{

    text-decoration:none;

    text-align:center;

    background:#00bfff;

    color:#fff;

    padding:14px;

    border-radius:12px;

    font-size:18px;

    font-weight:600;

    transition:.4s;

    margin-top:auto;

}

.apply-course-btn:hover{

    background:#0b1f3a;

    color:#fff;

}
/*====================================
      COURSE HIGHLIGHTS
=====================================*/

.highlights{

padding:100px 8%;

background:#eef6ff;

text-align:center;

}

.highlights h2{

font-size:45px;

color:#0b1f3a;

margin-bottom:20px;

}

.highlight-text{

max-width:800px;

margin:auto;

font-size:18px;

line-height:1.8;

color:#666;

margin-bottom:60px;

}

.highlight-container{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

gap:30px;

}

.highlight-card{

background:white;

padding:40px;

border-radius:20px;

box-shadow:0 10px 25px rgba(0,0,0,.10);

transition:.4s;

}

.highlight-card:hover{

transform:translateY(-10px);

background:#0b1f3a;

color:white;

}

.highlight-card h1{

font-size:42px;

color:#00bfff;

margin-bottom:15px;

}

.highlight-card:hover h1{

color:#FFD700;

}

.highlight-card p{

font-size:18px;

font-weight:600;

}
/*=====================================
      ELIGIBILITY
======================================*/

.eligibility{
    padding:100px 8%;
    background:#ffffff;
    text-align:center;
}

.eligibility h2{
    font-size:45px;
    color:#0b1f3a;
    margin-bottom:20px;
}

.eligibility-text{
    max-width:850px;
    margin:auto;
    font-size:18px;
    color:#666;
    line-height:1.8;
    margin-bottom:60px;
}

.eligibility-container{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:30px;
}

.eligibility-card{
    background:#f8fbff;
    padding:35px;
    border-radius:20px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    transition:.4s;
}

.eligibility-card:hover{
    transform:translateY(-10px);
    background:#0b1f3a;
    color:white;
}

.eligibility-card i{
    font-size:55px;
    color:#00bfff;
    margin-bottom:20px;
}

.eligibility-card:hover i{
    color:#FFD700;
}

.eligibility-card h3{
    margin-bottom:15px;
    font-size:24px;
}

.eligibility-card p{
    line-height:1.8;
    font-size:16px;
}
/*=====================================
      TESTIMONIALS
======================================*/

.testimonials{
    padding:100px 8%;
    background:#eef6ff;
    text-align:center;
}

.testimonials h2{
    font-size:45px;
    color:#0b1f3a;
    margin-bottom:20px;
}

.testimonial-text{
    max-width:800px;
    margin:auto;
    color:#666;
    font-size:18px;
    line-height:1.8;
    margin-bottom:60px;
}

.testimonial-container{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:35px;
}

.testimonial-card{
    background:#fff;
    padding:35px;
    border-radius:20px;
    box-shadow:0 10px 25px rgba(0,0,0,.10);
    transition:.4s;
}

.testimonial-card:hover{
    transform:translateY(-10px);
}

.testimonial-card img{
    width:120px;
    height:120px;
    border-radius:50%;
    object-fit:cover;
    margin-bottom:20px;
    border:5px solid #00bfff;
}

.testimonial-card h3{
    color:#0b1f3a;
    margin-bottom:8px;
    font-size:24px;
}

.testimonial-card span{
    color:#00bfff;
    font-weight:600;
    display:block;
    margin-bottom:20px;
}

.testimonial-card p{
    color:#555;
    line-height:1.8;
    margin-bottom:20px;
}

.stars{
    font-size:24px;
}
/*=====================================
        CTA SECTION
======================================*/

.cta-section{

padding:90px 8%;

background:linear-gradient(135deg,#0b1f3a,#0088cc);

text-align:center;

color:white;

}

.cta-content{

max-width:900px;

margin:auto;

}

.cta-content h2{

font-size:48px;

margin-bottom:20px;

}

.cta-content p{

font-size:20px;

line-height:1.8;

margin-bottom:40px;

}

.cta-btn{

display:inline-block;

padding:18px 45px;

background:white;

color:#0b1f3a;

text-decoration:none;

font-size:20px;

font-weight:bold;

border-radius:50px;

transition:.4s;

}

.cta-btn:hover{

background:#FFD700;

transform:scale(1.05);

}

/*=====================================
            FOOTER
======================================*/

footer{

background:#08182f;

color:white;

padding:70px 8% 30px;

}

.footer-container{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

gap:40px;

margin-bottom:40px;

}

.footer-box h3{

margin-bottom:20px;

font-size:24px;

color:#FFD700;

}

.footer-box p{

line-height:1.8;

color:#ddd;

}

.footer-box ul{

list-style:none;

}

.footer-box ul li{

margin:12px 0;

color:#ddd;

}

.footer-box ul li a{

text-decoration:none;

color:#ddd;

transition:.3s;

}

.footer-box ul li a:hover{

color:#00c6ff;

padding-left:8px;

}

footer hr{

margin:30px 0;

border:.5px solid rgba(255,255,255,.2);

}

.copyright{

text-align:center;

font-size:16px;

color:#ccc;

}
.course-card img{

    width:100%;

    height:300px;

    object-fit:contain;

    background:#f5f5f5;

    padding:10px;

    display:block;

}.course-card img{

    width:100%;

    height:280px;

    object-fit:contain;

    background:linear-gradient(to bottom,#f8fbff,#eef5ff);

    padding:20px;

    display:block;

}
/*=====================================
        APPLY PAGE
======================================*/

.apply-hero{
    background:linear-gradient(135deg,#0b1f3a,#0088cc);
    color:#fff;
    text-align:center;
    padding:80px 20px;
}

.apply-hero h1{
    font-size:48px;
    margin-bottom:15px;
    font-weight:700;
}

.apply-hero p{
    font-size:20px;
    opacity:.95;
}

.application{
    background:#f4f8fc;
    padding:70px 8%;
}

.application-box{
    max-width:1100px;
    margin:auto;
    background:#fff;
    padding:50px;
    border-radius:20px;
    box-shadow:0 15px 40px rgba(0,0,0,.12);
}

.application-box h2{
    text-align:center;
    color:#0b1f3a;
    font-size:36px;
    margin-bottom:10px;
}

.application-box>p{
    text-align:center;
    color:#666;
    margin-bottom:40px;
}

.application-box h3{
    margin-top:40px;
    margin-bottom:20px;
    color:#0b1f3a;
    border-left:6px solid #00bfff;
    padding-left:15px;
    font-size:26px;
}

.form-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:25px;
}

.form-grid div{
    display:flex;
    flex-direction:column;
}

.form-grid label{
    margin-bottom:8px;
    font-weight:600;
    color:#333;
}

.form-grid input,
.form-grid select,
.form-grid textarea{
    padding:15px;
    border:1px solid #d6d6d6;
    border-radius:10px;
    font-size:16px;
    outline:none;
    transition:.3s;
}

.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus{
    border-color:#00bfff;
    box-shadow:0 0 10px rgba(0,191,255,.25);
}

textarea{
    resize:vertical;
}

input[type=file]{
    padding:10px;
    background:#f8f8f8;
}

.declaration{
    margin-top:40px;
    background:#eef8ff;
    padding:20px;
    border-radius:10px;
    font-size:17px;
}

.declaration input{
    margin-right:10px;
}

.button-group{
    display:flex;
    justify-content:center;
    gap:20px;
    margin-top:40px;
}

.submit-btn,
.reset-btn{
    border:none;
    padding:16px 40px;
    border-radius:50px;
    font-size:18px;
    font-weight:600;
    cursor:pointer;
    transition:.3s;
}

.submit-btn{
    background:#00bfff;
    color:#fff;
}

.submit-btn:hover{
    background:#0b1f3a;
    transform:translateY(-3px);
}

.reset-btn{
    background:#ddd;
    color:#333;
}

.reset-btn:hover{
    background:#999;
    color:#fff;
}

@media(max-width:768px){

.form-grid{
    grid-template-columns:1fr;
}

.application-box{
    padding:30px 20px;
}

.apply-hero h1{
    font-size:34px;
}

.application-box h2{
    font-size:28px;
}

.button-group{
    flex-direction:column;
}

.submit-btn,
.reset-btn{
    width:100%;
}

}
/* ==========================
      DARK MODE
========================== */

.theme-btn{
    width:45px;
    height:45px;
    border:none;
    border-radius:50%;
    background:#ffffff;
    color:#0b1f3a;
    font-size:20px;
    cursor:pointer;
    margin-left:15px;
    transition:.3s;
}

.theme-btn:hover{
    transform:scale(1.1);
}

/* Dark Mode */

.dark-mode{
    background:#121212;
    color:#f5f5f5;
}

.dark-mode section{
    background:#1a1a1a !important;
    color:#f5f5f5;
}

.dark-mode .application-box,
.dark-mode .course-card,
.dark-mode .gallery-card,
.dark-mode .testimonial-card,
.dark-mode .eligibility-card,
.dark-mode .admission-card{
    background:#242424;
    color:white;
}

.dark-mode h1,
.dark-mode h2,
.dark-mode h3,
.dark-mode p,
.dark-mode label{
    color:white;
}

.dark-mode input,
.dark-mode select,
.dark-mode textarea{
    background:#2f2f2f;
    color:white;
    border:1px solid #555;
}

.dark-mode footer{
    background:#000;
}
.navbar{

    position: fixed;
    top: 0;
    left: 0;
    width: 100%;

    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 20px 8%;

    background: #0b1f3a;

    z-index: 1000;

    box-shadow: 0 5px 15px rgba(0,0,0,.2);

}body{

    background:#f5f7fb;

    padding-top:90px;

}.navbar{

    position:fixed;
    top:0;
    left:0;
    width:100%;

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:20px 8%;

    background:rgba(11,31,58,.95);

    backdrop-filter:blur(10px);

    z-index:1000;

    box-shadow:0 5px 20px rgba(0,0,0,.25);

}