* {
    margin: 0;
    padding: 0;
}

html {
    overflow-x: hidden !important;
}

body {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}
.popup {
  max-height: 90vh; /* screen ke 90% tak hi height le */
  overflow-y: auto; /* scroll enable ho jaye */
}

.toast-msg {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: #28a745; /* green for success */
  color: white;
  padding: 12px 20px;
  border-radius: 8px;
  font-weight: 500;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.4s ease;
  z-index: 9999;
}
.toast-msg.show {
  opacity: 1;
  transform: translateY(0);
}
.toast-msg.error {
  background: #dc3545; /* red for error */
}

#about_section,
#faquality_section,
#contact_section {
    scroll-margin-top: 80px !important;
}

span {
    color: #fb8c00;
  
}

.span_2 {
    color: #007B5E;
}

.span_3 {
    color: #0B0B3A;
    
}


.main_btn {
    color: #fff;
    font-size: 16px;
    padding: 16px 24px;
    border-radius: 40px;
    border: none;
    background:
        linear-gradient(120deg, #FDA31B 45%, rgb(99 78 207 /0%) 45%),
        linear-gradient(120deg, #FDA31B 55%, #0B0B3A 55%);
    background-size: 250%;
    background-position: right;
    transition: .3s ease-in-out;
    overflow: visible;
}

.main_btn:hover {
    background-position: left;
    transition: .3s ease;
}


/* top header css start  */


.top_header_left {
    background-color: #FDA31B;
}

.top_header_left i {
    height: 30px;
    width: 30px;
    background-color: #116E63;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 5px;
    color: #fff;
}

.top_header_left i:hover {
    color: #FDA31B
}

.top_header_right {
    background-color: #116E63;
}

.top_header_right i {
    color: #FDA31B;
    font-size: 20px;
}

.top_header_right i:hover {
    color: #041f1b;
    font-size: 20px;
}

.top_header_right a:hover {
    color: #FDA31B !important;
    cursor: pointer;
}

/* top header css end  */

/* navbar css start  */
.college-name {
    /*font-size: 20px;*/
    color: #0B0B3A;
    white-space: nowrap;
    text-align: center;
}
.logo_main {
    width: 100px;
}

@media (max-width: 576px) {
    .college-name {
        font-size: 13px !important;
    }
  .span_2 {
     font-size: 10px !important;
 }
 .logo_main {
    width: 80px;
}
}



.navbar-nav .nav-link {
    font-weight: 500;
    color: #000 !important;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: #007B5E !important;
}

.navbar-nav li a {
    font-size: 18px;
}

.btn-warning {
    background: linear-gradient(45deg, #ffa726, #fb8c00);
    border: none;
}

.dropdown-menu {
    animation: fadeIn 0.2s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

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

/* Custom dropdown styling */
.custom-dropdown {
    background-color: #00695c !important;
    padding: 0;
    border: none;
    min-width: 220px;
}

.custom-dropdown .dropdown-item {
    color: #fff !important;
    padding: 12px 20px;
    font-weight: 500;
    transition: background-color 0.3s ease, border-left 0.3s ease;
    border-left: 4px solid transparent;
}
@media (max-width: 600px) {
  .navbar-nav .nav-link {
    padding: 12px 18px !important;
  }
}
/* Hover effect */
.custom-dropdown .dropdown-item:hover {
    background-color: #004d40 !important;
    border-left: 4px solid #f9a825 !important;
    color: #fff !important;
}

/* Enable hover dropdown */
.navbar-nav .dropdown:hover>.dropdown-menu {
    display: block;
    margin-top: 0;
    /* Optional: Remove upward space */
}

.navbar-nav .dropdown-menu {
    transition: all 0.3s ease;
}



/* navbar css end  */

/* hero_section css start  */

.carousel-container {
    max-width: 100%;
    width: 100%;
    position: relative;
}

.carousel-wrapper {
    position: relative;
    width: 100%;
    height: 500px;
    overflow: hidden;
    background: #f8f9fa;
}

.carousel-slide {
    min-height: 100vh;
    position: relative;
    background-size: cover;
    background-position: center;
    display: flex;
}

.carousel-slide::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    /* overlay color */
    z-index: 1;
}

.carousel-caption {
    position: relative;
    z-index: 2;
    /* overlay ke upar content */
    padding: 0px 0px !important;

}

@media (max-width: 600px) {
    .carousel-caption {

    bottom: 255px !important;
    left: 0% !important;

    }
}
@media (max-width: 900px) {
    .carousel-caption {

    bottom: 210px !important;
    /*left: 0% !important;*/

    }
}
@media (max-width: 2560px) and (min-width: 1441px) {
  /* Yaha apna CSS likho */
    .carousel-caption {
    bottom: 150px !important;
  }
}

.carousel-track {
    display: flex;
    height: 100%;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.carousel-slide {
    min-width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    /* background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); */
}

.carousel-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Placeholder images avec numéros */
.carousel-slide::before {
    content: '' !important;
    position: absolute;
    font-size: 120px;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.2);
    z-index: 1;
}



/* Contrôles de navigation */
.carousel-controls {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
    pointer-events: none;
    z-index: 10;
}

.control-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    pointer-events: all;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.control-btn:hover {
    background: rgba(255, 255, 255, 1);
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

.control-btn:active {
    transform: scale(0.95);
}

.control-btn svg {
    width: 24px;
    height: 24px;
    stroke: #333;
    stroke-width: 2.5;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Indicateurs dots */
.carousel-indicators {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 25px;
}

.indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #FDA31B;
    border: none;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.indicator::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: #FDA31B;
    border-radius: 50%;
    transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.indicator.active {
    width: 35px;
    border-radius: 6px;
    background: #f8f9fa;
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(73, 80, 87, 0.15);
}

.indicator.active::before {
    left: 0;
    border-radius: 6px;
    background: #116E63;
    box-shadow: 0 0 10px rgba(73, 80, 87, 0.2);
}

.indicator:hover:not(.active) {
    background: #116E63;
    transform: scale(1.2);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}


/* Responsive */
@media (max-width: 768px) {
    .carousel-wrapper {
        height: 350px;
    }

    .control-btn {
        width: 40px;
        height: 40px;
        display: none !important;
    }

    .control-btn svg {
        width: 20px;
        height: 20px;
    }
    .carousel-indicators{
        display: none !important;
    }
}

/* Mobile Fix */
@media (max-width: 768px) {
    .carousel-slide {
        text-align: center;
        padding: 30px 20px;
    }

    .carousel-caption {
        max-width: 100%;
    }

    .carousel-caption h1 {
        font-size: 1.8rem;
        line-height: 1.3;
    }

    .carousel-caption p {
        font-size: 0.95rem;
    }

    .carousel-caption .d-flex {
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* Animation d'entrée */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

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

.carousel-container {
    animation: slideIn 0.6s ease-out;
}

/* hero_section css start  */


/* About Section css start  */
:root {
    --orange: #FDA31B;
    --dark: #2e2e2e;
    --gray: #f5f5f5;
    --light-gray: #eef2f3;
    --text-muted: #7d7d7d;
    --primary-text: #1d1d1d;
    --green: #116E63;
}

.about-section {
    background: rgb(250, 251, 251);
    padding: 60px 0;

}


.custom-rounded-img {
    width: 100%;
    object-fit: cover;
    border-top-left-radius: 0px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 0;
}

.custom-rounded-img_2 {
    width: 100%;
    object-fit: cover;
    border-top-left-radius: 30px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 30px;
}

.about_bottom {
    background-color: #116E63;
}

.about-section h6 {
    color: var(--orange);
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.about-section h2 {
    font-weight: 700;
    font-size: 40px;
}

.about-section h2 span {
    color: var(--orange);
}

.about-text p {
    color: var(--text-muted);
    max-width: 600px;
}

.feature-icon {
    background-color: var(--orange);
    border-radius: 50%;
    padding: 10px;
    color: white;
    font-size: 20px;
    margin-right: 15px;
}

.feature-box {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.feature-text h5 {
    font-weight: 600;
    margin-bottom: 5px;
}

.quote-box {
    background: var(--light-gray);
    padding: 20px;
    border-radius: 15px;
    font-size: 15px;
    max-width: 300px;
}

.quote-box::after {
    content: "99";
    font-weight: bold;
    float: right;
    color: var(--green);
    font-size: 30px;
}

.btn-discover {
    background-color: var(--orange);
    color: white;
    padding: 10px 25px;
    border-radius: 30px;
    text-transform: uppercase;
    font-weight: 500;
    transition: 0.3s;
}

.btn-discover:hover {
    background-color: #fb8c00;
}

.call-now {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.call-now i {
    background-color: var(--green);
    color: white;
    border-radius: 50%;
    padding: 12px;
    margin-right: 15px;
}

.call-now span {
    color: var(--orange);
    font-weight: 600;
}

.call-now a {
    display: block;
    color: var(--green);
    font-weight: 600;
    text-decoration: none;
}

.img-box img {
    width: 100%;
    object-fit: cover;
}

.about_3 {
    height: 280px;
    width: 100%;
    object-fit: cover;
    border-top-left-radius: 30px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 30px;
}


@media (max-width: 768px) {
    .quote-box {
        margin-top: 20px;
    }

    .img-box {
        margin-bottom: 20px;
    }
}

/* About Section css end  */



/* counter  section start css  */
.outer-border {
    padding: 6px;
    border: 2px solid #116E63;
}

.counter-box {
    border: 2px solid orange !important;

}

.counter-box img {
    width: 70px;
    margin-bottom: 5px;
}

.counter {
    background-color: #116E63;
}

/* counter  section start end  */


/* education section css start  */
.edu-section {
    background-image: url('../img/bg.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    padding: 20px 20px;
    text-align: center;
    position: relative;
    padding: 60px 0;
}


.edu-icon {
    background: #f59c00;
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 36px;
}

.edu-title {
    font-weight: bold;
    font-size: 30px;
}


.edu-subtext {
    margin: 20px auto;
    max-width: 700px;
    color: #666;
}

.edu-author {
    font-weight: 500;
    color: #333;
}

.edu-line {
    width: 80px;
    height: 3px;
    background: #f59c00;
    margin: 20px auto;
}

.edu-buttons .btn-orange {
    background-color: #f59c00;
    color: white;
    padding: 10px 35px;
    font-weight: 600;
    border: none;
    margin: 10px;
    border-radius: 0;
    transition: 0.3s ease;
    position: relative;
    overflow: hidden;
    text-align: start;
}

.edu-buttons .btn-orange::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 100%;
    background: transparent;
    clip-path: polygon(100% 0, 0 50%, 100% 100%);
}

.edu-buttons .btn-orange:hover {
    background-color: #d78200;
}

@media (max-width: 768px) {
    .edu-title {
        font-size: 22px;
    }
}

/* education section css end  */


/* faquality_section start css  */


.faq-img-wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(3, 11, 30, 0.8);
    z-index: 1;
}

.faq-img-wrapper img {
    position: relative;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.accordion_section {
    background-color: rgb(3, 11, 30);
    border: none;
}

.short-line {
    width: 60px;
    height: 2px;
    background-color: #fff;
}


.accordion-item {
    border: none !important;
    padding: 10px 0px;
    background: transparent;
    color: #fff;
    border-radius: 40px !important;
}


.accordion-button:focus {
    box-shadow: none;
    outline: none;
    background-color: #FDA31B;
    color: #fff;
}

.accordion-button {
    font-weight: 500;
    border: 2px solid #FDA31B;
    background: transparent;
    color: #fff !important;
    box-shadow: none !important;
}

.accordion-button::after {
    color: #fff !important;
}

.accordion-body {
    padding: 1rem 1.25rem;
    border: 2px solid #FDA31B;
    border-top: none;
}

.heading h2 span {
    color: #FDA31B;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.heading h1 {
    font-size: 32px;
    font-weight: 700;
    margin-top: 10px;
    color: #fff;
}

/* faquality_section start end  */


/* event_section start css  */
#event_section {
    background-color: 116E63;
}

.short_line_2 {
    width: 60px;
    height: 2px;
    background-color: #000000;
}



.news_img_box .card-image {
    display: block;
    width: 100%;
    height: 250px;
    transition: transform 0.4s ease;
    position: relative;
    z-index: 1;
    object-fit: cover;
}

.news_img_box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(253, 163, 27, 0.588);
    opacity: 0;
    z-index: 2;
    transition: opacity 0.4s ease;
}

.news_img_box:hover .card-image {
    transform: scale(1.1);
}

.news_img_box:hover::before {
    opacity: 1;
}


/* event_section start end  */

.l-title {
    font-size: 64px;
    font-family: var(--font-title);
    font-weight: 400;
    text-align: center;
    color: var(--color-dark);
    margin-bottom: 60px;
}

/* scholarship_section css start  */
#scholarship_section {
    position: relative;
    background-image: url('../img/bulding_2.webp');
    background-size: cover;
    background-position: center;
    padding: 30px 0;
    color: #fff;
    z-index: 1;
}

#scholarship_section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(3, 11, 30, 0.8);
    z-index: -1;
}

/* scholarship_section css end  */

/* tab_section css start  */
.nav-tabs .nav-link {
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
    color: #fff !important;
    margin: 10px 4px;
    background-color: #004d40;
    border-radius: 10px;
    padding: 10px 16px;
    font-weight: 500;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.nav-tabs .nav-link:hover {
    background-color: #198754;
    color: #fff !important;
    transform: scale(1.05);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.nav-tabs .nav-link.active {
    background-color: #fca311 !important;
    color: #fff !important;
    border-radius: 8px;
    border: none;
    transform: scale(1.05);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25);
}

.tab-pane img {
    max-height: 300px;
    object-fit: cover;
    width: 100%;
    border-radius: 6px;
}

@media (max-width: 576px) {
    .nav-tabs .nav-link {
        font-size: 14px;
        padding: 8px 12px;
    }

    .tab-pane h4 {
        font-size: 18px;
    }
}

.course-card {
    background-color: #ffffff;
    border-radius: 16px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.course-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}

.course-category {
    color: #116E63;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.course-title {
    font-weight: 600;
    color: #212529;
    margin-bottom: 12px;
}

.course-desc {
    color: #555;
    font-size: 15px;
    margin-bottom: 0;
}

.course-badge {
    background-color: #116E63;
    color: #fff;
    font-size: 14px;
    padding: 6px 12px;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
}

/* tab_section css end   */

/* why-choose-section css start  */

.why-choose-section {
    position: relative;
    background-image: url('../img/Banner//01.webp');
    background-size: cover;
    background-position: center;
    padding: 80px 0;
    color: #fff;
    z-index: 1;
}

.why-choose-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(3, 11, 29, 0.87);
    z-index: -1;
}

.why-choose-section h5 {
    color: #fca311;
    font-weight: 600;
}

.why-choose-section h2 {
    font-weight: 700;
}

.card-box {
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 30px;
    border-radius: 5px;
    transition: all 0.3s ease;
    background-color: rgba(255, 255, 255, 0.05);
}

.card-box:hover {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: #fca311;
}



.card-box .icon-box {
    transition: transform 0.6s ease;
    display: inline-block;
    font-size: 2rem;
    margin-bottom: 15px;
    color: #fca311;
}

.card-box:hover .icon-box {
    transform: rotateY(180deg) scale(1.2);
}

.card-box h5 {
    font-weight: bold;
    margin-bottom: 10px;
}

.card-box p {
    font-size: 0.9rem;
    color: #d0d0d0;
}

.card-box a {
    font-weight: 500;
    text-decoration: none;
    color: #fff;
}

.card-box a:hover {
    color: #fca311;
}

/* why-choose-section css end  */

/* our_courses section start  */

.arrow-btn {
    width: 50px;
    height: 50px;
    background-color: #116E63;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 24px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s ease;
}

.arrow-btn:hover {
    background-color: #0b5a51;
}

.btn-group-custom {
    display: flex;
    gap: 12px;
}

.course-card {
    border: 1px solid #eee;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    width: 100%;
    height: 480px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

.course_img_box {
    overflow: hidden;
    height: 200px;
    border-radius: 5px 5px 0 0;
}

.course_img_box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.course-card:hover .course_img_box img {
    transform: scale(1.1);
}

.tag {
    background-color: #116E63;
    color: #fff;
    font-size: 14px;
    padding: 4px 10px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: -20px;
    position: relative;
    left: 15px;
}

.card-body-custom {
    padding: 20px;
}

.card-title-custom {
    font-weight: 700;
    font-size: 22px;
    margin-bottom: 10px;
    color: #002147;
}

.card-text-custom {
    color: #666;
    font-size: 15px;
    margin-bottom: 15px;
}

.card-footer-custom {
    display: flex;
    float: right;
    align-items: end;
    margin-top: 10px !important;
}

.read-more {
    color: #116E63;
    text-decoration: none;
    font-weight: 500;
}

.read-more:hover {
    color: #0d544c;
    text-decoration: none;
}

.icon-book {
    font-size: 34px;
    color: #116E63;
    transition: transform 0.4s ease;
}

.course-card:hover .icon-book {
    transform: scale(1.1);
    color: #0d544c;
}


/* our_courses section end   */

/*notice section css start */
  .notice-container {
    background-color: #ffffff;
    border-left: 6px solid #FDA31B;
    border-radius: 12px;
    padding: 25px;
    height: 300px;
    overflow-y: auto;
    box-shadow: 0 6px 18px rgba(13, 110, 253, 0.15);
  }

  .notice-title {
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 20px;
    color: #0b0b3a !important;
    border-bottom: 2px solid #0b0b3a !important;
    padding-bottom: 8px;
  }

  .notice-item {
    position: relative;
    padding-left: 25px;
    margin-bottom: 15px;
  }

  .notice-item::before {
    content: "➤";
    position: absolute;
    left: 0;
    top: 0;
    color: #FDA31B;
    font-size: 1rem;
  }

  .notice-item a {
    text-decoration: none;
    color: #0b0b3a !important;
    transition: all 0.3s;
    font-weight: 500;
  }

  .notice-item a:hover {
    color: #084298;
    text-decoration: underline;
  }

  /* View All Button */


  /* Scrollbar style */
  .notice-container::-webkit-scrollbar {
    width: 4px;
  }

  .notice-container::-webkit-scrollbar-thumb {
    background-color: #FDA31B;
    border-radius: 10px;
  }

  .notice-container::-webkit-scrollbar-track {
    background-color: #f1f1f1;
  }
/*notice section css end */

/* features-section css start  */
.features-section {
    background-color: #0b0b3a;
}

.features-content {
    background-color: #0b0b3a;
    color: #fff;
    overflow-x: hidden !important;

}

.features-content h5 {
    font-size: 1.8rem;
    margin-top: 4px;
}

.features-content p {
    font-size: 1.1rem;
}

.icon-circle {
    background-color: #FDA31B;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;

}

.object-fit-cover {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.feature-box {
    flex-wrap: wrap;
}

@media (max-width: 767px) {

    html,
    body {
        overflow-x: hidden;
    }



    .icon-circle {
        width: 40px;
        height: 40px;
    }

    .features-content h2 {
        font-size: 2rem;
    }

    .feature-box {
        flex-wrap: wrap;
        /* icon + text line break */
    }
}



/* footer css start  */
.footer_section {
    background: #0b0b3a;
    position: relative;
    font-size: 15px;
}

.footer_section .footer-links li a {
    color: #ccc;
    text-decoration: none;
    display: block;
    margin-bottom: 6px;
    transition: 0.3s;
    font-size: 18px;
    font-weight: 400;
}

.footer_section .footer-links li a:hover {
    color: #FDA31B;
    padding-left: 10px;
    transition: all 0.3s ease-in-out;
}

.footer_section .social-icons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px; /* icons ke beech proper gap */
}

.footer_section .social-icons a {
    display: flex; /* icon ko center lane ke liye */
    justify-content: center;
    align-items: center;
    color: #FDA31B;
    font-size: 22px;
    width: 50px;
    height: 50px;
    background-color: #fff;
    border-radius: 50%;
    transition: all 0.3s ease;
    text-decoration: none;
}

.footer_section .social-icons a:hover {
    transform: scale(1.1);
    background-color: #FDA31B;
    color: #fff; /* hover pe white icon */
}

.footer_section .contact_info_footerli {
    margin-bottom: 10px;
    font-size: 18px;
    cursor: pointer;
}

.footer_section .contact_info_footer li:hover {
    color: #FDA31B;
    padding-left: 10px;
    transition: all 0.3s ease-in-out;
}

.footer_section .contact_info_footer li i {
    font-size: 20px;
    color: #FDA31B;
}

.scroll-top-btn {
    position: absolute;
    right: 20px;
    bottom: 20px;
    padding: 10px 12px;
    border-radius: 50%;
    font-size: 18px;
    transition: 0.3s;
    z-index: 99;
}

.scroll-top-btn:hover {
    background-color: #fff;
    color: #000;
}


.contact_info_footer i {
    color: #FDA31B;
    ;
    margin-right: 8px;
    font-size: 18px;
    line-height: 1.5;
}

.contact_info_footer a {
    text-decoration: none !important;
    color: #fff;
}

.contact-address a:hover {
    color: #FDA31B;
    /* Example hover color for address */
    text-decoration: underline;
}

.contact-phone a:hover {
    color: #FDA31B;
    /* Example hover color for phones */
    text-decoration: underline;
}

.contact-email a:hover {
    color: #FDA31B;
    /* Example hover color for email */
    text-decoration: underline;
}

/* footer css end  */


/* who_we_are section css start  */
.we_outer {
    position: relative;
    border: 1px solid #116E63;
    padding: 5px;
    width: 308px;
    height: 308px;
}

.we_inner {
    border: 1px solid #FDA31B;
    padding: 5px;
    width: 309px;
    height: 309px;

}

.we_img {
    width: 300px;
    height: 300px;
    padding: 5px;

}

.we_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



/* who_we_are section css end  */
.overlay_page {
    position: relative;
    background-image: url('../img/bulding_2.webp');
    background-size: cover;
    background-position: center;
    z-index: 1;
    object-fit: cover;
    width: 100%;
    height: 50vh;
}

.overlay_page::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(3, 11, 30, 0.7);
    z-index: -1;
}

.overlay_page_contant {
    position: relative;
    z-index: 2;
    color: white;
    top: 180;
    text-align: center;
}

@media (max-width:500px) {
    .overlay_page_contant {
        top: 150 !important;
    }
    .overlay_page {
    height: 35vh;
 }
}



/* Tab button styles */
#admissionTabs .nav-link {
    background: #f8f9fa;
    padding: 15px 20px;
    margin-bottom: 8px;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

/* admission section start  */

#admissionTabs .nav-link {
    color: #000 !important;
}

#admissionTabs .nav-link:hover {
    background: #116E63;
    color: white !important;
    transform: translateX(5px);
}

#admissionTabs .nav-link.active {
    background: #116E63;
    color: white !important;
}

.faq-container {
    width: 100%;
    max-width: 650px;
    margin: auto;
}

.faq-item {
    padding: 0;
}

.faq-question {
    background: none;
    border: none;
    padding: 10px;
    width: 100%;
    text-align: left;
    font-size: 25px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.faq-answer {
    display: none;
    padding: 15px;
    color: #333;
}

.faq-answer p {
    margin: 10px 0;
}

.faq-divider {
    height: 1px;
    background: #ccc;
    margin: 5px 0;
}

.faq-question .arrow {
    font-size: 30px;
    transition: transform 0.3s ease;
}

.faq-question.active .arrow {
    transform: rotate(90deg);
}

table {
    border-collapse: collapse;
    width: 100%;
    max-width: 600px;
}

thead {
    background-color: #f0f7f2;
    /* Light green background like your image */
}

th {
    text-align: left;
    padding: 12px;
    font-weight: bold;
    color: #003366;
}

td {
    padding: 12px;
    color: #555;
}

tr:nth-child(even) {
    background-color: #fff;
}

.step-card {
    background: #fff;
    border-radius: 15px;
    transition: all 0.3s ease-in-out;
}

.step-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.icon-box {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 24px;
}

/* admission section end  */

.here_contact {
    color: #0b0b3a;
}

.outer_contact {
    border: 2px solid #116E63;
    padding: 5px;
}

.contact-wrapper {
    border: 2px solid orange;
    padding: 30px;
    /* margin: 40px auto; */
    position: relative;
    border: 2px solid orange;
}

.contact-wrapper h4 {
    color: orange;
    font-weight: 700;
}

.form-control::placeholder {
    color: #999;
    font-size: 0.9rem;
}

.btn-orange {
    background-color: #FDA31B;
    color: white;
    border: none;
}

.contact-info {
    background-color: #0b0b3a;
    color: white;
    padding: 15px;
    margin-bottom: 15px;
    position: relative;
}

.contact-info .icon-box {
    position: absolute;
    top: 50%;
    right: -25px;
    transform: translateY(-50%);
    background-color: orange;
    color: white;
    padding: 10px;
}

.contact-info strong {
    display: block;
    color: orange;
    font-weight: bold;
    margin-bottom: 5px;
}

.contact-info a:hover {
    color: #FDA31B;
}

@media (max-width: 768px) {
    .contact-wrapper {
        padding: 20px;
    }

    .icon-box {
        right: -20px;
    }
}

.contact-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.contact-info {
    border: 1px solid #ddd;
    padding: 30px 15px;
    margin-bottom: 15px;
    border-radius: 6px;
    transition: background 0.3s, box-shadow 0.3s;
}

.contact-info:hover {
    box-shadow: 0 0px 12px rgba(11, 11, 58, 0.467);
    cursor: pointer;
}

.form-control:focus {
    box-shadow: 0 0px 12px rgba(11, 11, 58, 0.467) !important;
    border: none !important;
}

/* pop up css start */
/* Overlay */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: none;
    justify-content: center;
    align-items: stretch;
    z-index: 9999;
}

/* Popup (left slide) */
.popup {
    background: #fff;
    width: 1000px;
    height: 100vh;
    position: relative;
    left: -100%;
    top: 20;
    padding: 20px;
    /* box-shadow: 5px 0px 20px rgba(0, 0, 0, 0.3); */
    transition: all 0.5s ease;
    display: flex;
    flex-direction: column;
}

.overlay.active {
    display: flex;
}

.overlay.active .popup {
    left: 0;
}

/* Header */
.popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.popup-header h2 {
    font-size: 30px;
    margin: 0;
}

.close {
    cursor: pointer;
    font-size: 24px;
    font-weight: bold;
}

/* Form scroll */
.form-content {
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    padding-right: 5px;
}

.form-content h4 {
    margin: 15px 0 10px;
    font-size: 16px;
    padding: 0px 30px;
    color: #0B0B3A;
}

/* Floating Labels */
.form-group {
    position: relative;
    margin-bottom: 18px;
}

.form-group input,
.form-group select {
    width: 100%;
    padding: 12px 12px 12px 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 14px;
    outline: none;
    background: transparent;
    transition: all 0.3s ease;
}

.form-group label {
    position: absolute;
    left: 12px;
    top: 12px;
    color: #777;
    font-size: 14px;
    pointer-events: none;
    transition: all 0.3s ease;
    background: #fff;
    padding: 0 4px;
}

/* Floating effect on focus or filled */
.form-group input:focus+label,
.form-group input:not(:placeholder-shown)+label,
.form-group select:focus+label,
.form-group select:valid+label {
    top: -8px;
    font-size: 12px;
    color: #0B0B3A;
}

/* Input hover/focus */
.form-group input:hover,
.form-group select:hover {
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

.form-group input:focus,
.form-group select:focus {
    border-color: #0B0B3A;
    box-shadow: 0px 5px 12px rgba(39, 174, 96, 0.3);
}

/* Submit button */
.submitBtn {
    width: 100%;
    padding: 12px;
    border: none;
    background: #0B0B3A;
    color: #fff;
    font-weight: bold;
    border-radius: 25px;
    cursor: pointer;
    margin-top: 15px;
    transition: all 0.3s ease;
}

.submitBtn:hover {
    background: #0a0a36ff;
    box-shadow: 0px 5px 15px rgba(39, 174, 96, 0.4);
}

/* pop up css end */




/*achievement page css start */
 .achievement-section {
        background: #fff;
    }

    .img-border {
        display: inline-block;
        padding: 5px;
        border: 1px solid #fb8c00;
        position: relative;
    }

    .img-border img {
        border: 1px solid #0B0B3A;
        display: block;
         padding: 5px;
    }
/*achievement page css end */

/*college main person css start*/
     .img_box_ {
         width: 300px;
         height: 350px;
         text-align: center;
         display: flex;
         justify-content: center;
         align-items: center;
     }

     .main-img {
         transition: transform 0.6s ease, box-shadow 0.3s ease;
         width: 100%;
         height: 100%;
         object-fit: cover;
     }

     .main-img:hover {
         transform: scale(1.1);
         box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.3);
     }
/*college main person css end*/



/*who_we_are page start */
  .story_box {
    position: absolute;
    background-color: #FDA31B;
    width: 150px;
    bottom: 20px;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border-radius: 8px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    transition: all 0.3s ease-in-out;
}

.story_box:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 18px rgba(0,0,0,0.3);
}

/* Play Button Circle */
.play-btn {
    width: 40px;
    height: 40px;
    margin-left: 10px;
    border-radius: 50%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FDA31B;
    font-size: 20px;
    position: relative;
    box-shadow: 0 0 10px rgba(255,255,255,0.6);
    transition: all 0.4s ease;
}

/* Hover Effect */
.play-btn:hover {
    background: #FFD580;
    color: #fff;
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(255,255,255,0.9);
}

/* Pulse Animation */
.play-btn::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.6);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); opacity: 1; }
    100% { transform: scale(1.8); opacity: 0; }
}
/*who_we_are page end */

