/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

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

html{
    scroll-behavior:smooth;
}

body{
    overflow-x:hidden;
    background:#f8f9fa;
    color:#333;
}

/* Notification Bar */
.notification-bar{
    background:linear-gradient(90deg,#ff6600,#ff9800);
    color:#fff;
    padding:10px;
    font-weight:600;
    font-size:15px;
}

/* Navbar */
.navbar{
    padding:15px 0;
    box-shadow:0 2px 20px rgba(0,0,0,0.1);
}

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

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

.nav-link:hover{
    color:#ffc107 !important;
}

/* Hero Section */
.hero{
    min-height:90vh;
    display:flex;
    align-items:center;
    background:linear-gradient(rgba(0,0,0,0.65),
    rgba(0,0,0,0.65)),
    url('../images/banner.jpg');
    background-size:cover;
    background-position:center;
    color:#fff;
    padding:100px 0;
}

.hero h1{
    font-size:55px;
    font-weight:700;
    margin-bottom:20px;
}

.hero p{
    font-size:20px;
    margin-bottom:30px;
    line-height:1.8;
}

.hero .btn{
    padding:12px 30px;
    border-radius:30px;
    font-weight:600;
}

/* Section Title */
section h2{
    font-weight:700;
    margin-bottom:20px;
    color:#0d6efd;
}

/* Cards */
.card{
    border:none;
    border-radius:20px;
    overflow:hidden;
    transition:0.4s;
    margin-bottom:30px;
}

.card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 40px rgba(0,0,0,0.15);
}

/* Committee Images */
.rounded-circle{
    object-fit:cover;
    border:5px solid #0d6efd;
    height:120px;
    width:120px;
}

/* Course Icons */
.fa-3x{
    color:#0d6efd;
}

/* Buttons */
.btn-primary{
    background:#0d6efd;
    border:none;
}

.btn-primary:hover{
    background:#004ec2;
}

.btn-warning{
    color:#fff;
}

/* Footer */
footer{
    margin-top:50px;
}

footer h5{
    font-weight:700;
    margin-bottom:15px;
}

footer p{
    margin-bottom:8px;
}

/* Scroll To Top Button */
.top-btn{
    position:fixed;
    right:20px;
    bottom:20px;
    width:50px;
    height:50px;
    background:#0d6efd;
    color:#fff;
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    cursor:pointer;
    font-size:20px;
    display:none;
    z-index:999;
}

/* News Cards */
.news-card{
    background:#fff;
    padding:25px;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
    margin-bottom:30px;
}

/* Gallery Images */
.gallery img{
    border-radius:20px;
    transition:0.5s;
}

.gallery img:hover{
    transform:scale(1.05);
}

/* Contact Form */
.form-control{
    padding:12px;
    border-radius:10px;
}

textarea{
    resize:none;
}

/* Responsive */

