/*==================================================
  BITS Website - Main Stylesheet
  Version : 1.0
  Framework : Bootstrap 5.3
==================================================*/


/************************************************* BITS PREMIUM MEGA
MENU CSS *************************************************/

:root{ –primary:#0A3D91; –secondary:#FDB913; –dark:#08142d; –white:#fff;
–transition:.35s ease; }


.course-item{ background:rgba(255,255,255,.08); color:#fff; padding:12px
18px; margin-bottom:12px; border-radius:10px; transition:.3s; }

.course-item:hover{ background:var(–secondary); color:#000;
transform:translateX(10px); }

.btn-warning{ background:var(–secondary); border:none;
border-radius:30px; font-weight:700; }

.btn-primary{ border-radius:30px;
background-color:#ffc107}



*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    font-family:'Poppins',sans-serif;
    color:var(--text);
    background:#fff;
    overflow-x:hidden;
    line-height:1.7;

}

img{

   /* max-width:100%;*/
    display:block;

}

a{

    text-decoration:none;
    transition:var(--transition);

}

ul{

    list-style:none;
    margin:0;
    padding:0;

}

.section-title{

    color:var(--primary);
    font-size:42px;
    font-weight:700;
    margin-bottom:15px;

}

.section-title span{

    color:var(--secondary);

}

/*=====================================
TOP BAR
======================================*/

.top-bar{

    background:var(--primary);
    color:#fff;
    font-size:14px;
    padding:10px 0;

}

.top-left li,
.top-right li{

    display:inline-block;
    margin-right:18px;

}

.top-left i{

    color:var(--secondary);
    margin-right:8px;

}

.top-right a{

    color:#fff;

}

.top-right a:hover{

    color:var(--secondary);

}