/*infrastructure page css start */
 .infra-header {
        position: relative;
        background: linear-gradient(125deg, rgba(11, 11, 58, 0.85), rgba(0, 123, 94, 0.85)), url('') no-repeat center/cover;
        color: white;
        padding: 50px 20px;
        text-align: center;
    }

    .infra-header h1 {
        font-size: 3rem;
        font-weight: bold;
    }

    .infra-header p {
        font-size: 1.2rem;
        margin-top: 10px;
    }

    .infra-section {
        padding: 80px 20px;
    }

    .infra-card {
        background: white;
        border-radius: 15px;
        overflow: hidden;
        box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
        transition: transform 0.3s ease;
    }

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

    .infra-img img {
        width: 100%;
        height: 200px;
        object-fit: cover;
    }

    .infra-content {
        padding: 20px;
        text-align: center;
    }

    .infra-content i {
        font-size: 2.5rem;
        color: #007B5E;
        margin-bottom: 15px;
    }

    .infra-content h3 {
        color: #0B0B3A;
        font-weight: bold;
        margin-bottom: 10px;
        
    }

    .infra-content p {
        color: #555;
    }
/*infrastructure page css end */


/*Our Colleges page css start */
 .hover-scale {
        transition: all 0.3s ease-in-out;
    }

    .hover-scale:hover {
        transform: translateY(-10px) scale(1.03);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2) !important;
    }

    .nav-pills .nav-link {
        margin: 2px;
        border-radius: 50px;
        font-size: 0.85rem;
    }

    .nav-pills .nav-link.active {
        background: #0d6efd;
    }

    .icon-circle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        font-size: 16px;
    }

    .contact-card_page p {
        font-size: 15px;
    }

    .contact-card_page a:hover {
       
    }