@media(max-width:992px){

    .hero{
        text-align:center;
        padding:80px 20px;
    }

    .hero h1{
        font-size:40px;
    }

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

@media(max-width:768px){

    .hero h1{
        font-size:32px;
    }

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

    .navbar-brand{
        font-size:22px;
    }

    section{
        padding:60px 0;
    }
}

@media(max-width:576px){

    .hero h1{
        font-size:28px;
    }

    .notification-bar{
        font-size:13px;
    }
}


/* ===========================
   Section Headings
=========================== */
section h2{
    font-size: 2.3rem;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 15px;
    position: relative;
}

section h2::after{
    content: "";
    width: 80px;
    height: 4px;
    background: #0d6efd;
    display: block;
    margin: 15px auto 0;
    border-radius: 50px;
}

/* ===========================
   Latest News Cards
=========================== */
.bg-light .card{
    border: none;
    border-radius: 20px;
    overflow: hidden;
    transition: all .4s ease;
    box-shadow: 0 10px 35px rgba(0,0,0,.08);
    height: 100%;
}

.bg-light .card:hover{
    transform: translateY(-12px);
    box-shadow: 0 20px 45px rgba(0,0,0,.15);
}

.bg-light .card-body{
    padding: 35px 30px;
}

.bg-light .card h5{
    font-size: 1.3rem;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 15px;
}

.bg-light .card p{
    color: #64748b;
    line-height: 1.8;
}

/* ===========================
   Buttons
=========================== */
.btn-primary{
    border-radius: 50px;
    padding: 10px 28px;
    font-weight: 600;
    transition: .3s;
}

.btn-primary:hover{
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(13,110,253,.3);
}

/* ===========================
   Core Committee Cards
=========================== */
.text-center .card{
    border: none;
    border-radius: 25px;
    padding: 20px;
    transition: .4s;
    box-shadow: 0 10px 35px rgba(0,0,0,.08);
}

.text-center .card:hover{
    transform: translateY(-10px);
    box-shadow: 0 20px 45px rgba(0,0,0,.15);
}

.text-center .card img{
    width: 130px;
    height: 130px;
    object-fit: cover;
    border: 5px solid #0d6efd;
    padding: 5px;
}

.text-center .card h5{
    font-weight: 700;
    margin-top: 15px;
    color: #1e293b;
}

.text-center .card p{
    color: #64748b;
}

/* ===========================
   Course Cards
=========================== */
.col-md-3 .card{
    border: none;
    border-radius: 20px;
    background: #fff;
    transition: .4s;
    box-shadow: 0 10px 35px rgba(0,0,0,.08);
}

.col-md-3 .card:hover{
    transform: translateY(-10px);
    background: #0d6efd;
    color: #fff;
}

.col-md-3 .card:hover i,
.col-md-3 .card:hover h5{
    color: #fff !important;
}

.col-md-3 .card i{
    transition: .4s;
}

.col-md-3 .card h5{
    font-weight: 700;
}

/* ===========================
   Counter Section
=========================== */
.bg-primary{
    background: linear-gradient(
        135deg,
        #0d6efd,
        #0047b3
    ) !important;
}
.bg-primary h2,
.bg-primary p {
    color: #ffffff !important;
    opacity: 1 !important;
}
.counter{
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 10px;
}



/* ===========================
   Responsive
=========================== */
@media(max-width:768px){

    section h2{
        font-size: 1.8rem;
    }

    .card{
        margin-bottom: 30px;
    }

    .counter{
        font-size: 2.3rem;
    }
}
@media (max-width: 767px) {
    .courses-section .col-md-3 {
        width: 50%;
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 20px;
    }

    .courses-section .card {
        padding: 20px 10px !important;
    }

    .courses-section .card h5 {
        font-size: 15px;
    }

    .courses-section .card i {
        font-size: 2rem !important;
    }
}


.footer-section{
    background: #0f172a !important;
    color: #fff;
    padding: 80px 0 25px;
}

.footer-logo{
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.footer-text{
    color: #cbd5e1 !important;
    line-height: 1.9;
    font-size: 15px;
}

.footer-title{
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 25px;
    color: #fff !important;
}

.footer-links{
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li{
    margin-bottom: 15px;
}

.footer-links a{
    color: #cbd5e1;
    text-decoration: none;
    transition: .3s;
}

.footer-links a i{
    margin-right: 8px;
    color: #0d6efd;
}

.footer-links a:hover{
    color: #fff;
    padding-left: 10px;
}

.footer-contact p{
    color: #cbd5e1;
    margin-bottom: 18px;
    line-height: 1.7;
}

.footer-contact i{
    color: #0d6efd;
    width: 25px;
}

.footer-social a{
    width: 45px;
    height: 45px;
    background: rgba(255,255,255,.08);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    margin-right: 10px;
    text-decoration: none;
    transition: .3s;
}

.footer-social a:hover{
    background: #0d6efd;
    transform: translateY(-5px);
}

.footer-divider{
    height: 1px;
    background: rgba(255,255,255,.1);
    margin: 50px 0 25px;
}

.footer-bottom{
    text-align: center;
}

.footer-bottom p{
    color: #94a3b8;
    margin: 0;
    font-size: 14px;
}

@media(max-width:768px){

    .footer-section{
        text-align: center;
        padding: 60px 0 25px;
    }

    .footer-logo{
        font-size: 1.6rem;
    }

    .footer-social{
        margin-top: 20px;
    }

    .footer-social a{
        margin: 5px;
    }
}

footer.footer-section{
    background: #0f172a !important;
    color: #fff !important;
    display: block !important;
}

footer.footer-section *{
    color: inherit;
}

footer.footer-section .footer-logo,
footer.footer-section .footer-title{
    color:#fff !important;
}

footer.footer-section .footer-text,
footer.footer-section .footer-contact p,
footer.footer-section .footer-links a,
footer.footer-section .footer-bottom p{
    color:#cbd5e1 !important;
}

footer.footer-section .footer-social a{
    color:#fff !important;
}