/*=====================================
HEADER
======================================*/
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}
body{background:#f5f5f5}
.header{position:sticky;top:0;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.08);z-index:100}
.wrap{max-width:1320px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:10px 15px}
.logo img{height:60px}
.desktop-menu{display:flex;list-style:none;gap:10px;align-items:center}
.desktop-menu>li{position:relative}
.desktop-menu>li>a{display:flex;align-items:center;padding:20px 8px;text-decoration:none;color:#0A3D91;font-weight:600;white-space:nowrap}
.desktop-menu>li>a i{margin-left:4px;font-size:12px}
.submenu{display:none;position:absolute;left:0;top:100%;min-width:240px;background:#fff;list-style:none;box-shadow:0 8px 20px rgba(0,0,0,.15)}
.desktop-menu>li:hover>.submenu{display:block}
.submenu a{display:block;padding:11px 15px;text-decoration:none;color:#333}
.submenu a:hover{background:#0A3D91;color:#fff}
.erp-btn,.erp-mobile{background:#0A3D91;color:#fff!important;border-radius:25px}
.erp-btn{padding:10px 18px!important}
.menu-btn{display:none;background:none;border:none;font-size:32px;color:#0A3D91}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9998}
.overlay.show{display:block}
.mobile{position:fixed;left:-320px;top:0;width:300px;height:100%;background:#fff;overflow:auto;transition:.3s;z-index:9999}
.mobile.show{left:0}
.mhead{display:flex;justify-content:space-between;align-items:center;background:#0A3D91;color:#fff;padding:15px}
.close-btn{background:none;border:none;color:#fff;font-size:22px}
.mobile ul{list-style:none}
.mobile a{display:flex;justify-content:space-between;padding:14px 18px;text-decoration:none;color:#222;border-bottom:1px solid #eee}
.sub{
    display:none;
    background:#f7f7f7;
}

.drop.open > .sub{
    display:block;
}

.drop.open > a i{
    transform:rotate(180deg);
}
.erp-mobile{display:block;margin:10px;padding:12px;text-align:center}
@media(max-width:991px){.desktop-menu{display:none}.menu-btn{display:block}}
.hero{padding:60px;text-align:center}

/*=====================================
BUTTONS
======================================*/

.btn-warning{

    background:#ffc107;
    border:none;
    color:#000;
    font-weight:600;
    padding:14px 28px;
    border-radius:50px;

}

.btn-warning:hover{

    background:#fff;
    transform:translateY(-3px);
    border: solid 1px #ffc107;
    color:#ffc107;

}

.btn-outline-light{

    border:2px solid #fff;
    color:#fff;
    border-radius:50px;
    padding:14px 28px;

}

.btn-outline-light:hover{

    background:#fff;
    color:var(--primary);

}

/*=====================================
HERO SECTION
======================================*/

.hero-section{

    position:relative;
    min-height:92vh;

    background:
    linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),
    url('../images/building.jpg');

    background-size:cover;
    background-position:center;

    display:flex;
    align-items:center;

}

.overlay{

    position:absolute;
    inset:0;
    background:rgba(10,61,145,.35);

}

.hero-section .container{

    position:relative;
    z-index:2;

}

.hero-section h1{

    font-size:60px;
    font-weight:800;
    color:#fff;
    line-height:1.2;

}

.hero-section h1 span{

    color:var(--secondary);

}

.hero-section p{

    color:#f2f2f2;
    font-size:18px;
    margin:25px 0;

}

.hero-buttons{

    display:flex;
    gap:18px;
    margin-top:35px;

}

/*=====================================
HERO STATS
======================================*/

.hero-stats{

    display:flex;
    gap:60px;
    margin-top:50px;

}

.hero-stats h3{

    color:#fff;
    font-size:36px;
    font-weight:700;

}

.hero-stats p{

    margin-top:5px;
    color:#ddd;

}

/*=====================================
ENQUIRY FORM
======================================*/

.enquiry-box{

    background:#fff;
    border-radius:20px;
    padding:35px;
    box-shadow:var(--shadow);

}

.enquiry-box h3{

    color:var(--primary);
    font-weight:700;
    margin-bottom:25px;

}

.enquiry-box .form-control,
.enquiry-box .form-select{

    height:55px;
    border-radius:12px;
    border:1px solid var(--border);

}

.enquiry-box .form-control:focus,
.enquiry-box .form-select:focus{

    border-color:var(--primary);
    box-shadow:none;

}

/*=====================================
COUNTER
======================================*/

.counter-section{

    background:#fff;
    padding:80px 0;

}

.counter-box{

    background:#fff;
    border-radius:18px;
    padding:40px 25px;
    text-align:center;
    box-shadow:var(--shadow);
    transition:.35s;

}

.counter-box:hover{

    transform:translateY(-10px);

}

.counter-box i{

    font-size:45px;
    color:var(--primary);
    margin-bottom:20px;

}

.counter-box h2{

    color:var(--primary);
    font-size:42px;
    font-weight:700;
    display:inline-block;

}

.counter-box span{

    color:var(--secondary);
    font-size:30px;
    font-weight:700;

}

.counter-box p{

    margin-top:10px;
    font-weight:600;

}

/*=====================================================
WHY CHOOSE BITS
======================================================*/

.why-section{

    background:#f8fbff;
    padding:90px 0;

}

.feature-card{

    background:#fff;
    padding:40px 30px;
    border-radius:20px;
    text-align:center;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.35s;
    height:100%;

}

.feature-card:hover{

    transform:translateY(-12px);
    box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.feature-card i{

    width:90px;
    height:90px;
    line-height:90px;
    border-radius:50%;
    background:#0A3D91;
    color:#fff;
    font-size:36px;
    margin-bottom:25px;

}

.feature-card h4{

    font-size:24px;
    color:#0A3D91;
    font-weight:700;
    margin-bottom:15px;

}

.feature-card p{

    color:#666;

}

/*=====================================================
OUR INSTITUTES
======================================================*/

.institutes{

    padding:90px 0;

}

.institute-card{

    border:none;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.35s;

}

.institute-card:hover{

    transform:translateY(-12px);

}

.institute-card img{

    height:240px;
    object-fit:cover;

}

.institute-card .card-body{

    padding:30px;

}

.institute-card h5{

    color:#0A3D91;
    font-size:22px;
    font-weight:700;

}

.institute-card p{

    color:#666;
    min-height:60px;

}

/*=====================================================
PROGRAMMES
======================================================*/

.programmes{

    padding:90px 0;

}

.programme-card{

    background:#fff;
    border-radius:18px;
    padding:35px;
    border-top:6px solid #FDB913;
    box-shadow:0 15px 35px rgba(0,0,0,.08);
    transition:.35s;
    height:100%;

}

.programme-card:hover{

    transform:translateY(-10px);

}

.programme-card h5{

    color:#0A3D91;
    font-size:24px;
    margin-bottom:20px;

}

.programme-card p{

    line-height:2;

}

/*=====================================================
PLACEMENT
======================================================*/

.placement-section{

    padding:100px 0;

}

.placement-box{

    background:#fff;
    border-radius:15px;
    padding:30px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.placement-box h3{

    color:#0A3D91;
    font-size:36px;
    font-weight:700;

}

.placement-box p{

    color:#666;
    margin-top:8px;

}

/*=====================================================
RECRUITERS
======================================================*/

.recruiter-logo{

    padding:25px;
    background:#fff;
    border-radius:15px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:.3s;

}

.recruiter-logo:hover{

    transform:scale(1.08);

}

/*=====================================================
CAMPUS LIFE
======================================================*/

.campus-life img{

    border-radius:18px;
    transition:.4s;

}

.campus-life img:hover{

    transform:scale(1.05);

}

/*=====================================================
TESTIMONIALS
======================================================*/

.testimonial-card{

    background:#fff;
    border-radius:18px;
    text-align:center;
    padding:35px;
    box-shadow:0 15px 35px rgba(0,0,0,.08);

}

.testimonial-img{

    width:110px;
    height:110px;
    object-fit:cover;
    border-radius:50%;
    margin:auto;
    margin-bottom:20px;
    border:5px solid #FDB913;

}

/*=====================================================
NEWS
======================================================*/

.news-card{

    background:#fff;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 15px 35px rgba(0,0,0,.08);
    transition:.35s;

}

.news-card:hover{

    transform:translateY(-10px);

}

.news-card img{

    height:220px;
    object-fit:cover;

}

.news-card h5{

    color:#0A3D91;

}

.news-card a{

    color:#0A3D91;
    font-weight:600;

}

/*=====================================================
CTA
======================================================*/

.cta{

    background:linear-gradient(135deg,#0A3D91,#072d68);
    color:#fff;
    padding:80px 0;

}

.cta h2{

    font-size:42px;
    font-weight:700;

}

.cta p{

    margin:20px 0;

}

/*=====================================================
FOOTER
======================================================*/

.footer{

    background:#081b3d;
    color:#fff;
    padding:80px 0 25px;

}

.footer h4,
.footer h5{

    color:#FDB913;
    margin-bottom:25px;

}

.footer ul{

    padding:0;

}

.footer li{

    margin-bottom:12px;

}

.footer a{

    color:#ddd;

}

.footer a:hover{

    color:#FDB913;

}

.footer hr{

    border-color:rgba(255,255,255,.15);
    margin:40px 0 25px;

}

.social-icons a{

    width:45px;
    height:45px;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    border-radius:50%;
    background:#163f84;
    color:#fff;
    margin-right:10px;
    transition:.3s;

}

.social-icons a:hover{

    background:#FDB913;
    color:#000;

}

/*=====================================================
FLOATING BUTTONS
======================================================*/

.whatsapp{

    position:fixed;
    right:25px;
    bottom:95px;
    width:60px;
    height:60px;
    border-radius:50%;
    background:#25D366;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:30px;
    z-index:999;

}

.call-btn{

    position:fixed;
    right:25px;
    bottom:25px;
    width:60px;
    height:60px;
    border-radius:50%;
    background:#0A3D91;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:28px;
    z-index:999;

}

/*=====================================================
BACK TO TOP
======================================================*/

.back-top{

    position:fixed;
    left:25px;
    bottom:25px;
    width:55px;
    height:55px;
    border-radius:50%;
    background:#FDB913;
    color:#000;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:22px;
    cursor:pointer;
    opacity:0;
    visibility:hidden;
    transition:.3s;

}

.back-top.active{

    opacity:1;
    visibility:visible;

}

/*=====================================================
ANIMATION
======================================================*/

.fade-up{

    animation:fadeUp .8s ease forwards;

}

@keyframes fadeUp{

    from{

        opacity:0;
        transform:translateY(50px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

/*=====================================================
RESPONSIVE
======================================================*/

@media(max-width:992px){

.hero-section{

min-height:auto;
padding:100px 0;

}

.hero-section h1{

font-size:42px;

}

.hero-stats{

flex-wrap:wrap;
gap:25px;

}

.section-title{

font-size:34px;

}

.enquiry-box{

margin-top:40px;

}

}

@media(max-width:768px){

.top-bar{

display:none;

}

.logo{

height:55px;

}

.hero-buttons{

flex-direction:column;

}

.section-title{

font-size:30px;

}

.hero-section h1{

font-size:34px;

}

.counter-box{

margin-bottom:20px;

}

.footer{

text-align:center;

}

.social-icons{

margin-top:20px;

}

}

.admission-widget{

position:fixed;

right:25px;

top:50%;

transform:translateY(-50%);

width:280px;

background:#fff;

border-radius:18px;

overflow:hidden;

box-shadow:0 20px 45px rgba(0,0,0,.25);

z-index:9999;

animation:slideIn .6s;

}

.widget-header{

background:#0A3D91;

color:#fff;

padding:18px;

font-size:20px;

font-weight:700;

text-align:center;

}

.widget-header i{

margin-right:8px;

color:#FDB913;

}

.widget-body{

padding:20px;

}

.widget-body a{

display:flex;

align-items:center;

gap:12px;

padding:14px;

margin-bottom:10px;

background:#f8f9fa;

border-radius:12px;

color:#222;

font-weight:600;

transition:.35s;

}

.widget-body a:hover{

background:#0A3D91;

color:#fff;

transform:translateX(8px);

}

.widget-body i{

width:35px;

height:35px;

background:#FDB913;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

color:#000;

}

@keyframes slideIn{

from{

right:-350px;

}

to{

right:25px;

}

}

@media(max-width:768px){

.admission-widget{

display:none;

}

}

/*==============================
TOP HEADER
===============================*/

.top-header{

background:#0A3D91;

color:#fff;

font-size:14px;

padding:8px 0;

}

.top-info{

display:flex;

gap:25px;

margin:0;

padding:0;

list-style:none;

}

.top-info li{

display:flex;

align-items:center;

gap:8px;

}

.top-links a{

color:#fff;

margin-left:12px;

transition:.3s;

}

.top-links a:hover{

color:#FDB913;

}

.erp-btn{

padding:8px 18px;

background:#FDB913;

border-radius:30px;

color:#000 !important;

font-weight:600;

margin-left:20px;

text-decoration:none;

}

/*==============================*/



.search-box button{

border-radius:0 30px 30px 0;

}

.apply-btn{

border-radius:30px;

font-weight:700;

padding:10px 25px;

}

@media(max-width:991px){

.top-header{

display:none;

}

.search-box{

display:none;

}

.apply-btn{

margin-top:20px;

width:100%;

}

}



/* Scroll Progress */

#scrollProgress{

position:fixed;

top:0;

left:0;

height:4px;

width:0;

background:#FDB913;

z-index:99999;

}

/* Back To Top */

#backToTop{

position:fixed;

bottom:25px;

right:25px;

width:55px;

height:55px;

display:none;

align-items:center;

justify-content:center;

border:none;

border-radius:50%;

background:#0A3D91;

color:#fff;

font-size:20px;

cursor:pointer;

box-shadow:0 10px 25px rgba(0,0,0,.2);

transition:.3s;

z-index:9999;

}

#backToTop:hover{

background:#FDB913;

color:#000;

transform:translateY(-5px);

}

/* Active Menu */

.nav-link.active{

color:#0A3D91 !important;

font-weight:700;

}

/* Dropdown Animation */

.show-menu{

animation:fadeDown .35s ease;

}

@keyframes fadeDown{

from{

opacity:0;

transform:translateY(15px);

}

to{

opacity:1;

transform:translateY(0);

}

}

/* Optional Dark Mode */

body.dark-mode{

background:#121212;

color:#f5f5f5;

}


body{
    margin:0;
    overflow-x:hidden;
    font-family:Arial, Helvetica, sans-serif;
}

.hero-slider,
.carousel-item{
    width:100%;
    height:100%;
    overflow:hidden;
}

.carousel-item video{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* Mobile */
@media (max-width:768px){

.hero-slider,
.carousel-item{
}

.carousel-item video{
    object-fit:contain;
    background:#000;
}

}

.floating-btn{
    position:fixed;
    right:0;
    top:55%;
    transform:translateY(-50%) rotate(180deg);
    writing-mode:vertical-rl;
    background:#1d3d8f;
    color:#fff;
    padding:15px 10px;
    font-weight:600;
    text-decoration:none;
    border-radius:10px 0 0 10px;
    z-index:9999;
    transition:.3s;
}

.floating-btn:hover{
    background:#0d6efd;
    color:#fff;
    width:50px;
}

.modal-content{
    border-radius:15px;
}

.enquiry-box h3{
    font-weight:700;
    color:#198754;
}

.form-control,
.form-select{
    height:50px;
    border-radius:8px;
}

.btn-warning{
    height:52px;
    font-size:18px;
    font-weight:600;
}
.social-sidebar{
    position:fixed;
    left:0;
    top:50%;
    transform:translateY(-50%);
    z-index:9999;
}

.social-sidebar a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    color:#fff;
    text-decoration:none;
    font-size:20px;
    transition:.35s;
}

.social-sidebar a:hover{
    width:65px;
}

.facebook{background:#1877F2;}
.twitter{background:#000;}
.instagram{
    background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF,#515BD4);
}
.youtube{background:#FF0000;}
.linkedin{background:#0A66C2;}
.whatsapp{background:#25D366;}

@media(max-width:768px){

.social-sidebar{
    top:auto;
    bottom:15px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    border-radius:50px;
    overflow:hidden;
    box-shadow:0 5px 20px rgba(0,0,0,.2);
}

.social-sidebar a{
    width:48px;
    height:48px;
}

.social-sidebar a:hover{
    width:48px;
}

}


p{
    text-align: justify;
}
.page-banner{
    position:relative;
    padding:60px 0;
    overflow:hidden;

    background:
    linear-gradient(
        rgba(0, 35, 102, 0.75),
        rgba(0, 64, 128, 0.75)
    ),
    url("assets/images/building.jpg");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

/* Dark Overlay */

.page-banner .overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
    135deg,
    rgba(0,41,87,.88),
    rgba(0,87,183,.75));

}

/* Decorative Circle */

.page-banner::before{

    content:"";

    position:absolute;

    width:350px;

    height:350px;

    border-radius:50%;

    background:rgba(255,255,255,.05);

    top:-120px;

    right:-120px;

}

.page-banner::after{

    content:"";

    position:absolute;

    width:250px;

    height:250px;

    border-radius:50%;

    background:rgba(255,255,255,.05);

    bottom:-80px;

    left:-80px;

}

.page-banner .container{

    position:relative;

    z-index:10;

}

/* Subtitle */

.sub-title{

    color:#FFD54F;

    font-size:18px;

    letter-spacing:2px;

    text-transform:uppercase;

    font-weight:600;

}

/* Heading */

.page-banner h1{

    color:#fff;

    font-size:58px;

    font-weight:800;

    margin:15px 0;

    line-height:1.2;

}

.page-banner h1 span{

    color:#FFC107;

}

/* Paragraph */

.page-banner p{

    color:#fff;

    font-size:18px;

    margin-bottom:30px;

    opacity:.9;

}

/* Breadcrumb */

.page-banner .breadcrumb{

    background:rgba(255,255,255,.12);

    display:inline-flex;

    padding:12px 30px;

    border-radius:50px;

    backdrop-filter:blur(12px);

}

.page-banner .breadcrumb-item{

    color:#fff;

    font-size:15px;

}

.page-banner .breadcrumb-item a{

    color:#FFD54F;

    text-decoration:none;

    font-weight:600;

}

.page-banner .breadcrumb-item+.breadcrumb-item::before{

    color:#fff;

}

/* Responsive */

@media(max-width:992px){

.page-banner{

padding:90px 0;

}

.page-banner h1{

font-size:42px;

}

}

@media(max-width:768px){

.page-banner{

padding:70px 0;

}

.page-banner h1{

font-size:32px;

}

.page-banner p{

font-size:15px;

}

}


.institute-card{
    border-radius:18px;
    overflow:hidden;
    transition:.35s;
}

.institute-card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(0,0,0,.15)!important;
}

.institute-img{
    height:250px;
    object-fit:cover;
}

.institute-card h3{
    font-weight:700;
    color:#0A3D91;
}

.course-list{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.course-list span{
    padding:8px 16px;
    background:#eef5ff;
    border-radius:30px;
    color:#0A3D91;
    font-weight:600;
    font-size:14px;
}

.institute-card ul{
    padding-left:18px;
}

.institute-card ul li{
    margin-bottom:8px;
    color:#555;
}

.institute-card .btn{
    border-radius:30px;
    padding:10px 28px;
}