/*Our Colleges page css end */


/*our_staff page css start */
   table tbody tr:hover {
        background-color: rgba(0, 123, 94, 0.1);
        transition: 0.3s;
    }
/*our_staff page css end */


/*notice page css start */
    .page-header_notice_notice {
      background: #0b0b3a;
      color: #fff;
      padding: 60px 20px;
      text-align: center;
      border-radius: 0 0 20px 20px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

    .page-header_notice_notice h1 {
      font-weight: 700;
      font-size: 2.2rem;
    }

    .page-header_notice p {
      margin-top: 10px;
      font-size: 1.1rem;
      color: #e9f2ff;
    }

    .notice-list {
      background: #fff;
      border-radius: 12px;
      padding: 30px;
      margin-top: -30px;
      box-shadow: 0 6px 20px rgba(0,0,0,0.08);
    }

    .notice-item {
      
      margin: 12px 0;
      position: relative;
      padding-left: 25px;
    }

    .notice-item:last-child {
      border-bottom: none;
    }

    .notice-item::before {
      content: "➤";
      position: absolute;
      left: 0;
      color: #0d6efd;
    }

    .notice-item a {
      text-decoration: none;
      color: #0d6efd;
      font-weight: 500;
      transition: all 0.3s;
    }

    .notice-item a:hover {
      color: #084298;
      text-decoration: underline;
    }
/*notice page css end */

/*OUR GALLERY page css start */
 .gallery-card {
         overflow: hidden;
     }

     .gallery-card img {
         transition: 0.4s;
     }

     .gallery-card:hover img {
         transform: scale(1.13);
     }

     .gallery-card .overlay_img {
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background: rgba(0, 0, 0, 0.6);
         color: #fff;
         display: flex;
         flex-direction: column;
         align-items: center;
         justify-content: center;
         opacity: 0;
         transition: 0.4s;
     }

     .gallery-card:hover .overlay_img {
         opacity: 1;
     }

     .custom-close {
         position: absolute;
         top: 10px;
         right: 10px;
         background-color: #fff;
         border-radius: 50%;
         padding: 6px;
         opacity: 0.9;
         outline: none !important;
         box-shadow: none !important;
     }

     .custom-close:focus {
         outline: none !important;
         box-shadow: none !important;
     }

     /* Custom Tab Base */
     .custom-tab {
         cursor: pointer;
         margin: 0 6px;
         padding: 10px 24px;
         border: 2px solid #ff7f27;
         /* Orange border */
         border-radius: 30px;
         /* Rounded pill shape */
         color: #ff7f27;
         /* Orange text */
         font-weight: 600;
         transition: all 0.3s ease;
         background: transparent;
     }

     /* Hover Effect */
     .custom-tab:hover {
         background: #ff7f27;
         color: #fff !important;
         transform: translateY(-2px);
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
     }

     /* Active Tab */
     .custom-tab.active {
         background: #ff7f27;
         color: #fff !important;
         box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
     }
/*OUR GALLERY page css end */

/*courses-institute and courses-nursing page css start */
    .modal-content {
        border-radius: 1rem;
    }

    .modal-footer .btn {
        min-width: 120px;
    }
/*courses-institute and courses-nursing page css end */