/*==================================================
BITS Admission Landing Page
Author : ChatGPT
===================================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Poppins',sans-serif;
    color:#333;
    background:#f8f9fa;
    overflow-x:hidden;
}

/*==================================
Navbar
==================================*/

.navbar{
    transition:.4s;
    padding:15px 0;
    background:rgba(8,37,84,.25);
    backdrop-filter:blur(10px);
}

.navbar.scrolled{
    background:#082554;
    box-shadow:0 5px 20px rgba(0,0,0,.15);
}

.navbar-brand{
    font-size:28px;
    font-weight:700;
    letter-spacing:.5px;
}

.nav-link{
    color:#fff !important;
    margin-left:20px;
    font-weight:500;
    transition:.3s;
}

.nav-link:hover{
    color:#ffc107 !important;
}
.nav-link.active{
    color:#ffc107 !important;
    font-weight:600;
}
/*==================================
Hero
==================================*/

.hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    background:url("../images/hero.jpg") center center/cover no-repeat;
}

.overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        rgba(8,37,84,.88),
        rgba(8,37,84,.70)
    );
}

.hero .container{
    position:relative;
    z-index:2;
}

.hero h1{
    font-weight:800;
    line-height:1.1;
}

.hero p{
    font-size:18px;
}

.hero-feature{
    color:#fff;
    margin-bottom:18px;
    font-size:17px;
}

.hero-feature i{
    color:#ffc107;
    margin-right:10px;
}

/*==================================
Admission Form
==================================*/

.admission-form{

    background:#fff;
    border-radius:20px;
    padding:35px;
    box-shadow:0 15px 45px rgba(0,0,0,.18);

}

.admission-form h3{

    font-weight:700;
    color:#082554;

}

.form-control,
.form-select{

    height:52px;
    border-radius:10px;
    border:1px solid #ddd;

}

.form-control:focus,
.form-select:focus{

    border-color:#0d6efd;
    box-shadow:0 0 0 .15rem rgba(13,110,253,.15);

}

.btn-warning{

    border-radius:10px;
    padding:13px;
    font-weight:600;
    transition:.3s;

}

.btn-warning:hover{

    transform:translateY(-2px);

}

/*==================================
Section
==================================*/

section{

    padding:80px 0;

}

.section-title{

    font-weight:700;
    color:#082554;
    margin-bottom:25px;

}

/*==================================
Counter
==================================*/

.counter-box{

    background:#fff;
    padding:30px;
    border-radius:15px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.3s;
    height:100%;

}

.counter-box:hover{

    transform:translateY(-8px);

}

.counter-box h2{

    color:#0d6efd;
    font-size:42px;
    font-weight:700;

}

.counter-box p{

    margin-top:10px;
    margin-bottom:0;
}

/*==================================
Courses
==================================*/

.course-card{

    background:#fff;
    border-radius:18px;
    padding:35px 20px;
    text-align:center;
    transition:.35s;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    height:100%;

}

.course-card:hover{

    transform:translateY(-10px);
    background:#082554;
    color:#fff;

}

.course-card i{

    font-size:45px;
    color:#0d6efd;
    margin-bottom:20px;
    display:block;

}

.course-card:hover i{

    color:#ffc107;

}

/*==================================
Why Choose
==================================*/

.why-box{

    background:#fff;
    padding:35px;
    border-radius:18px;
    text-align:center;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    transition:.3s;
    height:100%;

}

.why-box:hover{

    transform:translateY(-8px);

}

.why-box i{

    font-size:55px;
    color:#0d6efd;
    margin-bottom:20px;

}

.why-box h5{

    color:#082554;
    font-weight:700;
    margin-bottom:15px;

}

/*==================================
Footer
==================================*/

.footer{

    background:#082554;
    color:#fff;

}

.footer h3{

    font-weight:700;

}

.footer p{

    margin-bottom:8px;

}

.footer a{

    text-decoration:none;

}

/*==================================
Buttons
==================================*/

.btn-primary{

    background:#082554;
    border:none;

}

.btn-primary:hover{

    background:#0b3d91;

}

/*==================================
Floating WhatsApp
==================================*/

.whatsapp{

    position:fixed;
    right:20px;
    bottom:20px;
    width:60px;
    height:60px;
    border-radius:50%;
    background:#25D366;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:30px;
    text-decoration:none;
    box-shadow:0 10px 25px rgba(0,0,0,.25);
    z-index:999;

}

.whatsapp:hover{

    color:#fff;
    transform:scale(1.08);

}

/*==================================
Back to Top
==================================*/

#topBtn{

    position:fixed;
    right:20px;
    bottom:95px;
    display:none;
    width:50px;
    height:50px;
    border:none;
    border-radius:50%;
    background:#082554;
    color:#fff;
    z-index:999;

}

/*==================================
Responsive
==================================*/

@media(max-width:991px){

.hero{

    text-align:center;
    padding-top:120px;

}

.hero h1{

    font-size:42px;

}

.admission-form{

    margin-top:40px;

}

.nav-link{

    margin-left:0;
    padding:12px 0;

}

}

@media(max-width:767px){

.hero{

    min-height:auto;
    padding:120px 0 60px;

}

.hero h1{

    font-size:34px;

}

.display-3{

    font-size:2.4rem;

}

section{

    padding:60px 0;

}

.counter-box{

    margin-bottom:20px;

}

.course-card{

    padding:25px;

}

.why-box{

    margin-bottom:20px;

}

}

@media(max-width:576px){

.admission-form{

    padding:25px;

}

.navbar-brand{

    font-size:22px;

}

.hero p{

    font-size:16px;

}

.btn-lg{

    font-size:16px;

}


}

.course-card{

    background:#fff;
    border-radius:18px;
    padding:35px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.35s;
    border-top:5px solid #0A2A66;

}

.course-card:hover{

    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(0,0,0,.15);

}

.course-card i{

    font-size:55px;
    color:#0A2A66;
    margin-bottom:20px;
    display:block;

}

.course-card h4{

    font-weight:700;
    margin-bottom:20px;
    color:#0A2A66;

}

.course-list{

    list-style:none;
    padding:0;
    margin:0;

}

.course-list li{

    padding:8px 0;
    border-bottom:1px dashed #ddd;
    font-size:15px;

}

.course-list li:last-child{

    border-bottom:none;

}