/* Base Color Code */
:root {
    --color-blue: #00C2C2;
    --color-yellow: #F6BB3A;
    --color-block: #122720;
    --light-white: #F3F4F4;
    --brown:#6B7280;
    --dryblue:#374151;
    --low-orange:#FFEDD5;
    --orange:#EA580C;
}

/* Import Fonts */

/* @import url('/fonts/nunito-sans.bold.ttf'); */

@font-face {
    font-family: 'NunitoSans_bold';
    src: url('/fonts/nunito-sans.bold.ttf');
}
@font-face {
    font-family: 'NunitoSans_regular';
    src: url('/fonts/NunitoSans-Regular.ttf');

}
@font-face {
    font-family: 'NunitoSans_medium';
    src: url('/fonts/');
    
}
@font-face {
    font-family: 'Montserrat_regular';
    src: url('/fonts/montserrat.regular.ttf');
}



.team-member-hover1:hover .member-info {
  background: transparent !important;
}

.team-member-hover1:hover .member-info h3,
.team-member-hover1:hover .member-info p {
  color: transparent !important;
  opacity: 0 !important;
}

.mentor-card:hover .mentor-info {
  background: transparent !important;
}

.mentor-card:hover .mentor-info h6,
.mentor-card:hover .mentor-info p {
  color: transparent !important;
  opacity: 0 !important;
}

 /* .mentor-card:hover .mentor-overlay {
  opacity: 3;
  visibility: visible;
  z-index: 2;
  box-shadow: 0 4px 32px rgba(232, 199, 19, 0.4); 
}  */

.dropdown-item {
    display: block;
    width: 100%;
    padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);
    clear: both;
    font-weight: 400;
    color: #ffffff;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    border-radius: var(--bs-dropdown-item-border-radius, 0);
}

.news-card-content .news-meta span{
    color: #333333!important;
     font-size: 20px!important;
     font-family: 'Nunito Sans', sans-serif;
     font-weight: 500!important;
}

/* Custom Navbar Background */
  .custom-navbar {
    
    padding-top: 15px !important; /* pt-4 equivalent with some adjustment */
    padding-bottom: 15px !important;
  }

  /* Custom Logo Text Box (mimicking the yellow bar) */
  .logo-text-box {
    background-color: #f7a81b; /* Yellow color from screenshot */
    color: #000;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 0.9rem;
    font-weight: 700;
    margin-left: 5px;
  }

  /* Register Button Style */
  .btn-register {
    background-color: #F6BB3A!important;
    color: #fff;
    border: none;
    font-size: 16px;
     font-family: 'Nunito Sans', sans-serif;
    border-radius: 0px;
    font-weight: 700;
    padding: 8px 30px;
    text-decoration: none; /* For the <a> tag button */
  }
  .btn-register:hover {
    background-color: #e69d1a;
    color: #000;
  }

  

  /* Collapsed Menu Styling */
  .navbar-collapse {
    /* Large screens-la kooda mobile madhiri full width-kku dropdown-a aagum */
   
    padding: 10px;


      /* position: fixed;
    top: 12%;
    right: 7.5%;
    width: 22%;  */
    /* 👈 only half the screen */
    /* height: 50vh;
            backdrop-filter: blur(8px);
        border-radius: 8px;
        background-color: rgba(255, 255, 255, 0.114);
    padding-top: 0px;
    transition: all 0.3s ease; */
  }


  
  .navbar-collapse .nav-link {
    color: #fff !important;
  }
  .navbar-collapse .nav-link:hover {
    color: #f7a81b !important;
  }
  .menu-toggle-button {
  background-image: url('/images/menuicon.png'); /* or .png */
  background-repeat: no-repeat;
  background-size: contain;
  color: #fff;
  /* Adjust width and height */
  width: 30px;
  height: 30px;
  /* other styles */
}
/* Default closed state */
#navbarNav {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease-in-out;
}

/* When menu is open */
#navbarNav.show {
    opacity: 1;
    visibility: visible;
}



  /* Hiding the menu list in large screens when not expanded: */
  /* This is handled by removing the 'navbar-expand-xl' class,
     making the menu always collapse by default until the hamburger is clicked. */


/* When menu is open */



.fixed-top{
  position: absolute;
  top: 0px;

}

.navbar-brand {
      display: flex;
      align-items: center;
    }

    .navbar-brand img {
      /* margin-right: 10px; 
      */
      /* margin-left: 54px; */
         margin-left: 30px;
      width: auto!important;
    }
    .width{
    width: 295px;
   }

   .navbar-nav{
    font-family: 'inter-Bold28';
    font-size: 17px;
   
    font-weight: 100;
}
    .nav-link {
      color: #fff !important;
    }

    .nav-link.active {
      /* font-weight: bold; */
      border-bottom: 2px solid white;
    }
.one{
  font-family: 'NunitoSans_regular';
  font-size: 16px!important;
}
.fw-bold{
   font-family: 'NunitoSans_bold';
   font-size: 20px;
   line-height: 140%;
}
.search-container_1 {
  position: absolute;
  top: 40%;
  right: 20%;
  /* left: 25%; */
  z-index: 1000;
}
.search-box {
  position: relative;
  width: 40px;
  height: 40px;
  transition: width 0.4s ease;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 20px;
  /* background-color: #fff; */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 10px;
}
.search-box.expanded {
  width: 150px;
  justify-content: space-between; /* Push icon to right */
  border-color: white;            /* ✅ White border on expand */
  
}
.search-box.expanded .search-icon {
  color: white!important;
}
.search-box.expanded #search-input::placeholder {
  color: white;
  opacity: 1;
  font-size: 12px;
  font-family: 'inter-Regular';
}
#search-input {
  border: none;
  outline: none;
  font-size: 14px;
  width: 100%;
  opacity: 0;
  transition: opacity 0.3s ease;
  direction: ltr;
}
.search-box.expanded #search-input {
  opacity: 1;
    color: white;
}

.search-box1.expanded #search-input {
  opacity: 1;
    color: white;
}

.search-box.expanded #search-input::placeholder {
  color: white;
  opacity: 1;
  font-size: 12px;
  font-family: 'inter-Regular';
}

.search-box1.expanded #search-input::placeholder {
  color: white;
  opacity: 1;
  font-size: 12px;
  font-family: 'inter-Regular';
}
.search-icon {
  color: #ffffff;
  font-size: 16px;
  cursor: pointer;
  margin-left: 8px;
}
.search-box.expanded .search-icon {
  color: white!important;
}

.search-box1.expanded .search-icon {
  color: white!important;
}
 .btn-yellow{
 background-color: #F6BB3A;
    padding: 8px 30px;
     /* padding: 10px 20px;*/
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    font-family: 'Nunito Sans', sans-serif;
    line-height: 140%;
    border-radius: 0px;
        flex-shrink: 0;
}
.btn-yellow:hover{
  background-color: #00C2C2;
  color: #fff;
}

/*.btn-yellow {
    background-color: #F6BB3A;
    padding: 8px 30px;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    font-family: 'Nunito Sans', sans-serif;
    line-height: 140%;
    border-radius: 0px;
    position: relative;
    overflow: hidden;
    display: inline-block;
    transition: 0.3s ease;
    flex-shrink: 0;
}

 Top & bottom sliding layers 
.btn-yellow:before,
.btn-yellow:after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #00C2C2!important; /* hover background color 
    transition: transform .4s ease;
    z-index: -1;
}

.btn-yellow:before {
    top: 0;
    transform: translateY(-100%);
}

.btn-yellow:after {
    bottom: 0;
    transform: translateY(100%);
}
*/
/* Hover animation 
.btn-yellow:hover {
    color: #fff;
    
}

.btn-yellow:hover:before {
    transform: translateY(-50%);
}

.btn-yellow:hover:after {
    transform: translateY(50%);
}

*/



 /* Hero Section */
    .hero {
      position: relative;
      /* background: url('/public/images/Alumni_home_bg.png') no-repeat center center/cover; */
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }
   
.hero-overlay {
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
     /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text {
      position: relative;
      z-index: 1;
      padding-left: 100px;
      top: 5%;
      /* max-width: 700px; */
    }

    .hero-text h1 {
      color: #ffffff;
      /* font-family: 'NunitoSans_bold'; */
       font-family: 'Nunito Sans', sans-serif;
       font-weight: 700;
     /* font-size: 48px; */
     font-size: clamp(1.5rem, 3vw, 3rem);
     margin-bottom: 40px;
     line-height: 140%;
    }

    .hero-text p {
      font-size: 20px;
      margin-top: 10px;
      width: 47%;
      
    }
.width_max{
  width: 40%!important;
}

 .slideshow-container {
      position: relative;
      width: 100%;
      height: 100%;
    }

    .slideshow-img {
      position: absolute;
      top: 11px;
      /* left: 16px;
      width: 68px; */
      /* left: 22px; */
      left: 0;
      width: 60px;
      height: auto !important;
      opacity: 0;
      transition: opacity 1s ease-in-out;
    }

    /* Corrected selector */
    .slideshow-img.active-img {
      opacity: 1;
    }
    #image2{
      /* width: 88px; */
      /* width: 76px; */
          width: 94px;
    /* left: -12px; */
    left: -18px;
    position: absolute;
    /* top: 6px; */
    top: 4px;
    }

    .mentorship-section .container{
        padding-left: 0px!important;
        margin-left: 0px!important;
    }
   

/* ---------- 3 Box Section (joined style) ---------- */
.connect-section {
  position: relative;
  margin-top: -90px; /* overlaps hero bottom */
  z-index: 10;
}

.connect-wrapper {
 margin: 0px 100px!important;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

.connect-box {
  background: #fff;
  padding: 50px 20px;
  transition: all 0.3s ease;
  cursor: pointer;
  font-family: 'Nunito Sans', sans-serif;
  flex: 1;
}

.connect-box h5 {
  font-weight: 700;
  color: #333333;
  font-size: 32px;
  margin-bottom: 8px;
  line-height: 140%;
  font-family: 'NunitoSans_bold';
}

.connect-box p {
  margin: 0;
  color: #333;
  line-height: 140%;
  font-size: 20px;
   font-family: 'Nunito Sans', sans-serif;
   font-weight: 500;
}

.connect-box:hover, .connect-box.active {
  background: #00C2C2;
  color: #fff;
}

.connect-box:hover h5, .connect-box.active h5,
.connect-box:hover p, .connect-box.active p {
  color: #fff;
}




/* Mobile responsive */
@media (max-width: 768px) {
  .connect-wrapper {
    flex-direction: column;
    border-radius: 0;
  }
  .connect-section {
    margin-top: -70px;
  }
}

.connect-wrapper {
  position: relative;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

/* ---------- Cyan Lines Between Boxes & Bottom Line ---------- */

.connect-wrapper {
  position: relative;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

/* Horizontal cyan line bottom of container */
.connect-wrapper::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #00C2C2;
}

/* Vertical cyan lines between boxes */
.connect-box {
  position: relative;
}

/* line after 1st and 2nd boxes only */
.connect-box:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  background-color: #00C2C2;
}

/* Hide vertical lines on mobile view for clean stacking */
@media (max-width: 768px) {
  .connect-box:not(:last-child)::after {
    display: none;
  }
}
.latest_news_highlights p {
    font-size: 20px;
    font-weight: 600;
    line-height: 140%;
    margin-bottom: 0px !important;
}



/* browser school section  */



 .school-section {
      text-align: center;
      /* padding: 80px 20px; */
      padding: 80px 0px 80px 100px;
       background-color: #ffffff;
    }
.school-section .container-fluid{
  --bs-gutter-x: 0rem;
}
  

    .school-section h2 {
      font-weight: 700;
      font-size: 40px;
     font-family: 'Nunito Sans', sans-serif;
      line-height: 140%;
      color: #333333;
      margin-bottom: 10px;
    }

    .school-section p {
      color: #838383;
      font-size: 24px;
      line-height: 140%;
      font-weight: 400;
      margin-bottom: 60px;
      font-family: 'Nunito Sans', sans-serif;
    }

    .school-section .splide__slide {
      display: flex;
      flex-direction: column;
      align-items: center;
      /* margin-top: 40px!important; */
    backface-visibility: hidden;
    box-sizing: border-box;
    -ms-flex-negative: 0;
    flex-shrink: 1;
    list-style-type: none !important;
    margin: 40px 0px 0px 0px;
    position: relative;

    }

    .school-card {
      /* background: #B3EDED; */
      border-radius: 95px;
      background: rgba(0, 194, 194, 0.3);
      width: 300px;
      height: 300px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      /* overflow: hidden; */
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      border: 5px solid transparent;
    }

    .school-card:hover {
      transform: translateY(-5px);
      /* border-color: #00C2C2; */
      box-shadow: 0 6px 16px rgba(0, 194, 194, 0.3);
    }

    .school-card img {
    width: 300px;
    height: 300px;
    object-fit: cover;
    /* border-bottom: 4px solid #00C2C2; */
    border-radius: 99px;
    position: relative;
    left: 8px;
    bottom: 18px;
    cursor:pointer;
    }

    .school-name {
      font-weight: 700!important;
      font-size: 20px!important;
      text-transform: uppercase;
      margin-top: 30px;
      margin-bottom: 10px!important;
      line-height: 140%!important;
      color: #333333!important;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    /* Adjust pagination color */
    .school-section .splide__pagination__page {
      background: #CCF3F3;
      width: 16px;
      margin-right: 20px;
      height: 16px;
    }

.school-section .splide__pagination__page.is-active {
    background: #00C2C2;
    transform: scale(1.4);
    z-index: 1;
    width: 72px;
    height: 16px;
    border-radius: 99px;
}
/* ---------- Splide Pagination Styling ---------- */
.school-section .splide__pagination {
  position: relative;
  width: fit-content;
  margin: 30px auto 0 auto; /* center horizontally */
  background-color: #fff;
  padding: 16px 40px;
  border-radius: 40px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Pagination dots */
.school-section .splide__pagination__page {
  /* background: #CCF3F3; */
  background: rgba(0, 194, 194, 0.2);
  width: 16px;
  height: 16px;
  margin: 0 6px;
  border-radius: 99px;
  transition: all 0.3s ease;
  cursor: pointer;
}

/* Active dot (cyan) */
.school-section .splide__pagination__page.is-active {
  background: #00C2C2;
  transform: scale(1.2);
}

/* Hover effect */
.school-section .splide__pagination__page:hover {
  background: #00C2C2;
}

.school-section .splide__list {
    display: flex;
    height: 100%;
    padding: 34px !important;
    margin-top: 26px!important;
}

#schoolSplide{
  margin-top: -80px;
  
}



/* latest news highlights */

.news-section {
      padding: 80px 100px;
       background-color: #FBFBFB;
    }

    .news-title {
      text-align: center;
      margin-bottom: 20px;
    }
    .news-section h2{
      font-size: 40px;
      line-height: 140%;
      color: #333333;
      font-weight: 700!important;
      font-family: 'Nunito Sans', sans-serif;
    }

.news-section p{
      font-size: 24px;
      line-height: 140%;
      color: #838383!important;
      font-weight: 400;
      font-family: 'Nunito Sans', sans-serif;
    }

    .news-item {
      /* background: #fff; */
     padding: 26px 40px;
      border-left: 4px solid transparent;
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .news-item:hover {
      background-color: #e8fafa;
    }

    .news-item.active {
      background-color: #d8ffff;
      border-left: 4px solid #00C2C2;
      color: #000;
    }
.news-item.active h6{
    font-weight: 700;
    margin-bottom: 5px;
    line-height: 140%;
    font-size: 28px;
    font-family: 'Nunito Sans', sans-serif;
    color: #000!important;
}

    .news-item h6 {
          font-weight: 500;
    margin-bottom: 5px;
    line-height: 140%;
    font-size: 24px;
    font-family: 'Nunito Sans', sans-serif;
    color: #747474!important;
    }

    .news-item p {
      font-size: 20px;
      color: #747474!important;
      line-height: 140%;
      font-weight: 500;
      font-family: 'Nunito Sans', sans-serif;
      margin: 0;
    }

    .news-image {
      position: relative;
      width: 100%;
      overflow: hidden;
      /* border-radius: 6px; */
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    }

    .news-image img {
      /* width: 881px; */
      height: 491px;
      object-fit: cover;
      width: 100%;
      /* height: auto; */
      /* border-radius: 6px; */
      transition: transform 0.4s ease;
    }

    .news-image img:hover {
      transform: scale(1.02);
    }

    .news-overlay {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      background: rgba(0, 0, 0, 0.5);
      color: #fff;
      /* padding: 15px 32px; */
      padding: 16px 60px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      backdrop-filter: blur(2px);

    } 
   .news-overlay:hover #newsDesc {
     display: -webkit-box!important;
    -webkit-box-orient: vertical!important;
    -webkit-line-clamp: 6!important;
    overflow: hidden!important;
    text-overflow: ellipsis!important;
    
   
}

    #newsTitle{
    font-family: 'Nunito Sans', sans-serif;
    font-size: 24px;
    line-height: 140%;
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    }

    
/* #newsImage {
    transition: opacity 0.4s ease-in-out;
} */


    .news-overlay button {
      background-color: #F6BB3A;
      border: none;
      color: #ffffff;
      font-weight: 700;
      font-size: 16px;
      font-family: 'Nunito Sans', sans-serif;
      padding: 10px 30px;
      /* border-radius: 4px; */
    }

    .news-overlay button a {
      background-color: #F6BB3A;
      border: none;
      color: #ffffff;
      font-weight: 700;
      font-size: 16px;
      font-family: 'Nunito Sans', sans-serif;
     
      /* border-radius: 4px; */
    }
/* Default-a ellorum p tag-ai maraikka (hide) */
.news-item p {
    display: none;
}

/* "active" class irukkum podhu mattum p tag-ai kaatta (show) */
.news-item.active p {
    display: block; /* block or flex use pannalaam */
}

/* Optional: Active illaadha items-ku transparency or light color set panna */
.news-item:not(.active) {
    opacity: 0.6; /* Konjam munga poga (fade) */
}

/* === Expand Overlay Upward on Hover === */

.news-overlay {
    height: 80px;            /* bottom bar visible normally */
    transition: all 0.4s ease;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.news-image:hover .news-overlay {
    height: 100%;           /* expands upwards */
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(5px);
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 80px 60px;
}

/* Smooth movement of content inside overlay */
.news-overlay #newsTitle,
.news-overlay a {
    transition: all 0.4s ease;
    transform: translateY(0);
}

.news-image:hover .news-overlay #newsTitle,
.news-image:hover .news-overlay a {
    transform: translateY(-10px);  /* move up slightly */
}

/* Description hidden normally */
#newsDesc {
    display: none;
    margin-top: 10px;
    font-size: 18px;
    line-height: 150%;
    color: #ffffff!important;
}

/* Show description on hover */
.news-image:hover #newsDesc {
    display: block;
    transform: translateY(-5px);
    transition: all 0.4s ease;
    margin-bottom:24px;
}

.news-image:hover #newsTitle
 {
    text-align: left;
    width: 100%;
}






.news-item.active {
    opacity: 1; /* Active item clear-a theriyum */
}
    @media (max-width: 768px) {
      .news-item {
        text-align: center;
      }
      .news-overlay {
        /* flex-direction: column; */
        gap: 10px;
      }
    }


/* .parent {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: repeat(12, 1fr);
    gap: 24px;
    padding: 80px 100px;
}
.div1 {
    grid-column: span 4 / span 4;
    grid-row: span 3 / span 3;
}

.div2 {
    grid-column: span 8 / span 8;
    grid-row: span 3 / span 3;
    grid-column-start: 5;
}

.div3 {
    grid-column: span 4 / span 4;
    grid-row: span 4 / span 4;
    grid-row-start: 4;
}

.div4 {
    grid-column: span 4 / span 4;
    grid-row: span 3 / span 3;
    grid-column-start: 5;
    grid-row-start: 4;
}

.div5 {
    grid-column: span 4 / span 4;
    grid-row: span 3 / span 3;
    grid-column-start: 5;
    grid-row-start: 7;
}

.div6 {
    grid-column: span 4 / span 4;
    grid-row: span 6 / span 6;
    grid-column-start: 9;
    grid-row-start: 4;
}

.div7 {
    grid-column: span 8 / span 8;
    grid-row: span 3 / span 3;
    grid-column-start: 5;
    grid-row-start: 10;
}

.div8 {
    grid-column: span 4 / span 4;
    grid-row: span 5 / span 5;
    grid-column-start: 1;
    grid-row-start: 8;
}

.image-hover-box {
  position: relative;
  overflow: hidden;
  /* border-radius: 10px; */
/* } */


 .mentorship-sectionnew {
  padding: 80px 100px;
  background-color:#fbfbfb;
     font-family: "Nunito Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}




.mentorship-contentnew h2 {
       font-weight: 700;
      font-size: 40px;
      line-height: 140%;
      margin-bottom: 18px;
      color:#333333;
    }

    .mentorship-contentnew .lead {
      color:#838383;
      font-weight: 400;
      margin-bottom: 30px;
      font-size: 24px;
      line-height: 140%;

    }

    .mentorship-contentnew p {
      color: #3d3d3d;
      line-height: 140%;
      margin-bottom: 30px;
      font-size: 25px;
font-weight: 400;

    }


 .btn-primary-custom {
      background-color: #F6BB3A;
      color: #fff!important;
      border: none;
      padding: 10px 20px;
      font-size: 16px;
      line-height: 140%;
      font-weight: 700;
    }
    .btn-outline-custom {
      background: transparent;
      border: 2px solid #F6BB3A;
      color: #F6BB3A!important;
      padding: 8px 18px;
      font-weight: 700;
      line-height: 140%;
      font-size: 16px;
    }
    .btn-outline-custom:hover { background: rgba(246,187,58,0.08); }

/* -----------------------------
   IMAGE GRID (LIKE SCREENSHOT)
------------------------------ */
.image-layoutnew {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 24px;
  height: 100%;
  margin-left: 16px;
  max-width:752px;
}

/* Left tall image */
.img-largenew img {
  width: 364px;
  height: 657px;
  object-fit: cover;
 
}

.img-largenew {
  grid-row: span 2;
  overflow: hidden;

}

/* Top-right small image */
.img-right-topnew img {
  width: 364px;
  height: 400px;

  object-fit: cover;
}

/* Cyan bottom card */
.img-right-bottomnew {
  display: flex;
  align-items: center;
  /* justify-content: center; */
}


.stat-cardnew {
      background-color: #00C2C2;
      color: #fff;
      padding: 32px;

        width: 364px;
  height: 233px;
    }

.stat-cardnew h3 {
   margin: 0;
         font-family: 'Nunito Sans', sans-serif;
      font-size: 64px;
      font-weight: 800;
      line-height: 120%;
      font-style: italic;
}

.stat-cardnew p {
      margin: 8px 0 0;
      color: rgba(255,255,255,0.95);
      font-weight: 500;
      font-size: 20px;
      font-family: 'Nunito Sans', sans-serif;
      line-height: 140%;
    }
    .mentorship-sectionnew .container-fluid {
        padding-left:0px;
        padding-right:0px;
    }



@media (max-width: 768px) {
    .image-layoutnew {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        margin-top:24px;
        margin-left: 0px;
    }
    .img-largenew img{
        width:100%;
    
        
    }
    .stat-cardnew{
        width:100%;
        padding:48px;
    }
    .img-right-topnew img{
        width:100%;

    }
}


/* -----------------------------
   RESPONSIVE SETTINGS
------------------------------ */
@media (min-width: 992px) and (max-width: 1336px) {

  .image-layoutnew {
    grid-template-columns: 1fr 1fr; /* Make both columns equal width */
    gap: 20px;
    justify-content: center;
  }

  /* Force all image containers to same width */
  .img-largenew img,
  .img-right-topnew img,
  .stat-cardnew {
    width: 100% !important;
    max-width: 320px; /* same width for all items */
    height:100%;
  }


}



/* Tablet & small screens */
@media (max-width: 768px) {
  /* .image-layoutnew {
    grid-template-columns: 1fr 1fr;
    gap: 15px;
  } */

  .stat-cardnew h3 {
    font-size: 40px;
  }
}
@media (min-width: 768px) and (max-width: 1024px){

.mentorship-sectionnew {
    padding: 60px 24px;}
}
/* Mobile */

/* ----------- MOBILE (MAX-WIDTH: 600PX) ----------- */
@media (max-width: 600px) {

 .mentorship-sectionnew .container-fluid {
        padding-left:14px;
        padding-right:14px;
    }
  .mentorship-sectionnew {
    padding: 60px 24px;
  }

  /* Grid becomes single column */
  .image-layoutnew {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    gap: 18px;
    margin-top: 28px;
  }

  /* LARGE IMAGE HIDE */
  .img-largenew {
    display: none !important;
  }

  /* TOP IMAGE – FULL WIDTH */
  .img-right-topnew img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover;
  }

  /* BOTTOM CARD – FULL WIDTH */
  .img-right-bottomnew,
  .stat-cardnew {
    width: 100% !important;
    height: auto !important;
  }

  .stat-cardnew {
    padding: 30px;
    text-align: center;
  }

  .stat-cardnew h3 {
    font-size: 48px;
  }

  .stat-cardnew p {
    font-size: 18px;
  }

  /* TEXT RESPONSIVE */
  .mentorship-contentnew h2 {
    font-size: 24px;
    text-align: center;
  }

  .mentorship-contentnew .lead,
  .mentorship-contentnew p {
    font-size: 16px;
    text-align: justify;
  }
   .mentorship-sectionnew .row>*{
        padding-left:0px;
        padding-right:0px;
    }
    .img-right-topnew {
    height: auto!important;
  }


}







    /* 🔹 Subscribe Section */
    .subscribe-section {
       font-family: 'Nunito Sans', sans-serif;
      text-align: center;
      overflow: hidden;
    }

    /* 🔹 Overlay Color */
    .subscribe-section::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 150, 150, 0.8); /* Teal Overlay */
      z-index: 1;
    }

    /* 🔹 Content */
    .subscribe-content {
      position: relative;
      z-index: 2;
       margin: 0 auto;
    }

    .subscribe-content h2 {
      font-size: 40px;
      font-weight: 700;
      line-height: 140%;
      margin-bottom: 10px;
    }

    .subscribe-content p {
      font-size: 24px;
      margin-bottom: 40px;
      font-weight: 500;
    }

    /* 🔹 Form Style */
    .subscribe-form {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 15px;
      width: 100%;
    }

    .subscribe-form input {
      width: 500px;
      height: 54px;
      padding: 15px;
      border: none;
      border-radius: 0px;
      font-size: 16px;
      outline: none;
      font-weight: 600;
    color: #c9c9c9;
      text-align: center;
    }

    .subscribe-form button {
      background: #F6BB3A;
      color: #fff;
      border: none;
      padding: 16px 40px;
      width: 100%;
      height: 54px;
      border-radius: 0px;
      cursor: pointer;
      transition: background 0.3s ease;
    }
.sub_btn{
  font-size: 16px;
  font-weight: 700;
}
    .subscribe-form button:hover {
      background: #e6a200;
    }



 section.past-events {
      padding: 80px 100px;
      text-align: center;
      font-family: "Nunito Sans", sans-serif;
      background-color: #ffffff;
      color: #333;
    }

    .past-events-title {
      font-size: 40px;
      font-weight: 700;
      line-height: 140%;
      color: #333333;
      margin-bottom: 10px;
    }

    .past-events-subtitle {
      color: #838383;
      margin-bottom: 60px;
      font-weight: 400;
      line-height: 140%;
      font-size: 24px;
    }

    /* Filter Buttons */
    .past-events-filters {
      display: flex!important;
      justify-content: center!important;
      flex-wrap: wrap!important;
      gap: 12px!important;
      margin-bottom: 50px!important;
      
    }

    .past-events-filters button {
      padding: 10px 20px;
      border: 2px solid #00C2C2;
      background: transparent;
      border-radius: 25px;
      color: #00C2C2;
      cursor: pointer;
      transition: 0.3s;
      
    }
    .past-events-filters button, .past-events-filters button.active {
      
        height: 100%;
        
    }
.view-all{
  height: 100%!important;
  margin-bottom: 0px!important;
}
    
    .past-events-btn p {
      font-size: 20px;
      font-weight: 600;
      line-height: 140%;
      margin-bottom: 0px!important;
    }

    .past-events-filters button.active,
    .past-events-filters button:hover {
      background: #00c2c2;
      color: #fff;
    }

    .past-events-filters .view-all {
      background: #F6BB3A;
      border-color: #F6BB3A;
      color: #fff;
      font-size: 20px;
      display: flex;
      line-height: 140%;
      font-weight: 600;
    }
    .past-events-filters .view-all p {
margin-bottom: 0px;
      color: #fff;
      font-size: 20px;
      line-height: 140%;
      font-weight: 600;
    }

    .past-events-filters .view-all:hover {
      background: #e6a200;
    }

    /* Bento Grid Layout */
    .past-events-grid {
      /* display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: repeat(3, 200px);
      gap: 15px;
      max-width: 100%;
      margin: 0 auto; */
      display: grid
;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 300px);
    gap: 15px;
    max-width: 100%;
    margin: 0 auto;
    }

    .past-events-item {
      position: relative;
      overflow: hidden;
      background: #e3e3e3;
      
    }

    .past-events-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.4s ease;
      opacity: 0;
    }

    .past-events-item:hover img {
      transform: scale(1.05);
    }

    .past-events-item::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.6) 50%,
        rgba(255,255,255,0) 100%);
    transform: translateX(-100%);
    animation: shimmerhome 1.5s infinite;
}

@keyframes bentoShimmerhome {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

.past-events-item.loaded::before {
    display: none;
}


.past-events-btn {
    font-size: 20px;
    font-weight: 600;
    line-height: 140%;
    margin-bottom: 0px !important;
  }
  @media(max-width:600px){
      .past-events-btn {
    font-size: 16px!important;
      }
       .past-events-btn .active{
    font-size: 16px!important;
      }
      
  }

    /* Custom grid spans for bento layout */
    .past-events-item:nth-child(1) {
      grid-column: span 2;
      grid-row: span 1;
      /* width: 752px;
      height: 320px; */
      width: 100%;
      height: auto;
    }

    .past-events-item:nth-child(2) {
      grid-column: span 1;
      grid-row: span 2;
      /* width: 364px;
      height: 664px; */
      width: 100%;
      height: auto;
    }

    .past-events-item:nth-child(3) {
      grid-column: span 1;
      grid-row: span 1;
      /* width: 364px;
      height: 320px; */
      width: 100%;
      height: auto;
    }

    .past-events-item:nth-child(4) {
      grid-column: span 1;
      grid-row: span 2;
      /* width: 364px;
      height: 664px; */
      width: 100%;
      height: auto;
    }

    .past-events-item:nth-child(5) {
      grid-column: span 1;
      grid-row: span 1;
      /* width: 364px;
      height: 320px; */
      width: 100%;
      height: auto;
    }

    .past-events-item:nth-child(6) {
      grid-column: span 2;
      grid-row: span 1;
      /* width: 752px;
      height: 320px; */
      width: 100%;
      height: auto;
    }

    .past-events-item:nth-child(7) {
      grid-column: span 1;
      grid-row: span 2;
      align-self: start;
          margin-top: -314px;
    height: 613px;
    /* width: 364px;
      height: 664px; */
      width: 100%;
    }

    
    .pagination-bullets {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 15px;
}

.pagination-bullets .bullet {
  width: 10px;
  height: 10px;
  background-color: rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.3s ease;
}

.pagination-bullets .bullet.active {
  background-color: #00bfc2;
  transform: scale(1.3);
}




 section.Spotlight_Alumni {
      text-align: center;
      padding: 50px 20px;
      background: #fff;
    }

    .Spotlight_Alumni h2 {
      font-size: 2rem;
      margin-bottom: 10px;
      color: #222;
    }

    .Spotlight_Alumni p {
      color: #666;
      margin-bottom: 40px;
    }

    .Alumni_Spotlight {
      width: 90%;
      margin: 0 auto;
    }

    .Alumni_Spotlight ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .Alumni_Spotlight li {
      position: relative;
      overflow: hidden;
      border-radius: 12px;
    }

    .Alumni_Spotlight img {
      width: 100%;
      height: 500px;
      object-fit: cover;
      border-radius: 12px!important;
      transition: transform 0.5s ease;
    }

    .flipster__item--current img {
      transform: scale(1.05);
    }

    /* Overlay for each image */
    .alumni-overlay {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 118px;
      display: flex;
      justify-content: space-between;
      align-items: stretch;
      padding:12px 60px 20px 60px;
      background: rgba(0, 0, 0, 0.4);
      backdrop-filter: blur(2px);
      border-bottom-left-radius: 12px;
      border-bottom-right-radius: 12px;
      color: #fff;
      box-sizing: border-box;
    }

    /* Left content */
    .alumni-left {
      display: flex
;
    flex-direction: column;
    justify-content: space-evenly;
    text-align: left;
    }

    .alumni-left h4 {
         margin: 0;
    font-size: 32px;
    font-weight: 700;
     font-family: 'Nunito Sans', sans-serif;
    }

    .alumni-left p {
    margin: 0;
    font-size: 20px;
    /* opacity: 0.9; */
    font-weight: 500;
    color: #fff;
    }

    /* Right button */
    .alumni-right {
      display: flex;
      align-items: center;
    }

    .alumni-right button {
    background-color: #F6BB3A;
      border: none;
      color: #ffffff;
      font-weight: 700;
      font-size: 16px;
      font-family: 'Nunito Sans', sans-serif;
      /* padding: 16px 40px; */
       padding: 8px 30px!important;
    }

    

    

footer {
      background-color: #012C28;
      color: #fff!important;
      padding: 80px 0px 0px 0px;
       font-family: 'NunitoSans_bold';
    }
    footer h5 {
      font-weight: bold;
      margin-bottom: 24px;
      font-size: 22px;
      line-height: 140%;
       font-family: 'NunitoSans_bold';
    }
    footer a {
      color: #fff;
      text-decoration: none;
    }
    /* footer a:hover {
      text-decoration: underline;
    } */
    .list-unstyled li a {
      font-family: 'NunitoSans_regular';
      font-size: 20px;
      line-height: 140%;
      margin-bottom: 24px;
       transform: translateX(20px)
    }
    .list-unstyled li a:hover{
      transform: scale(1.2);
    }
    .map-responsive {
      position: relative;
      overflow: hidden;
      padding-bottom: 56.25%;
      height: 0;
    }
    .map-responsive iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: 0;
    }
    .footer-bottom {
      margin-top: 30px;
      padding: 32px 100px;
      text-align: center;
      font-size: 14px;
      color: #EBEBEB;
      line-height: 160%;
      font-family: 'Montserrat_regular';
      display: flex;
      justify-content: space-between;
      border-radius: 40px 40px 0px 0px;
      background-color: #0A2F2F;
    }
     .Location{
      margin-right: 0px;
     }
     .Quick_links{
      margin-right: 0px;
     }
     .Social_media{
      font-size: 20px;
      line-height: 140%;
      /* cursor: pointer; */
      font-family: 'NunitoSans_regular';
      display: flex!important;
      flex-wrap: nowrap!important;
     }
     .Quick_links ul li{
      margin-bottom: 24px;
        
     }
     footer .footer-bottom .sm_privacy a{
font-weight:400!important;
}
footer .footer-bottom .sm_privacy a:hover{
font-weight:600!important;
}
.social-icons {
  display: flex;
  align-items: center;
  gap: 16px; /* spacing between icons */
}

.social-icons a {
  position: relative;
  color: white; /* or your theme color */
}

.social-icons a:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -20px; /* distance from the icon */
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 20px;
  background-color: #F8F9FA; /* Cyan vertical line */
  border-radius: 2px;
}
.social-icons a i:hover{
   transform: scale(1.5);
}

.social-icons a i{
  transition: transform 0.5s ease, color 0.3s ease;
}




/* Past Events Detail page */

/* Hero Section1 */
    .hero1 {
      position: relative;
      /* background: url('/images/Alumni_Past_Events.png') no-repeat center center/cover; */
     height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    .hero-overlay1{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
      /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text1 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text1 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text1 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }



/* Hero Section3 */
    .hero3 {
      position: relative;
      background: url('/images/Latest_news_hero_banner.png') no-repeat center center/cover;
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay3{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      background-color:rgba(18, 39, 32, 0.4); 
     /*  background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text3 {
      position: relative;
      z-index: 1;
      padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text3 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text3 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }


/* Hero Section4 */

    .hero4 {
      position: relative;
      background: url('/images/alumnibanner.jpg') no-repeat center center/cover;
     height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay4{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
     background-color:rgba(18, 39, 32, 0.4); 
      /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text4 {
      position: relative;
      z-index: 1;
      padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text4 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text4 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }

/* Hero Section2 */
.hero2 {
      position: relative;
      background: url('/images/alumnibanner.jpg') no-repeat center center/cover;
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay2{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      background-color:rgba(18, 39, 32, 0.4); 
     /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text2 {
      position: relative;
      z-index: 1;
      padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text2 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text2 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }


/* Hero Section5 */

    .hero5 {
      position: relative;
      /* background: url('/images/collaboratebanner.jpg') no-repeat center center/cover; */
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay5{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
     /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text5 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text5 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text5 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }


/* Hero Section6 */

    .hero6 {
      position: relative;
      background: url('/images/alumnibanner.jpg') no-repeat center center/cover;
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay6{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
      /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text6 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text6 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text6 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }


/* Hero Section7 */

    .hero7 {
      position: relative;
      /* background: url('/images/collaboratebanner.jpg') no-repeat center center/cover; */
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay7{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
     /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text7 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text7 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text7 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }

/* Hero Section8 */

    .hero8 {
      position: relative;
      /* background: url('/images/alumnibanner.jpg') no-repeat center center/cover; */
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay8{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4);
     /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text8 {
      position: relative;
      z-index: 1;
      padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text8 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text8 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }



/* Hero Section9 */

    .hero9 {
      position: relative;
      /* background: url('/images/contactbanner.jpg') no-repeat center center/cover; */
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay9{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4);
     /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text9 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text9 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text9 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      font-family: "Nunito Sans", sans-serif;
      color: #ffffff;
    }


/* Hero Section10 */

    .hero10 {
      position: relative;
      background: url('/images/alumnicommonbanner2.jpg') no-repeat center center/cover;
     height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay10{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
      /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text10 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text10 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text10 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
     font-family: "Nunito Sans", sans-serif;
    }



/* Hero Section11 */

    .hero11 {
      position: relative;
      background: url('/images/alumnibanner.jpg') no-repeat center center/cover;
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    

    .hero-overlay11{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
     /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text11 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text11 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text11 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      font-family: "Nunito Sans", sans-serif;
      color: #ffffff;
    }



    
/* Hero Section12 */
    .hero12 {
      position: relative;
      background: url('/images/Alumni_Past_Events.png') no-repeat center center/cover;
      height: 730px;
      display: flex;
      align-items: center;
      color: white;
    }

    .hero-overlay12{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
       background-color:rgba(18, 39, 32, 0.4); 
      /* background-color:rgba(179, 169, 25, 0.1); */
    }
    .hero-text12 {
      position: relative;
      z-index: 1;
       padding-left: 100px;
      top: 32%;
      bottom: 0%;
      /* max-width: 700px; */
    }

    .hero-text12 h1 {
      color: #ffffff;
      font-family: 'NunitoSans_bold';
     font-size: 48px;
     
     line-height: 140%;
    }

    .hero-text12 p {
      font-size: 24px;
      margin-top: 10px;
      font-weight: 500;
      line-height: 140%;
      color: #ffffff;
      font-family: "Nunito Sans", sans-serif;
    }



     /* ===== Breadcrumb ===== */
    .breadcrumb {
       font-family: "Nunito Sans", sans-serif;
  text-align: left;
      padding: 0px 0px;
      font-size: 16px;
      font-weight: 400;
      line-height: 140%;
      color: #ffffff;
      gap: 8px;
    }

    .breadcrumb a {
      color: #ffffff;
      text-decoration: none;
      /* transition: color 0.3s ease; */
       position: relative;
    }
.breadcrumb a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;          /* distance of line under the text */
    width: 0%;
    height: 1px;
    background-color: #fff; /* underline color */
    transition: width .35s ease;
}

.breadcrumb a:hover::after {
    width: 100%;           /* animation left → right */
}
    /* .breadcrumb a:hover {
      text-decoration: underline;
    } */

    .breadcrumb span {
      margin: 0 3px;
      color: #999;
    }


    /* Bento grid */

    /* ===== Section ===== */
    .event-section {
      /* max-width: 1100px; */
      margin: 0 auto; 
      font-family: "Nunito Sans", sans-serif;
      background-color: #ffffff;
      padding: 80px 100px 60px 100px;
    }

    .event-title {
      font-size: 28px;
      font-weight: 700;
      text-align: center;
      margin-bottom: 40px;
      color: #222;
    }
    .event-section .past-events-title {
      font-size: 40px;
      font-weight: 700;
      line-height: 140%;
      color: #333333;
      margin-bottom: 10px;
      text-align: center;
    }

   .event-section .past-events-subtitle {
      color: #838383;
      margin-bottom: 60px;
      font-weight: 400;
      line-height: 140%;
      font-size: 24px;
      text-align: center;
    }


    /* ===== Bento Grid ===== */
    .bento-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: repeat(3, 300px);
      gap: 15px;
    }

    .bento-item {
      position: relative;
      overflow: hidden;
    }

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

    .bento-item:hover img {
      transform: scale(1.05);
    }

    /* Custom Bento Layout */
    .bento-item:nth-child(1) {
      grid-column: span 2;
      grid-row: span 1;
    }

    .bento-item:nth-child(2) {
      grid-column: span 1;
      grid-row: span 2;
    }

    .bento-item:nth-child(3) {
      grid-column: span 1;
      grid-row: span 1;
    }

    .bento-item:nth-child(4) {
      grid-column: span 1;
      grid-row: span 2;
    }

    .bento-item:nth-child(5) {
      grid-column: span 1;
      grid-row: span 1;
    }

    .bento-item:nth-child(6) {
      grid-column: span 2;
      grid-row: span 1;
    }

    .bento-item:nth-child(7) {
      grid-column: span 1;
      grid-row: span 2;
      align-self: start;
      /* margin-top: -205px; */
          margin-top: -314px;
    height: 613px;
    width: 100%;
    }


 /* ===== bento grid women archivements Section ===== */
   .women_arc .bento-grid{
display: grid
;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 300px);
    gap: 15px;
}


/* Custom Bento Layout */
    .women_arc .bento-item:nth-child(1) {
      grid-column: span 2;
      grid-row: span 1;
    }

   .women_arc .bento-item:nth-child(2) {
      grid-column: span 1;
      grid-row: span 1;
    }

   .women_arc .bento-item:nth-child(3) {
      grid-column: span 1;
      grid-row: span 1;
    }

   .women_arc .bento-item:nth-child(4) {
      grid-column: span 2;
      grid-row: span 1;
    }



    /* ===== bento grid women archivements Section ===== */
   .kavin_moment .bento-grid{
display: grid
;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 300px);
    gap: 15px;
}


/* Custom Bento Layout */
    .kavin_moment .bento-item:nth-child(1) {
      grid-column: span 1;
      grid-row: span 1;
    }

   .kavin_moment .bento-item:nth-child(2) {
      grid-column: span 1;
      grid-row: span 1;
    }

   .kavin_moment .bento-item:nth-child(3) {
      grid-column: span 1;
      grid-row: span 2;
    }

   .kavin_moment .bento-item:nth-child(4) {
      grid-column: span 2;
      grid-row: span 1;
    }

    /* ===== Event Info Section ===== */
    .event-info {
      margin-top: 40px;
    }

    .event-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 40px;
      align-items: center;
      font-size: 15px;
      color: #555;
      margin-bottom: 20px;
    }

    .event-meta span {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 24px;
      line-height: 140%;
      font-weight: 500;
color: #333333;
    }

    .event-meta svg {
      width: 18px;
      height: 18px;
      fill: #333333;
      /* fill: #00bfa6; */
    }

    .event-description {
      color: #747474;
      font-size: 24px;
      line-height: 140%;
      text-align: justify;
      font-weight: 500;
      font-family: "Nunito Sans", sans-serif;
    }

    /* ===== Responsive ===== */
    @media (max-width: 992px) {
      .bento-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
      }

      .bento-item {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
        margin-top: 0 !important;
      }
    }

    @media (max-width: 576px) {
      .bento-grid {
        grid-template-columns: 1fr;
      }

      .bento-item {
        height: 250px;
      }

      .event-meta {
        flex-direction: row;
        align-items: flex-start;
        justify-content: start;
      }
      .event-meta {
        gap: 20px
        ;
      }
      .event-meta span{
        font-size: 15px;
      }
      .event-description {
        font-size: 18px;
      }
    }

.team-section .image-container{
    /* padding-top: 60%; */
}

.Orca-event-section .container-fluid{
    padding-left: 0px;
    padding-right: 0px;
}
    /* Hide desktop section in mobile */
@media (max-width: 600px) {
  .news-section {
    /* display: none !important; */
    padding: 60px 24px;
  }

    .image-layout {
        grid-template-columns: 1fr !important;
    }

  .mobile-news-slider img {
    width: 100%;
    height: auto;
    border-radius: 10px;
  }

  .alumni_form_page {
    background-color: #EBFFFF;
    padding: 60px 24px!important;
}
}

@media (min-width: 1500px) {
  .container {
    max-width: 1400px;
    width: 100%;
  
  }
}

.job_banner {
      position: relative;
      background: url('/images/jobs_banner.png') no-repeat center center/cover;
      /* height: 85vh; */
      height: 720px;
      display: flex;
      align-items: center;
      color: white;
      object-fit: cover;
    }

    .over_lay{
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      background-color:rgba(18, 39, 32, 0.4);
    }
    .sm-iframe{
      height: 234px!important;
      width: 344px;
    }





/* --- General Styling --- */
.team-section {
    background-color: #FBFBFB;
    padding: 80px 100px;
}

.team-member {
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    height: 100%; 
    display: flex;
    flex-direction: column;
    /* Added: Essential for positioning the absolute overlay to cover the whole card */
    position: relative; 
}
.team-member-hover:hover .Our_mentor{
      background-color: transparent!important;
    }
.image-container {
    position: relative;
    overflow: hidden;
    padding-top: 100%; 
    height: 100%;
}

.image-container img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.member-info {
    padding: 20px 30px ;
    text-align: left;
    position: relative; /* Keep relative/z-index to handle static state */
    z-index: 1; 
    height: 100%!important;
    background-color: #ffffff; /* Explicit background for member info */
}

.Our_mentor{
   padding:24px 40px 32px 40px ;
    text-align: left;
    position: relative; /* Keep relative/z-index to handle static state */
    z-index: 1; 
    /* background-color: #83A320; Explicit background for member info */

}

.Our_mentor2{
   padding: 24px 40px 32px 40px ;
    text-align: left;
    position: relative; /* Keep relative/z-index to handle static state */
    z-index: 1; 
    background-color: #9D62C6; /* Explicit background for member info */

}

.Our_mentor3{
   padding: 24px 40px 32px 40px ;
    text-align: left;
    position: relative; /* Keep relative/z-index to handle static state */
    z-index: 1; 
    background-color: #985939; /* Explicit background for member info */

}

.Our_mentor4{
   padding: 24px 40px 32px 40px ;
    text-align: left;
    position: relative; /* Keep relative/z-index to handle static state */
    z-index: 1; 
    background-color: #F7BC98; /* Explicit background for member info */

}




.member-info .name {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 5px;
      font-family: "Nunito Sans", sans-serif;
         text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: clip; 
}

.member-info .batch {
    font-size: 20px;
    font-weight: 400;
    color: #747474;
    margin-bottom: 8px;
      font-family: "Nunito Sans", sans-serif;
          /* display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: clip;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis; */
}

/* --- Overlay Styling (Changes Applied Here) --- */

.team-member-hover .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;

    bottom: 0; 
    width: 100%;
    
   
    transform: scaleY(0); 
    transform-origin: bottom; 
    
    background-color: rgba(0, 194, 194, 0.8);
    transition: transform 0.5s ease-out;
    
    display: flex;
    align-items: flex-end; 
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    opacity: 1;
    pointer-events: none; 
    z-index: 2; 
}

.pt-127%{
    padding-top:127%!important;
}

.team-member-hover1 .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; 
    width: 100%;
    transform: scaleY(0);
    transform-origin: bottom;
    
    /*  Use dynamic variable color (defined inline in PHP) */
    background-color: color-mix(in srgb, var(--memberColor) 85%, transparent); 
    transition: transform 0.5s ease-out, background-color 0.3s ease-in;
    
    display: flex;
    align-items: flex-end;
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    opacity: 1;
    pointer-events: none;
    z-index: 2;
}


.team-member-hover .overlay-content .content-wrapper{
    /* Style for the text content inside the overlay */
    width: 100%;
    /* New: Control content visibility with opacity/delay */
    opacity: 0; 
    transition: opacity 0.3s ease; 
    flex-direction: column;
    align-items: flex-start;
}

.team-member-hover .overlay-content .name {
    font-size:28px;
    font-weight: 800;
    margin-bottom: 8px;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover .overlay-content .detail-line {
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover .overlay-content .location i {
    margin-right: 5px;
}
.team-member-hover .overlay-content .location {
    font-size: 16px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover .overlay-content .batch {
    font-size: 20px!important;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}

.know-more-btn {
    margin-top: 15px;
    background-color: #F6BB3A; 
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    border-radius:0px;
    padding: 8px 20px;
}

/* --- DESKTOP/TABLET HOVER EFFECT --- */
@media (min-width: 320px) {
   .team-member-hover:hover .image-container img {
        transform: scale(1.05); /* Slight zoom on the image */
    }

    .team-member-hover:hover .overlay-content {
        /* EXPAND: Makes the overlay cover the FULL CARD area */
        transform: scaleY(1); /* Expands from bottom to cover 100% height */
        pointer-events: auto; /* Enable clicks on the button */
        transition-delay: 0s; 

    }

    .team-member-hover:hover .overlay-content .content-wrapper {
        opacity: 1; /* Reveal the content after the overlay has expanded */
        transition-delay: 0.5s; /* Delay matches the transform transition, for staggered reveal */
    flex-direction: column!important;
    }
    .team-member-hover:hover .member-info{
      background-color: transparent;
    }
    .team-member-hover:hover .member-info .name{
      color: transparent;
    }
     .team-member-hover:hover .member-info .batch{
      color: transparent;
    }
 
}
    

/* --- MOBILE RESPONSIVENESS (Screens < 768px) --- */
@media (max-width: 767.98px) {


     
    
}

.team-section h2{
  color: #122720;
  font-size: 40px;
  font-weight: 700;
    font-family: "Nunito Sans", sans-serif!important;
}
.team-section .container {
  --bs-gutter-x: 0px;
}

.team-section .tag{
  color: #838383;
   font-size: 24px;
  font-weight: 400;
    font-family: "Nunito Sans", sans-serif!important;
}


/* mentorship  */


    .mentorship-section {
  background: #FBFBFB;
  font-family: "Nunito Sans", sans-serif;
}

/* ---------- Image Layout ---------- */
.image-layout {
  display: grid;
  grid-template-columns: 1fr 0.8fr;
  grid-template-rows: 1fr 1fr;
  gap: 24px;
  position: relative;
}

/* Tall Left Image */
.img-large {
  grid-row: 1 / span 2;
  grid-column: 1;
}

/* Top Right Image */
.img-right-top {
  grid-row: 1;
  grid-column: 2;
}

/* Bottom Right Stat Card */
.img-right-bottom {
  grid-row: 2;
  grid-column: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Stat Card Styling */
.stat-card {
  /* background: linear-gradient(135deg, #00bcd4, #0097a7); */
  background-color: #00C2C2;
  color: white;
  padding: 32px;

}
.icon-hover:hover{
    display:inline-block; 
}




/* ---------- Buttons ---------- */
.btn-primary-custom {
  background-color: #F6BB3A;
  border: none;
  color: #000;
  font-weight: 600;
  /* padding: 10px 20px; */
  padding: 8px 30px;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.btn-primary-custom:hover {
  /* background-color: #e0a800; */
  color:#000;
}

.btn-outline-custom {
  background-color: transparent;
  border: 2px solid #F6BB3A;
  color: #000;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.btn-outline-custom:hover {
  /* background-color: #; */
  color: #000;
}

/* ---------- Responsive ---------- */
@media (max-width: 992px) {
  .image-layout {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 768px) {
  .image-layout {
    grid-template-columns: 1fr;
  }
  .img-large,
  .img-right-top,
  .img-right-bottom {
    grid-column: 1;
  }

  .img-right-bottom {
    justify-content: center;
  }

  .stat-card {
    width: 100%;
  }

  .mentorship-content h2 {
    font-size: 1.8rem;
  }

  .mentorship-content p {
    font-size: 1rem;
  }
}

@media (max-width: 480px) {
  .mentorship-btns button {
    width: 100%;
  }
}




/* scanner web */

/* ------------------------------------- */
/* 1. Layout: Flexbox to align QR code and content */
/* ------------------------------------- */

.subscribe-section {
    position: relative;
    
    background-size: cover;
    background-position: center;
    padding: 80px 5%; 
        color: white; 
    display: flex; 
    justify-content: center;
    align-items: center;
}

.content-wrapper {
    
    display: flex; 
    align-items: center;
        max-width: 1060px; 
    width: 100%;
    position: relative;
    z-index: 2; 
}

/* ------------------------------------- */
/* 2. QR Code (Left Side) */
/* ------------------------------------- */

.scanAlumni {
    flex: 0 0 350px;
    text-align: center;
    margin-right: 56px;
}

.scanAlumni img {
        width: 240px;
    max-width: 240px;
    height: 261px;
    padding: 10px 10px 30px 10px;
    margin-top: 20px;
    background-color: white;
    border-radius: 0px;
    margin-bottom: 8px;

}

.scan-text {
   font-size: 12px;
    opacity: 0.8;
    /* margin-bottom: 38px; */
    position: relative;
    bottom: 50px;
    margin-top: 6px;
    color: #000;
}

/* ------------------------------------- */
/* 3. Text and Button (Right Side) */
/* ------------------------------------- */

.subscribe-content {
    flex-grow: 1; 
    margin-bottom: 32px;
    padding-left: 0px; 
}

.subscribe-content h2 {
    font-size: 40px;
    margin-bottom: 10px;
    font-weight: 700;
     font-family: 'Nunito Sans', sans-serif;
}

.subscribe-content p {
    font-size: 24px;
    margin-bottom: 40px;
    font-weight: 500;
    opacity: 0.8;
    text-align: left;
     font-family: 'Nunito Sans', sans-serif;
}

.sub_btn {
   
    background-color: #ffb833; 
    border: none;
    color: white;
    padding: 15px 30px;
    font-size: 1.1em;
    font-weight: bold;
    border-radius: 5px;
    width: 100%;
    cursor: pointer;
    transition: background-color 0.3s;
}

.sub_btn:hover {
    background-color: #e6a52e;
}

/* ------------------------------------- */
/* 4. Overlay Style */
/* ------------------------------------- */

@media (max-width:1024px) {
    .subscribe-section {
        padding: 60px 3%;
    }
    .subscribe-form button{
      width: 70%!important;
    }
    
    
    
    .scanAlumni {
        flex: 0 0 180px; 
        margin-right: 30px;
    }
    
    .scanAlumni img {
       width: 100%;
        max-width: 220px;
        height: auto;
    }


    .subscribe-content p {
        font-size: 16px!important;
        text-align: center!important;
        margin-bottom: 30px;
    }
}


/* Mobile Screens (Max Width: 600px) */
@media (max-width: 600px) {
    .subscribe-section {
        padding: 40px 3%;
    }
    .team-member-hover .overlay-content .name{
        font-size: 22px;
        text-align: left;
    }
   .team-member-hover .overlay-content .batch{
font-size: 16px!important;
text-align: left;
    }
    .past_events_Celebrating .event-card img{
            width: 100%!important;
    height: 230px!important;
    object-fit: cover!important;
    }
    /* .past_events_Celebrating .event-card .date{
        font-size: 16px!important;
    } */
    
.past_events_Celebrating .event-card h3{
    font-size: 22px!important;
}

    .content-wrapper {
        
        flex-direction: column; 
        text-align: center; 
    /* padding: 20px 24px; */
      }
    
    .scanAlumni {
        flex: none; 
        margin-right: 0;
        margin-bottom: 30px; 
    }
    .scan-text {
    font-size: 8px;
    opacity: 0.8;
        position: relative;
    bottom: 45px;
    margin-top: 6px;
}
    
    .scanAlumni img {
              height: auto;
        width: 100%;
        max-width: 154px;
    }
    
    .subscribe-content {
        padding-left: 0;
        width: 100%;
    }
    
    .subscribe-content h2 {
        font-size: 24px;
    }

    .subscribe-content p {
        font-size: 16px;
        margin-bottom: 20px;
        text-align: center; 
    }

    .sub_btn {
        width: 80%; 
        max-width: 300px;
        margin: 0 auto;
        display: block;
    }
}



/*location contact us  */

/* Header Styling */
.location{
  padding: 80px 100px;
  background-color: #fff;
}

.location-header {
    text-align: center;
    margin-bottom: 30px;
}

.location-header h1 {
    font-size: 40px;
    color: #333;
    margin-bottom: 5px;
    font-weight: 700!important;
    font-family: 'Nunito Sans', sans-serif;
}

.location-header p {
    color: #777;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    font-size: 24px;
}

/* Map Container Styling */
.map-container {
    /* Center the map container on the page */
    max-width: 900px; 
    margin: 0 auto;
    
    /* Control the aspect ratio (height relative to width) */
    position: relative;
    padding-bottom: 38%; /* This sets the height to 60% of the width (adjust as needed) */
    height: 0;
    overflow: hidden;
    
    /* Styling to match the image */
    border: 4px solid #00C2C2;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* Make the iframe fill the container */
.map-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Simple responsiveness for very small screens */
@media (max-width: 600px) {
    .map-container {
        padding-bottom: 100%; /* Make the map square on small devices */
    }
}

.contact-form .container-fluid{
  padding-left: 0px;
  padding-right: 0px;
}

 .contact-card {
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
            overflow: hidden;
        }

        /* --- Left Section (Reach Us) --- */
        .contact-info-col {
            background-color:#00C2C2;
            color: white;
            padding:60px 60px;
            /* Ensures items are spaced out vertically on large screens */
            display: flex;
            flex-direction: column;
            justify-content: center; 
        }

        .reach-us-header {
            margin-bottom: 2rem;
        }
        
        /* Contact items (email/phone) */
        .contact-item {
           background: rgba(255, 255, 255, 0.2);
            color: white;
            border: 0.6px solid #E7E7E7;
            text-decoration: none;
            padding: 1rem 1.25rem;
            margin-bottom: 1rem;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background-color 0.3s;
        }
        
        .contact-item:hover {
            background-color: #009085; /* Even darker on hover */
            color: white;
        }

        .contact-item i {
            font-size: 1.5rem;
            margin-right: 1rem;
        }
        .contact-item span{
          font-size: 28px;
          font-weight: 500;
          font-family: 'Nunito Sans', sans-serif;
          color: #ffffff;
          line-height: 140%;
        }

        /* --- Right Section (Form) --- */
        .contact-form-col {
            padding:80px 60px;
            background-color: #EBFFFF;
            /* Gradient effect matching the image's subtle fade */
            background-image: linear-gradient(180deg, white 0%, var(--bs-light-blue-bg) 100%);
        }

        .form-control {
            padding: 24px 24px 24px 32px;
    margin-bottom: 1.5rem;
    font-size: 16px;
    border-radius: 4px;
    border: 1px solid #A1A1A1;
            background-color: #ffffff;
        }

        .form-control:focus {
            box-shadow: 0 0 0 0.25rem rgba(0, 191, 175, 0.25); /* Teal focus glow */
            border-color: var(--bs-teal-custom);
            background-color:#ffffff!important;
        }
        
        .form-control[placeholder="Leave a Message"] {
            min-height: 120px;
            resize: none;
            border-radius: 4px;
        }

        /* Submit Button */
        .send-message-btn {
            background-color: #F6BB3A;
            border: none;
            color: #fff; /* Dark text for contrast on gold */
            font-weight: 700;
            border-radius: 0px;
            font-size: 16px;
               font-family: 'Nunito Sans', sans-serif;
            padding: 0.8rem 2rem;
            transition: background-color 0.3s;
            width: 100%; /* Full width as in the image */
        }

        .send-message-btn:hover {
              background-color: #00C2C2;
              color: #fff;
        }

           .form-title{
          font-size: 40px;
          color: #333333;
          font-weight: 700;
          font-family: 'Nunito Sans', sans-serif;
        }
        .contact-form-col p{
          font-size: 24px;
          color: #838383!important;
          font-weight: 400;
          font-family: 'Nunito Sans', sans-serif;
        }
        .form-label{
          font-size: 20px;
          color: #333333;
          font-weight: 600;
          font-family: 'Nunito Sans', sans-serif;
        }
        .contact-form-col ::placeholder{
          font-size: 14px;
          color: #A1A1A1;
          line-height: 100%;
          font-weight: 400;
          font-family: 'Nunito Sans', sans-serif;
        }
        
.contact-info-col h2{
   font-size: 40px;
          color: #ffffff;
          font-weight: 700;
          font-family: 'Nunito Sans', sans-serif;
}

.contact-info-col p{
   font-size: 24px;
          color: #ffffff;
          font-weight: 400;
          font-family: 'Nunito Sans', sans-serif;
}


        /* Mobile adjustment for better spacing when stacked */
        @media (max-width: 991px) {
            .contact-info-col {
                order: 2; /* Put the form first on mobile as in the image */
                justify-content: flex-start;
                text-align: center;
            }
            .contact-info-col .contact-item {
                justify-content: center;
                width: 70%; /* Smaller width for buttons on mobile */
                margin-left: auto;
                margin-right: auto;
            }
            .contact-form-col {
                order: 1;
            }
        }

@media (min-width:992px)and (max-width:1024px){
    .contact-info-col, .contact-form-col{
        width: 100%;
    }
}

        .image-container1
 {
    position: relative;
    overflow: hidden;
    padding-top: 67%;
}
.p-40{
  padding: 40px 40px;
}



/* Basic Reset and Layout Styling (Same as before) */
.alumni-section {
    font-family: Arial, sans-serif;
    /* padding: 80px 100px; */
    padding: 140px 100px 80px 100px;
    background-color: #f8f9fa;
    display: flex;
    flex-direction: column;
    align-items: center; 
}

/* Header Styling */
.alumni-header {
    text-align: center;
    margin-bottom: 60px;
}

.alumni-header h1 {
    font-size: 40px;
    color: #333333;
    font-weight: 700;
    line-height: 140%;
    margin-bottom: 5px;
}

.alumni-header p {
    font-size: 24px;
    line-height: 140%;
    font-weight: 400;
    color: #838383;
}

/* --- Profile Card (Horizontal/Vertical) --- */
.profile-card {
    max-width: 1270px;
    /* width: 95%;  */
    display: flex; 
    background-color: white;
    border-radius: 12px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    
    /* ********* KEY CHANGE 1: Remove 'overflow: hidden;' ********* */
    /* overflow: hidden; is REMOVED so the image can extend outside the boundary */
    
    /* ********* KEY CHANGE 2: Add space above the card for the image to extend into ********* */
    margin-top: 60px; /* This creates space for the top 60px of the image */
}

/* Image Container Styling */
.profile-image-container {
    flex: 16; 
    position: relative;
    border-radius: 12px 12px 0px 0px;
    background: linear-gradient(to top right, #3498db, #2ecc71); 
    
    /* ********* KEY CHANGE 3: Pull the image up to extend out of the top of the card ********* */
    /* Pull the image container up by 100px. Since the card starts 60px down, 
       the image will extend 40px (100-60) above where the card originally started. 
       Adjust this value (e.g., -100px) to control how much it extends. */
    margin-top: -100px; 
    
    /* ********* KEY CHANGE 4: Pull the image to the left to extend out of the side of the card ********* */
    margin-left: 40px; /* Example: Pull the image 20px outside the left edge */
    
    /* Ensure the image is on top of the card's shadow */
    z-index: 10;
}

.profile-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; 
    display: block;
    border-radius: 12px 12px 0px 0px;
}

/* Details Container (The blue/cyan background section) */
.profile-details-container {
    flex: 22; 
    border-radius: 12px;
    padding: 48px 40px;
       background-color: #ffffff;
    color: #000;
    font-family: 'Nunito Sans', sans-serif;
}

/* (Rest of the text styles are kept the same) */
.profile-details-container h2 {
    font-size: 32px;
    line-height: 140%;
    font-weight: 700;
    margin-bottom: 5px;
    font-family: 'Nunito Sans', sans-serif;
}

.profile-details-container .profession {
    font-size: 20px;
    font-weight: 500;
    font-family: 'Nunito Sans', sans-serif;
    line-height: 140%;
    color: #747474;
}

.profile-details-container .locations{
    font-size: 16px;
    font-weight: 400;
    line-height: 140%;
    font-family: 'Nunito Sans', sans-serif;
    color: #747474;
}
.profile-details-container .batch{
    font-size: 20px;
    font-weight: 500;
    line-height: 140%;
    color: #000000;
    font-family: 'Nunito Sans', sans-serif;
    margin-bottom: 10px;
}
.alumni-bio p {
    font-size: 24px;
    line-height: 140%;
    margin-top: 20px;
    padding-top: 20px;
    font-weight: 100;
    color: #3d3d3d;
    font-style: italic;
    font-family: 'Nunito Sans', sans-serif;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

/* --- Responsiveness (Vertical Stacking) --- */

@media (max-width: 600px) {
    .profile-card {
        flex-direction: column; 
        width: 100%;
        /* Reset top margin for mobile stacking, ensuring there's enough space for the image to sit */
        /* margin-top: 80px;  */
        margin-top: 122px;
    }

    .profile-image-container {
        /* On mobile, remove horizontal extension */
        margin-left: 0;
        
        /* Pull the image up more dramatically on mobile */
        margin-top: -120px; 
        
        /* Give the image a specific height to look good */
        height: 400px; 
    }
    
    .profile-details-container {
        padding: 25px;
    }
    
    .alumni-bio p {
        margin-top: 15px;
        padding-top: 15px;
    }
}


.view-all-container {
    padding: 40px 0 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.view-all-button {
    /* Orange color from the design */
    background-color: #F6BB3A; 
    color: #fff;
    border: none;
    padding: 12px 24px 12px 32px;
    border-radius: 99px;
    column-gap: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    transition: background-color 0.3s ease;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.view-all-button a{
font-size: 20px;
    font-weight: 600;
 line-height: 140%;   
}

.view-all-button:hover {
    background-color: #00C2C2; 
}

.view-all-button .arrow {
    margin-left: 8px;
    font-size: 1.2em;
    transition: transform 0.3s ease;
}

.view-all-button:hover .arrow {
    transform: translateX(3px);
}

/* 

.team-member-hover1 .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    
    bottom: 0; 
    width: 100%;
    
    
    transform: scaleY(0); 
    transform-origin: bottom; 
    
    background-color:rgba(131, 163, 32, 0.8);
    transition: transform 0.5s ease-out; 
    
    display: flex;
    align-items: flex-end; 
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
  
    opacity: 1; 
    pointer-events: none; 
    z-index: 2; 
} */


.team-member-hover1 .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; 
    width: 100%;
    transform: scaleY(0);
    transform-origin: bottom;
    
    /* ✅ Use dynamic variable color (defined inline in PHP) */
    background-color: color-mix(in srgb, var(--memberColor) 85%, transparent); 
    transition: transform 0.5s ease-out, background-color 0.3s ease-in;
    
    display: flex;
    align-items: flex-end;
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    opacity: 1;
    pointer-events: none;
    z-index: 2;
}


.team-member-hover1 .overlay-content .content-wrapper{
    /* Style for the text content inside the overlay */
    width: 100%;
    /* New: Control content visibility with opacity/delay */
    opacity: 0; 
    transition: opacity 0.3s ease; 
   flex-direction: column;
    display: flex
;
    align-items: flex-start;
}

.team-member-hover1 .overlay-content .name {
    font-size:28px;
    font-weight: 800;
    margin-bottom: 8px;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover1 .overlay-content .detail-line {
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover1 .overlay-content .location i {
    margin-right: 5px;
}
.team-member-hover1 .overlay-content .location {
    font-size: 16px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover1 .overlay-content .batch {
    font-size: 20px!important;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}


/* @media (min-width: 768px) {
    .team-member-hover1:hover .image-container img {
        transform: scale(1.05); 
    }

    .team-member-hover1:hover .overlay-content {

        transform: scaleY(1); 
        pointer-events: auto; 
        transition-delay: 0s; 

    }

    .team-member-hover1:hover .overlay-content .content-wrapper {
        opacity: 1; 
        transition-delay: 0.5s; 
    }
    .team-member-hover1:hover .member-info{
      background-color: transparent;
    }
    .team-member-hover1:hover .member-info .name{
      color: transparent;
    }
     .team-member-hover1:hover .member-info .batch{
      color: transparent;
    }
   
} */

@media (min-width: 768px) {
.team-member-hover .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;

    bottom: 0; 
    width: 100%;
    
   
    transform: scaleY(0); 
    transform-origin: bottom; 
    
    background-color: rgba(0, 194, 194, 0.8);
    transition: transform 0.5s ease-out;
    
    display: flex;
    align-items: flex-end; 
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    opacity: 1;
    pointer-events: none; 
    z-index: 2; 
}



}



@media (max-width: 767px) {
    /* Ensure the image container is correctly sized */
    .team-member-hover1 .image-container {
        padding-top: 1%; 
    }
    
    /* Modify the overlay to act as a secondary information block */
    .team-member-hover1 .overlay-content {
        position: static; 
        transform: none; 
        top: auto;
        bottom: auto;
        height: auto;
        opacity: 1; 
        background-color: #0d47a1; 
        color: #fff;
        padding: 15px;
        transition: none;
        pointer-events: auto;
        z-index: auto; 
    }
    
    .team-member-hover1 .overlay-content .content-wrapper {
        opacity: 0;
        transition: none;
    }
    .team-section .container-fluid{
      padding-left: 0px ;
      padding-right: 0px;
    }
   
}

.team-section .container-fluid{
      padding-left: 0px ;
      padding-right: 0px;
    }

    footer .pb-100{
        padding: 0px 100px;
    }
.team-member-hover2 .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    /* CORRECTED: This makes the absolute overlay cover the full height of the relative .team-member parent */
    bottom: 0; 
    width: 100%;
    
    /* NEW: Use transform: scaleY(0) to start hidden and expand vertically */
    transform: scaleY(0); 
    transform-origin: bottom; /* Start the expansion from the bottom */
    
    background-color:rgba(157, 98, 198, 0.8); /* Teal overlay color */
    transition: transform 0.5s ease-out; /* Transition the transform property */
    
    display: flex;
    align-items: flex-end; /* Align content to the bottom */
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    /* Content visibility and pointer-events control */
    opacity: 1; /* Keep opacity 1, control visibility with transform and content opacity */
    pointer-events: none; 
    z-index: 2; /* Crucial: Ensure the overlay is on top of everything */
}

.team-member-hover2 .overlay-content .content-wrapper{
    /* Style for the text content inside the overlay */
    width: 100%;
    /* New: Control content visibility with opacity/delay */
    opacity: 0; 
    transition: opacity 0.3s ease; 
     flex-direction: column;
    display: flex;
    align-items: flex-start;
    
}

.team-member-hover2 .overlay-content .name {
    font-size:28px;
    font-weight: 800;
    margin-bottom: 8px;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover2 .overlay-content .detail-line {
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover2 .overlay-content .location i {
    margin-right: 5px;
}
.team-member-hover2 .overlay-content .location {
    font-size: 16px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover2 .overlay-content .batch {
    font-size: 20px!important;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}


@media (min-width: 768px) {
    .team-member-hover2:hover .image-container img {
        transform: scale(1.05); /* Slight zoom on the image */
    }

    .team-member-hover2:hover .overlay-content {
        /* EXPAND: Makes the overlay cover the FULL CARD area */
        transform: scaleY(1); /* Expands from bottom to cover 100% height */
        pointer-events: auto; /* Enable clicks on the button */
        transition-delay: 0s; 

    }

    .team-member-hover2:hover .overlay-content .content-wrapper {
        opacity: 1; /* Reveal the content after the overlay has expanded */
        transition-delay: 0.5s; /* Delay matches the transform transition, for staggered reveal */
        
    }
    .team-member-hover2:hover .member-info{
      background-color: transparent;
    }
    .team-member-hover2:hover .member-info .name{
      color: transparent;
    }
     .team-member-hover2:hover .member-info .batch{
      color: transparent;
    }
   
}


@media (max-width: 767.98px) {
    /* Ensure the image container is correctly sized */
    .team-member-hover2 .image-container {
        padding-top: 1%; 
    }
    
    /* Modify the overlay to act as a secondary information block */
    .team-member-hover2 .overlay-content {
        position: static; 
        transform: none; 
        top: auto;
        bottom: auto;
        height: auto;
        opacity: 1; 
        background-color: #0d47a1; 
        color: #fff;
        padding: 15px;
        transition: none;
        pointer-events: auto;
        z-index: auto; 
    }
    
    .team-member-hover2 .overlay-content .content-wrapper {
        opacity: 0;
        transition: none;
    }
     .team-section .container{
      padding-left: 0px ;
      padding-right: 0px;
    }
   
}




.team-member-hover3 .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    /* CORRECTED: This makes the absolute overlay cover the full height of the relative .team-member parent */
    bottom: 0; 
    width: 100%;
    
    /* NEW: Use transform: scaleY(0) to start hidden and expand vertically */
    transform: scaleY(0); 
    transform-origin: bottom; /* Start the expansion from the bottom */
    
    background-color:rgba(152, 89, 57, 0.8); /* Teal overlay color */
    transition: transform 0.5s ease-out; /* Transition the transform property */
    
    display: flex;
    align-items: flex-end; /* Align content to the bottom */
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    /* Content visibility and pointer-events control */
    opacity: 1; /* Keep opacity 1, control visibility with transform and content opacity */
    pointer-events: none; 
    z-index: 2; /* Crucial: Ensure the overlay is on top of everything */
}

.team-member-hover3 .overlay-content .content-wrapper{
    /* Style for the text content inside the overlay */
    width: 100%;
    /* New: Control content visibility with opacity/delay */
    opacity: 0; 
    transition: opacity 0.3s ease; 
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}


.team-member-hover3 .overlay-content .name {
    font-size:28px;
    font-weight: 800;
    margin-bottom: 8px;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover3 .overlay-content .detail-line {
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover3 .overlay-content .location i {
    margin-right: 5px;
}
.team-member-hover3 .overlay-content .location {
    font-size: 16px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover3 .overlay-content .batch {
    font-size: 20px!important;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}


@media (min-width: 768px) {
    .team-member-hover3:hover .image-container img {
        transform: scale(1.05); /* Slight zoom on the image */
    }

    .team-member-hover3:hover .overlay-content {
        /* EXPAND: Makes the overlay cover the FULL CARD area */
        transform: scaleY(1); /* Expands from bottom to cover 100% height */
        pointer-events: auto; /* Enable clicks on the button */
        transition-delay: 0s; 

    }

    .team-member-hover3:hover .overlay-content .content-wrapper {
        opacity: 1; /* Reveal the content after the overlay has expanded */
        transition-delay: 0.5s; /* Delay matches the transform transition, for staggered reveal */
    }
    .team-member-hover3:hover .member-info{
      background-color: transparent;
    }
    .team-member-hover3:hover .member-info .name{
      color: transparent;
    }
     .team-member-hover3:hover .member-info .batch{
      color: transparent;
    }
   
}


@media (max-width: 767.98px) {
    /* Ensure the image container is correctly sized */
    .team-member-hover3 .image-container {
        padding-top: 1%; 
    }
    
    /* Modify the overlay to act as a secondary information block */
    .team-member-hover3 .overlay-content {
        position: static; 
        transform: none; 
        top: auto;
        bottom: auto;
        height: auto;
        opacity: 1; 
        background-color: #0d47a1; 
        color: #fff;
        padding: 15px;
        transition: none;
        pointer-events: auto;
        z-index: auto; 
    }
    
    .team-member-hover3 .overlay-content .content-wrapper {
        opacity: 0;
        transition: none;
    }
     .team-section .container{
      padding-left: 0px ;
      padding-right: 0px;
    }
   
}


.team-member-hover4 .overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    /* CORRECTED: This makes the absolute overlay cover the full height of the relative .team-member parent */
    bottom: 0; 
    width: 100%;
    
    /* NEW: Use transform: scaleY(0) to start hidden and expand vertically */
    transform: scaleY(0); 
    transform-origin: bottom; /* Start the expansion from the bottom */
    
    background-color:rgba(247, 188, 152, 0.8); /* Teal overlay color */
    transition: transform 0.5s ease-out; /* Transition the transform property */
    
    display: flex;
    align-items: flex-end; /* Align content to the bottom */
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    /* Content visibility and pointer-events control */
    opacity: 1; /* Keep opacity 1, control visibility with transform and content opacity */
    pointer-events: none; 
    z-index: 2; /* Crucial: Ensure the overlay is on top of everything */
}

.team-member-hover4 .overlay-content .content-wrapper{
    /* Style for the text content inside the overlay */
    width: 100%;
    /* New: Control content visibility with opacity/delay */
    opacity: 0; 
    transition: opacity 0.3s ease; 
        display: flex;
    align-items: flex-start;
    flex-direction: column;
}

.team-member-hover4 .overlay-content .name {
    font-size:28px;
    font-weight: 800;
    margin-bottom: 8px;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover4 .overlay-content .detail-line {
    font-size: 20px;
    margin-bottom: 4px;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover4 .overlay-content .location i {
    margin-right: 5px;
}
.team-member-hover4 .overlay-content .location {
    font-size: 16px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
}

.team-member-hover4 .overlay-content .batch {
    font-size: 20px!important;
    font-weight: 500;
    font-family: "Nunito Sans", sans-serif;
}


@media (min-width: 768px) {
    .team-member-hover4:hover .image-container img {
        transform: scale(1.05); /* Slight zoom on the image */
    }

    .team-member-hover4:hover .overlay-content {
        /* EXPAND: Makes the overlay cover the FULL CARD area */
        transform: scaleY(1); /* Expands from bottom to cover 100% height */
        pointer-events: auto; /* Enable clicks on the button */
        transition-delay: 0s; 
            display: flex
;
    align-items: flex-start;
    flex-direction: column;

    }

    .team-member-hover4:hover .overlay-content .content-wrapper {
        opacity: 1; /* Reveal the content after the overlay has expanded */
        transition-delay: 0.5s; /* Delay matches the transform transition, for staggered reveal */
    }
    .team-member-hover4:hover .member-info{
      background-color: transparent;
    }
    .team-member-hover4:hover .member-info .name{
      color: transparent;
    }
     .team-member-hover4:hover .member-info .batch{
      color: transparent;
    }
   
}


@media (max-width: 767.98px) {
    /* Ensure the image container is correctly sized */
    .team-member-hover4 .image-container {
        padding-top: 1%; 
    }
    
    /* Modify the overlay to act as a secondary information block */
    .team-member-hover4 .overlay-content {
        position: static; 
        transform: none; 
        top: auto;
        bottom: auto;
        height: auto;
        opacity: 1; 
        background-color: #0d47a1; 
        color: #fff;
        padding: 15px;
        transition: none;
        pointer-events: auto;
        z-index: auto; 
    }
    
    .team-member-hover4 .overlay-content .content-wrapper {
        opacity: 0;
        transition: none;
    }
    
   
}




/* Eventss page   */


    .Upcoming_events_all .section-title {
      text-align: center;
      margin-bottom: 40px;
    }

    .Upcoming_events_all .section-title h2 {
      font-size: 40px;
      font-weight: 700;
      color: #333;
           font-family: 'Nunito Sans', sans-serif!important;
    }

    .Upcoming_events_all .section-title p {
      color: #838383;
      font-size: 24px;
      font-weight: 400;
           font-family: 'Nunito Sans', sans-serif!important;
    }

    .Upcoming_events_all {
      padding: 80px 0px 80px 100px;
    }

    /* Event Card Base Style */
    .Upcoming_events_all .event-card {
      border-radius: 0;
      overflow: hidden;
      padding: 40px;
      min-height: 250px;
      position: relative;
      transition: all 0.4s ease-in-out;
      background-color: #EBFFFF;
      color: #000;
      flex-direction: column;
      display: flex;
      border: 0.4px solid #00C2C2;
    }

    /* Share Button */
    .Upcoming_events_all .share-btn {
      position: absolute;
      /* top: 15px;
      right: 15px; */
      top: 40px;
      right: 40px;
      background-color: #00C2C2;
      color: #fff;
      border-radius: 50%;
      width: 30px;
      font-family: 'Nunito Sans', sans-serif!important;
      height: 30px;
      display: block;
      align-items: center;
      justify-content: center;
      font-size: 14px;
    }

    /* Active Card */
    .Upcoming_events_all .event-card.active {
      background-color: #00C2C2;
      color: #fff;
    }

    .Upcoming_events_all .event-card.active .share-btn {
      display: flex;
      background-color: #fff;
    }

    /* Hover Effect (Inactive → Hovered) */
    .Upcoming_events_all .event-card.inactive:hover {
      background-color: #00C2C2;
      color: #fff;
    }

    .Upcoming_events_all .event-card.inactive:hover .share-btn {
      display: flex;
      background-color: #ffffff;
      color: #00C2C2;
    }

    /* Date Styling */
    .Upcoming_events_all .event-card h2 {
      font-size: 64px;
      margin: 0;
      display: flex;
      font-family: 'Nunito Sans', sans-serif!important;
      align-items: baseline;
      gap: 5px;
      font-weight: 800;
    }

    .Upcoming_events_all .event-card h2 small {
      font-size: 24px;
      font-weight: 500;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    /* Location */
    .Upcoming_events_all .event-card p {
      font-size: 20px;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 400;
      color: #747474;
      margin: 5px 0;
    }

    /* Title */
    .Upcoming_events_all .event-card h3 {
      font-size: 18px;
      font-weight: 600;
      font-family: 'Nunito Sans', sans-serif!important;
      margin: 8px 0;
      color: #F7B924;
    }

    /* Price */
    .Upcoming_events_all .event-card .price {
      font-weight: 700;
      font-size: 28px;
      font-family: 'Nunito Sans', sans-serif!important;
      margin-top: 10px;
      color: #747474;
    }
.Upcoming_events_all .event-card .price span {
      font-weight: 500;
      font-size: 20px;
      font-family: 'Nunito Sans', sans-serif!important;
      margin-top: 10px;
      color: #747474;
    }

    /* Know More Button */
    .Upcoming_events_all .btn-know {
      background-color: #f7b924;
      border: none;
      color: #fff;
      padding: 8px 20px;
      cursor: pointer;
      margin-top: 15px;
      /* width: 35%; */
      /* width: 40%; */
      width: max-content;
      transition: background 0.3s ease;
    }

    .Upcoming_events_all .btn-know:hover {
      background-color: #d99d00;
    }

    /* Pagination Centered Below */
    .Upcoming_events_all .splide__pagination {
      position: relative;
      width: fit-content;
      margin: 40px auto 0 auto;
      background-color: #fff;
      padding: 16px 40px;
      border-radius: 40px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .Upcoming_events_all .splide__pagination__page {
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: rgba(0, 194, 194, 0.2);
      opacity: 1;
      margin: 0px 6px;
      transition: background 0.3s;
    }

    .Upcoming_events_all .splide__pagination__page.is-active {
      background: #00C2C2 !important;
      border-radius: 99px;
      height: 16px;
      width: 72px;
    }

   

 /* Hover → text color change */
.Upcoming_events_all .event-card.inactive:hover h3,
.Upcoming_events_all .event-card.inactive:hover .price,
.Upcoming_events_all .event-card.inactive:hover .price span,
.Upcoming_events_all .event-card.inactive:hover p {
  color: #fff !important; /* ✅ ensures all text, including price, turns white */
}



    /* Responsive */
    @media (max-width: 1024px) {
      .Upcoming_events_all {
        padding: 60px 40px;
      }
    }

    @media (max-width: 768px) {
      .Upcoming_events_all {
        padding: 60px 24px;
      }

     
    }
 


    /* === Main Section === */
    section.past_events_Celebrating {
      padding: 80px 100px;
      text-align: center;
      background-color: #fbfbfb;
    }

    .past_events_Celebrating h2 {
      font-size: 40px;
       font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 700;
      margin-bottom: 10px;
      color: #333333;
    }

    .past_events_Celebrating p {
      color: #838383;
      font-size: 24px;
      font-weight: 400;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 40px;
    }

    /* === Filter Buttons === */
    .past_events_Celebrating .filter-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 12px;
      margin-bottom: 40px;
    }
    .past_events_Celebrating .filter-buttons .active p{
    font-family: 'Nunito Sans', sans-serif!important;
      font-size: 20px;
      font-weight: 700;
      color: #ffffff;
      margin-bottom: 0px;
    }

    .past_events_Celebrating .filter-buttons p{
    font-family: 'Nunito Sans', sans-serif!important;
      font-size: 20px;
      font-weight: 600;
      color: #00C2C2;
      margin-bottom: 0px;
    }

    .past_events_Celebrating .filter-buttons button {
      border: 1px solid #00C2C2;
      background: transparent;
      color: #00C2C2;
      padding: 10px 20px;
      border-radius: 50px;
      cursor: pointer;
      transition: all 0.3s;
    }

    .past_events_Celebrating .filter-buttons .active:hover {
      background-color: #00C2C2;
      color: #fff;
    }
.past_events_Celebrating .filter-buttons .active {
      background-color: #00C2C2;
      color: #fff;
    }
    .past_events_Celebrating .past-events-btn:hover{
        background-color: #00C2C2;
      
    }
.past_events_Celebrating .past-events-btn p:hover{
      color: #fff!important;
    }
    .past_events_Celebrating .past-events-btn:hover p{
      color: #fff!important;
    }
    .past_events_Celebrating .filter-buttons .view-all {
      background: #F6BB3A;
      border: none!important;
      color: #fff;
      display: flex;
      font-size: 20px;
       font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 600;
      align-items: center;
      gap: 8px;
    }
.past_events_Celebrating .filter-buttons .view-all:hover{
background:#F7B924 ;
}

    .past_events_Celebrating .filter-buttons .view-all svg {
    transition: transform .35s ease;
}

.past_events_Celebrating .filter-buttons .view-all:hover svg {
    transform: translateX(6px); /* move to right */
}

.past-events-filters .view-all svg{
     transition: transform .35s ease;
}


.past-events-filters .view-all:hover svg{
      transform: translateX(6px); /* move to right */
}

.latest_news_highlights .filter-buttons .view-all svg{
    transition:transform .35s ease;
}
.latest_news_highlights .filter-buttons .view-all:hover svg{
    transform:translateX(6px);
}
.view-all-button svg{
       transition:transform .35s ease; 
}
.view-all-button:hover svg{
        transform:translateX(6px);
}
    /* === Card Grid === */
    .past_events_Celebrating .events-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      justify-content: center;
    }

    .past_events_Celebrating .event-card {
      background: #fff;
      overflow: hidden;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
      text-align: left;
      /* transition: transform 0.3s;  */
          transition: all 0.3s ease; /* smooth hover animation */
    position: relative;       /* required for transform */
     
    }

     .past_events_Celebrating .event-card:hover {
      /* transform: translateY(-5px); */
       transform: translateY(-10px); /* moves card 10px upward */
         box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    } 

    .past_events_Celebrating .event-card img {
      width: 100%;
      height: 521px;
      object-fit: cover;
    }

    .past_events_Celebrating .event-card .card-content {
      /* padding: 16px 20px; */
      padding: 24px 40px 40px 40px;
    }

    .past_events_Celebrating .event-card .date {
      color: #747474;
      font-size: 20px;
      margin-bottom: 8px;
      display: flex;
      align-items: center;
       font-family: 'Nunito Sans', sans-serif!important;
      gap: 8px;
    }

    .past_events_Celebrating .event-card h3 {
      font-size: 28px;
      font-weight: 700;
      color: #000;
      margin: 0;
       font-family: 'Nunito Sans', sans-serif!important;
       text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: clip;
    }

    /* === Responsive === */
    @media (max-width: 1024px) {
      .past_events_Celebrating .events-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 768px) {
      .past_events_Celebrating .events-grid {
        grid-template-columns: 1fr;
      }
    }
 



  /*  Inthe news page  */


    /* === Section === */
    section.latest_news_highlights {
      padding: 80px 100px;
      text-align: center;
    }

    .latest_news_highlights h2 {
      font-size: 40px;
      font-weight: 700;
      font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 10px;
      color: #333333;
    }

    .latest_news_highlights p {
      color: #838383;
      font-size: 24px;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 400;
      margin-bottom: 40px!important;
    }

    /* === Filter Buttons === */
    .latest_news_highlights .filter-buttons {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 12px;
      margin-bottom: 40px;
    }

    .latest_news_highlights .filter-buttons button {
      border: 1px solid #00C2C2;
      background: transparent;
      color: #00C2C2;
      padding: 10px 20px;
      border-radius: 50px;
      font-size: 20px;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight:600;
      cursor: pointer;
      transition: all 0.3s;
    }

    .latest_news_highlights .filter-buttons button.active,
    .latest_news_highlights .filter-buttons button:hover {
      background: #00C2C2;
      color: #fff;
    }

    .latest_news_highlights .filter-buttons .view-all {
      background: #F6BB3A;
      border: none!important;
      color: #fff;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .latest_news_highlights .filter-buttons .view-all:hover{
        background-color:#F7B924;
    }

    /* === Card Grid === */
    .latest_news_highlights .news-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
      justify-content: center;
    }

    .latest_news_highlights .news-card {
      background: #fff;
      overflow: hidden;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
      text-align: left;
      transition: transform 0.3s;
    }

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

    .latest_news_highlights .news-card img {
      width: 100%;
      height: 360px;
      object-fit: cover;
    }

    .latest_news_highlights .news-card .card-content {
      padding: 40px 40px;
    }

    .latest_news_highlights .news-card .date {
      color: #747474;
      font-size: 20px;
      margin-bottom: 8px;
      display: flex;
      font-weight: 400;
      font-family: 'Nunito Sans', sans-serif!important;
      align-items: center;
      gap: 6px;
    }

    .latest_news_highlights .news-card h3 {
      font-size: 28px;
      font-weight: 700;
      font-family: 'Nunito Sans', sans-serif!important;
      color: #000000;
      margin: 0;
    }

    /* === Responsive === */
    @media (max-width: 768px) {
      .latest_news_highlights .news-grid {
        grid-template-columns: 1fr;
      }
    }
  


    /*news letter  */


     
    

    .inthe_news_letter {
      padding: 80px 100px;
      background-color: #FBFBFB;
    }

    .inthe_news_letter h2 {
      font-size: 40px;
       font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 700;
      text-align: center;
      color: #333;
      margin-bottom: 10px;
    }

    .inthe_news_letter .subtitle {
      color: #838383;
      font-size: 24px;
      font-weight: 400;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 40px;
      text-align: center;
    }

    /* Splide container */
    .inthe_news_letter .splide {
      width: 100%;
      margin: auto;
      padding-bottom: 50px;
    }

    .inthe_news_letter .splide__slide {
      display: flex;
      justify-content: center;
    }

    .news-card {
      background: #fff;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
      overflow: hidden;
      text-align: left;
      transition: transform 0.3s ease;
      /* width: 95%; */
      width: 100%;
      margin: 30px 0px ;
    }

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

    .news-card img {
      width: 100%;
      height: 360px;
      object-fit: cover;
    }

    .news-card-content {
      padding: 20px;
    }

    .news-card-content h3 {
      font-size: 26px;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 700;
      margin-top: 10px;
      color: #000000;
    }

    .news-meta {
      display: flex;
      align-items: center;
      gap: 10px;
      /* flex-wrap:wrap; */
    }


   
    .news-card-content .news-meta span{
    color: #333333!important;
     font-size: 16px!important;
     font-family: 'Nunito Sans', sans-serif;
     font-weight: 500!important;
     /* text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     overflow: clip;
     -webkit-line-clamp:1; */
}

    /* Custom pagination style */
    .inthe_news_letter .splide__pagination {
      position: relative;
      width: fit-content !important;
      margin: 40px auto 0 auto;
      background-color: #fff;
      padding: 16px 40px;
      border-radius: 40px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
      display: flex;
      align-items: center;
      justify-content: center;
    }

   .inthe_news_letter .splide__pagination__page {
      background: rgba(0, 194, 194, 0.2);
      opacity: 0.6;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      margin: 0 10px;
      transition: all 0.3s ease;
    }

   .inthe_news_letter .splide__pagination__page.is-active {
      background: #00C2C2;
      opacity: 1;
      width: 72px;
      height: 16px;
      border-radius: 99px;
    }

    /* Responsive */
    @media (max-width: 1024px) {
      .inthe_news_letter {
        padding: 60px 24px;
      }
    }

    @media (max-width: 768px) {
      .news-card img {
        /* height: 200px; */
      }
    }

    @media (max-width: 640px) {
      .inthe_news_letter {
        padding: 60px 20px;
      }
    }
 



    /* All mentor */



  

   .mentor-grid .page-header {
      text-align: center;
      margin-bottom: 60px;
    }

    .mentor-grid .page-header h2 {
      font-weight: 700;
      font-size: 40px;
      color: #333333;
      font-family: 'Nunito Sans', sans-serif!important;
    }

   .mentor-grid .page-header p {
      color: #838383;
      font-size: 24px;
      font-weight: 400;
      margin-bottom: 0px;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    .mentor-grid .mentor-search {
      background: #fff;
      padding: 40px;
      box-shadow: 0 4px 15px rgba(0,0,0,0.1);
      margin: 40px auto;
    }

     .mentor-grid .mentor-search h4 {
      font-weight: 700;
       font-family: 'Nunito Sans', sans-serif!important;
      font-size: 32px;
      color: #333333;
    }

    .mentor-grid .mentor-search p {
      color: #838383;
      font-weight: 400;
      font-size: 20px;
       font-family: 'Nunito Sans', sans-serif!important;
    }

    .mentor-grid .search-bar input {
      border-radius: 2px 0px 0px 2px;
      margin-bottom: 0px;
      padding: 15px;
     border: 0.6px solid #CFCFCF !important;
    }

    .mentor-grid .search-bar button {
      background: #F6BB3A;
      border: none;
      border-radius: 8px;
      color: #fff;
      font-weight: 500;
      width: 18%;
      padding: 10px 20px;
    }

    /* Mentor Cards */
    .mentor-grid .mentor-card {
      position: relative;
      overflow: hidden;
      height: 100%;
      transition: transform 0.3s ease;
  
    }

    .mentor-grid .mentor-card img {
     /* width: 382px; */
     width: 100%;
    height: 540px;
      object-fit: cover;
    }

    .mentor-grid .mentor-info {
     position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      color: #fff;
      padding: 20px 16px 24px 40px;
      text-align: left;
      transition: opacity 0.3s ease;
     display: flex;
    height: 140px;
    align-items: flex-start;
    flex-direction: column;
    /* justify-content: flex-start; */
    justify-content: space-evenly;
    }

    .mentor-grid .mentor-card:hover .mentor-info {
      transform: translateY(0);
    }

    .mentor-grid .mentor-info h6 {
      font-weight: 700;
      font-size: 28px;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 5px;
    }

    .mentor-grid .mentor-info p {
      font-size: 18px;
      font-weight: 500;
      color: #e3e3e3;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: clip;
    -webkit-line-clamp: 1;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 10px;
    }

    .mentor-grid .mentor-overlay button {
      background: #F6BB3A;
      border: none;
      padding: 10px 30px;
      border-radius: 0px;
    }

     .mentor-grid .mentor-overlay button p{
      font-size: 16px;
      color: #fff;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 0px;
      font-weight: 700;
    }

    .mentor-grid .mentor-search button p{
      font-size: 20px;
      font-weight: 500;
      margin-bottom: 0px;
      color: #939393;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    .mentor-grid .pagination-section {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      margin-top: 60px!important;
      margin: 0px 120px;
      border-radius: 4px;
      padding: 10px 40px;
      box-shadow: 0 12px 15px rgba(0, 0, 0, 0.2);
    }

   .mentor-grid .rows-dropdown select {
      border-radius: 4px;
      background-color: #F6BB3A;
      padding: 5px 10px;
      color: #fff;
      width: 60px!important;
    }

    .mentor-grid .form-select option{
      color: #fff!important;
    }

    .mentor-grid .rows-dropdown label{
      font-size: 14px;
      font-weight: lighter;
      color: #7E7E7E;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    .mentor-grid .border_solid button{
      border: 0.6px solid #CFCFCF;
      padding: 8px 52px;
    }

    .mentor-grid .border_solid button:hover{
      border: #838383 0.6px solid;
    }

    .mentor-grid .page-item .active{
      background-color: #00C2C2;
    }

    @media(max-width: 992px) {
     .mentor-grid  .mentor-search {
        padding: 20px;
      }

     .mentor-grid  .mentor-card {
        margin-bottom: 20px;
      }
    }

    .mentor-grid .mentor-grid{
      padding: 80px 100px;
    }




    /* .mentor-grid .mentor-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      color: #fff;
      display: flex;
      flex-direction: column;
      align-items: start;
      justify-content: end;
      text-align: left;
      padding: 24px 40px 32px 40px;
      opacity: 0;
      transition: all 0.4s ease;
      z-index: 2;
    } */

      .mentor-grid .mentor-overlay {
        position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  color: #fff;
  text-align: left;
  padding: 24px 32px;
  background-color: var(--mentorColor, rgba(0,0,0,0.7)); 

  opacity: 0;
  transition: opacity 0.4s ease;
  
  z-index: 2;
    } 


     /* Hover Effects */
    .mentor-grid .mentor-card:hover img {
      transform: scale(1.1);
    }

    /* .mentor-grid .mentor-card:hover .mentor-overlay  {
      position: absolute;
    top: 0;
    left: 0;
    right: 0;

    bottom: 0; 
    width: 100%;
    
   
    transform: scaleY(0); 
    transform-origin: bottom; 
    
    background-color: rgba(0, 194, 194, 0.8);
    transition: transform 0.5s ease-out;
    
    display: flex;
    align-items: flex-end; 
    color: #ffffff;
    padding: 35px;
    flex-direction: row;
    
    opacity: 1;
    pointer-events: none; 
    z-index: 2; 
    } */
     

   /* .mentor-grid  .mentor-card:hover .mentor-info {
      opacity: 2!important;
    } */



    /* Background colors for overlay */
   /* .mentor-grid .bg1 { background: rgba(131, 163, 32, 0.8); }
    .mentor-grid .bg2 { background: rgba(157, 98, 198, 0.8) }
    .mentor-grid .bg3 { background: rgba(152, 89, 57, 0.8); }
    .mentor-grid .bg4 { background: rgba(247, 188, 152, 0.8); } */
    

 /* .mentor-grid .con-bg1 { background: rgba(131, 163, 32, 1); }
   .mentor-grid  .con-bg2 { background: rgba(157, 98, 198, 1) }
    .mentor-grid .con-bg3 { background: rgba(152, 89, 57, 1); }
    .mentor-grid .con-bg4 { background: rgba(247, 188, 152, 1); } */

     /* Hover Effects */
   .mentor-grid  .mentor-card:hover img {
      transform: scale(1.1);
    }

   .mentor-grid  .mentor-card:hover .mentor-overlay {
      opacity: 0.8;
    }

    .mentor-grid .mentor-card:hover .mentor-info {
      opacity: 0;
    }


    .mentor-grid .mentor-overlay h4{
        font-size: 28px;
      font-weight: 800;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }
    .mentor-grid .mentor-overlay h5{
        font-size: 20px;
      font-weight: 500;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }

     .mentor-grid .mentor-overlay p{
        font-size: 16px;
      font-weight: 400;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }

     .mentor-grid  .mentor-overlay h6{
        font-size: 20px;
      font-weight: 500;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }

   .mentor-grid  .mentor-grid .container {
      padding-left: 0px;
      padding-right: 0px;
    }

    .mentor-grid .page-item .active{
      background-color: #00C2C2;
      border-radius: 2px!important;
    }
    .mentor-grid .page-link{
      border: none;
    }

    .mentor-grid{
      padding: 80px 100px;
    }
  





     /* All alumni */



  

   .all-alumni-grid .page-header {
      text-align: center;
      margin-bottom: 60px;
    }

    .all-alumni-grid .page-header h2 {
      font-weight: 700;
      font-size: 40px;
      color: #333333;
      font-family: 'Nunito Sans', sans-serif!important;
    }

   .all-alumni-grid .page-header p {
      color: #838383;
      font-size: 24px;
      font-weight: 400;
      margin-bottom: 0px;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    .all-alumni-grid .mentor-search {
      background: #fff;
      padding: 40px;
      box-shadow: 0 4px 15px rgba(0,0,0,0.1);
      margin: 40px auto;
    }

     .all-alumni-grid .mentor-search h4 {
      font-weight: 700;
       font-family: 'Nunito Sans', sans-serif!important;
      font-size: 32px;
      color: #333333;
    }

    .all-alumni-grid .mentor-search p {
      color: #838383;
      font-weight: 400;
      font-size: 20px;
       font-family: 'Nunito Sans', sans-serif!important;
    }

    .all-alumni-grid .search-bar input {
      border-radius: 2px 0px 0px 2px;
      margin-bottom: 0px;
      padding: 15px;
      border: 0.6px solid #CFCFCF !important;
    }

    .all-alumni-grid .search-bar button {
      background: #F6BB3A;
      border: none;
      border-radius: 8px;
      color: #fff;
      font-weight: 500;
      width: 18%;
      padding: 10px 20px;
    }

    /* Mentor Cards */
    .all-alumni-grid .mentor-card {
      position: relative;
      overflow: hidden;
      height: 100%;
      transition: transform 0.3s ease;
    
  filter: drop-shadow(0 6px 6px rgba(0, 0, 0, 0.1));


    }

    .all-alumni-grid .mentor-card img {
     width: 100%;
    height: 540px;
      object-fit: cover;
    }

    .all-alumni-grid .mentor-info {
     position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      color: #000;
      background-color: #fff;
      padding: 24px 40px 32px 40px;
      text-align: left;
      transition: opacity 0.3s ease;
     display: flex;
    height: 140px;
    align-items: flex-start;
    flex-direction: column;
    justify-content: space-around;
    }

    .all-alumni-grid .mentor-card:hover .mentor-info {
      transform: translateY(0);
    }

    .all-alumni-grid .mentor-info h6 {
      font-weight: 700;
      font-size: 28px;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 5px;
    }

   .all-alumni-grid .mentor-info p {
      /* font-size: 16px;
      font-weight: 500;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 10px; */
      font-size: 18px;
    font-weight: 500;
    font-family: 'Nunito Sans', sans-serif !important;
    text-overflow: ellipsis;
    color: #747474;
    margin-bottom: 10px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    overflow: clip;
    }

    .all-alumni-grid .mentor-overlay button {
      background: #F6BB3A;
      border: none;
      padding: 10px 30px;
      border-radius: 0px;
    }

     .all-alumni-grid .mentor-overlay button p{
      font-size: 16px;
      color: #fff;
       font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 0px;
      font-weight: 700;
    }

    .all-alumni-grid .mentor-search button p{
      font-size: 20px;
      font-weight: 500;
      margin-bottom: 0px;
      color: #939393;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    .all-alumni-grid .pagination-section {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
      margin-top: 60px!important;
      margin: 0px 120px;
      border-radius: 4px;
      padding: 10px 40px;
      box-shadow: 0 12px 15px rgba(0, 0, 0, 0.2);
    }

   .all-alumni-grid .rows-dropdown select {
      border-radius: 4px;
      background-color: #F6BB3A;
      padding: 5px 10px;
      color: #fff;
      width: 60px!important;
    }

    .all-alumni-grid .form-select option{
      color: #fff!important;
    }

    .all-alumni-grid .rows-dropdown label{
      font-size: 14px;
      font-weight: lighter;
      color: #7E7E7E;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    .all-alumni-grid .border_solid button{
      border: 0.6px solid #CFCFCF;
      padding: 8px 52px;
    }

    .all-alumni-grid .border_solid button:hover{
      border: #838383 0.6px solid;
    }

    .all-alumni-grid .page-item .active{
      background-color: #00C2C2;
    }

#searchBtn{
    font-size: 20px;
    font-family: 'Nunito Sans', sans-serif!important;
    font-weight: 600;
    color: #fff;
    border-radius: 0px 2px 2px 0px;
}
    @media(max-width: 992px) {
     .all-alumni-grid  .mentor-search {
        padding: 20px;
      }

     .all-alumni-grid  .mentor-card {
        margin-bottom: 20px;
      }
    }

    .all-alumni-grid .mentor-grid{
      padding: 80px 100px;
    }



 /* Hidden overlay full area */
    .all-alumni-grid .mentor-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      color: #fff;
      display: flex;
      flex-direction: column;
      align-items: start;
      justify-content: end;
      text-align: left;
      padding: 24px 40px 32px 40px;
      opacity: 0;
      transition: all 0.4s ease;
      z-index: 2;




      
    }


     /* Hover Effects */
    .all-alumni-grid .mentor-card:hover img {
      transform: scale(1.1);
    }

    .all-alumni-grid .mentor-card:hover .mentor-overlay {
      opacity: 1;
       
    }

   .all-alumni-grid  .mentor-card:hover .mentor-info {
      opacity: 0;
    }



    /* Background colors for overlay */
   .all-alumni-grid .bg1 { background: rgba(0, 194, 194, 0.8); }
    

 .all-alumni-grid .con-bg1 { background: rgba(131, 163, 32, 1); }
   .all-alumni-grid  .con-bg2 { background: rgba(157, 98, 198, 1) }
    .all-alumni-grid .con-bg3 { background: rgba(152, 89, 57, 1); }
    .all-alumni-grid .con-bg4 { background: rgba(247, 188, 152, 1); }

     /* Hover Effects */
   .all-alumni-grid  .mentor-card:hover img {
      transform: scale(1.1);
    }

   .all-alumni-grid  .mentor-card:hover .mentor-overlay {
      opacity: 1;
    }

    .all-alumni-grid .mentor-card:hover .mentor-info {
      opacity: 0;
    }


    .all-alumni-grid .mentor-overlay h4{
        font-size: 28px;
      font-weight: 800;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }
    .all-alumni-grid .mentor-overlay h5{
        font-size: 20px;
      font-weight: 500;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }

     .all-alumni-grid .mentor-overlay p{
        font-size: 16px;
      font-weight: 400;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }

     .all-alumni-grid  .mentor-overlay h6{
        font-size: 20px;
      font-weight: 500;
      color: #fff;
      font-family: 'Nunito Sans', sans-serif!important;
    }

   .all-alumni-grid  .mentor-grid .container {
      padding-left: 0px;
      padding-right: 0px;
    }

    .all-alumni-grid .page-item .active{
      background-color: #00C2C2;
      border-radius: 2px!important;
    }
    .all-alumni-grid .page-link{
      border: none;
    }

    .all-alumni-grid{
      padding: 80px 100px;
      background-color: #ffffff;
    }
  


    /* Orca upcoming events */

    

    .Orca-event-section {
      padding: 80px 100px;
      text-align: center;
          background-color: #ffffff;

    }

    .Orca-event-section h2 {
      font-weight: 700;
      color: #122720;
      font-family: 'Nunito Sans', sans-serif!important;
      font-size: 40px;
      margin-bottom: 10px;
    }

    .Orca-event-section p {
      color: #838388;
      font-size: 24px;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 400;
      margin-bottom: 50px;
    }

    .Orca-event-section .event-box {
      background-color: #F4FFFF;
      border: 1px solid rgba(0, 194, 194, 0.2);
      padding: 60px;
      text-align: left;
      height: 100%;
      position: relative; /* 👈 Needed for positioning image */
    }

    /* 👇 Added: top-right logo inside event box */
    .Orca-event-section .event-box .corner-logo {
      position: absolute;
      top: 10px;
      right: 10px;
      width: 60px;
      height: 60px;
      object-fit: cover;
    }

    .Orca-event-section .event-box h4 {
      font-size: 40px;
      color: #333333;
      font-weight: 600!important;
      font-family: 'Nunito Sans', sans-serif!important;
    }

    .Orca-event-section .event-box p {
      color: #838388;
      font-size: 24px;
      font-weight: 400;
      font-family: 'Nunito Sans', sans-serif!important;
      margin-bottom: 20px;
    }

    .Orca-event-section .event-box h6 {
      color: #818181;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 700;
      display: flex;
      font-size: 24px;
      align-items: center;
      gap: 6px;
      margin-bottom: 40px;
    }

    .Orca-event-section .event-box h5 {
      color: #333333;
      font-weight: 700;
      font-family: 'Nunito Sans', sans-serif!important;
      display: flex;
      font-size: 24px;
      align-items: center;
      gap: 6px;
      margin-bottom: 12px;
    }

    /* Countdown Section */
    .Orca-event-section .countdown-wrapper {
      text-align: center;
    }

    .Orca-event-section .countdown {
      display: flex;
      /* flex-wrap: wrap; */
      gap: 15px;
      justify-content: center;
      margin-bottom: 15px;
    }

    .Orca-event-section .countdown div {
      background: linear-gradient(180deg, #00C2C2, #005C5C);
      color: #fff;
      padding: 15px 25px;
      flex: 1 1 100px;
      text-align: center;
    }

    .Orca-event-section .countdown div span {
      display: block;
      font-size: 48px;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 800;
      font-style: italic;
    }

    .Orca-event-section .countdown-labels {
      display: flex;
      justify-content: space-around;
      /* flex-wrap: wrap; */
      gap: 15px;
      margin-bottom: 40px;
    }

    .Orca-event-section .countdown-labels small {
      width: 100px;
      text-align: center;
      font-size: 16px;
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 500;
      color: #333333;
      display: inline-block;
    }

    .Orca-event-section .register-btn {
      background-color: #f6bb3a;
      color: #fff;
      border: none;
      padding: 12px 28px;
      transition: 0.3s;
    }

    .Orca-event-section .register-btn p {
      font-family: 'Nunito Sans', sans-serif!important;
      font-weight: 700;
      font-size: 16px;
      color: #fff;
      transition: 0.3s;
      margin-bottom: 0px;
    }

    .Orca-event-section .register-btn:hover {
      background-color: #e5a82a;
    }

    .Orca-event-section .event-image img {
      height: auto;
    }

    @media (max-width: 992px) {
      .Orca-event-section .event-box {
        text-align: center;
      }

      .Orca-event-section .event-box h6 {
        justify-content: center;
      }
    }
  


    /* index page alumni spotlight */



 .sportlight_events {
    
    padding: 80px 100px; 
    text-align: center;
    width: 100%; 
    box-sizing: border-box; 
    background-color: #fff;

      display: flex;
    justify-content: center;
    align-items: center;
    /* min-height: 100vh; */
    flex-direction: column;
} 


.sportlight_events .swiper {
    width: 99%;
    max-width: 1920px; 
    margin: 0 auto; 
    /* overflow: hidden; */
      overflow: visible !important;  
    padding: 0;
    position: relative;
    z-index: 1;
}


.sportlight_events .alumni-spotlight-title {
    font-size: 40px;
    font-weight: 700;
    color: #333333;
    font-family: 'Nunito Sans', sans-serif;
    margin-bottom: 10px;
    margin-top: 0px;
}

.sportlight_events .alumni-spotlight-subtitle {
    font-size:24px;
    color: #838383;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    margin-bottom: 40px;
}


.sportlight_events .mySwiper {
 height: 600px; 
}


.sportlight_events .swiper-slide {
  
    width: 67% !important; 
    max-width: 880px!important;
    height: 500px !important;
    background-color: white;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
   
    transition: transform 0.3s, opacity 0.3s;
}





.sportlight_events .swiper-slide .overlay-info {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
}


.sportlight_events .swiper-slide-active .overlay-info {
    opacity: 1;
    transform: translateY(0);
}


.sportlight_events .swiper-slide-active .blur-overlay {
    opacity: 1;
}


.sportlight_events .card-content {
    position: relative;
    width: 100%;
    height:100%;
}

.sportlight_events .alumni-image {
   
    width: 100%; 
    height: 100%;
    object-fit: cover;
    display: block;
}

.sportlight_events .overlay-info {
    position: absolute;
    top:10; 
    left: 0;
    right: 0;
    bottom: 0; 
    padding: 30px;
    color: white;
    text-align: left; 
    padding: 12px 60px 20px 60px;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(5px);
    z-index: 3; 
    display: flex;
    /* flex-direction: column; */
    justify-content: space-between; 
}


.sportlight_events .overlay-info h3 {
    margin: 0 0 5px 0;
    font-size: 2em; 
    font-weight: bold;
    font-family: 'Nunito Sans', sans-serif;
}

.sportlight_events .overlay-info p {
    margin: 0;
    font-size: 1.2em; 
    font-family: 'Nunito Sans', sans-serif;
    opacity: 0.9;
}



.sportlight_events .swiper-pagination {
    bottom: 100px !important;
    position: relative;
    width: fit-content !important;
    margin: 37px auto 0 auto;
    background-color: #fff;
    padding: 16px 40px;
    border-radius: 40px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sportlight_events .swiper-pagination-bullet {
    width: 16px;
    height: 16px;
    background: #CCF3F3;
    opacity: 0.6;
    margin: 0 4px;
    transition: all 0.3s;
    border-radius: 50%;
}

.sportlight_events .swiper-pagination-bullet-active {
    background: #00C2C2; 
    opacity: 1;
    height: 16px;
    border-radius: 99px;
    width: 72px;
}










@media (max-width: 600px) {
    .Upcoming_events_all .btn-know{
        width: fit-content;
    }
   .sportlight_events .swiper-slide {
        
        max-width: 90% !important; 
        height: 450px; 
    }
   .sportlight_events .alumni-spotlight-title {
        font-size: 24px;
    }
    .sportlight_events .alumni-spotlight-subtitle {
    font-size:16px;

}
.sportlight_events .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #CCF3F3;
    opacity: 0.6;
    margin: 0 4px;
    transition: all 0.3s;
    border-radius: 50%;
}

.sportlight_events .swiper-pagination-bullet-active {
    background: #00C2C2; 
    opacity: 1;
    height: 10px!important;
    border-radius: 99px;
    width: 40px!important;
}

}



#navbarNav {
  transform: translateX(100%);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050; 
  width: 100vw;
  height: 730px;
   /* background:rgba(0, 39, 39, 0.8); */
   background-color: #002727;
  border-radius: 0px;
backdrop-filter: blur(8px);
  transition: transform 0.4s ease-in-out; 
  overflow-y: auto; 

 
  display: none;

  justify-content: center; 
  align-items: center;
  pointer-events: none;
}

/* When Bootstrap adds `.show` */
#navbarNav.show {
  display: flex; /* 👈 only flex when open */
  transform: translateX(0);
  pointer-events: auto;
 
}


/* Optional: Center the menu items and style them for the overlay */
#navbarNav .navbar-nav {
  width: 100%;
  text-align: center;
}

#navbarNav .nav-item {
  /* margin: 10px 0; */
   margin: 4px 0;
}

#navbarNav .nav-link {
  font-size: 24px; /* Larger font size for better readability */
  color: #fff !important; /* White text color */
    font-family: 'Nunito Sans', sans-serif;
    font-weight:600!important;
     padding: 8px 0px;
}

  .nav-link {
    position: relative;
    display: inline-block;
    text-decoration: none; /* remove default underline */
    cursor: pointer;
   
  }

  /* Create the underline */
  .nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    left: 0;
    bottom: 0;
    background-color: #fff;
    transition: width 0.3s ease;
  }

  /* Animate on hover */
  .nav-link:hover::after {
    width: 100%;
  }








/* Style for the close button */
.menu-close-btn {
  position: absolute!important;
  top: 6px!important;
  right: 92px!important;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 4rem; /* Large X for easy clicking */
  cursor: pointer;
  z-index: 1060; /* Higher than the overlay */
  opacity: 0.8;
  transition: opacity 0.2s;
}

.menu-close-btn:hover {
  opacity:1;
}

/* Hide the default navbar toggler icon when menu is open to only show the close button */
.navbar-toggler[aria-expanded="true"] .menu-toggle-button {
    display: block;
}



/* Keep the body scrollable */
html, body {
  margin: 0;
  padding: 0;
  overflow-y: scroll; /* always scrollable */
   
}

/* Hide scrollbar for Chrome, Safari, Edge */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}

/* Hide scrollbar for Firefox */
body {
  scrollbar-width: none;
}

   .no-scroll {
    overflow: hidden !important;
    height: 100vh !important;
}

@media (max-width: 600px){
    .no-scroll {
    overflow: hidden !important;
    height: 100vh !important;
}


  #navbarNav {
  transform: translateX(100%);
 
  top: -16px;
        right: 0px;
        bottom: 0;
        left: -25px;
        z-index: 1050;
        width: 100vw;
        height: 100vh;
  
   background-color: #002727!important;
  border-radius: 0px;

  transition: transform 0.4s ease-in-out; 
  overflow-y: auto; 

 
  display: none;

  justify-content: center; 
  align-items: center;
  pointer-events: none;
}  

#navbarNav .menu-close-btn {
    position: absolute !important;
  /* top: -13px !important;
        right: 15px !important; */
        top: 5px!important;
        right: 40px!important;
    background: transparent;
    border: none;
    color: #fff;
    font-size: 3rem;
    cursor: pointer;
    z-index: 1060;
    opacity: 0.8;
    transition: opacity 0.2s;
}
}

.mentor-grid .container-fluid{
    padding-left: 0px;
    padding-right: 0px;
}

.all-alumni-grid .container-fluid{
    padding-left: 0px;
    padding-right: 0px;
}

.mentor-grid .active>.page-link, .page-link.active{
background-color: #00C2C2 !important;
}
.all-alumni-grid .active>.page-link, .page-link.active{
background-color: #00C2C2 !important;
}

 .mentorship-section .container-fluid{
        padding-left: 0px;
        padding-right: 0px;
    }

/* collaborate */
.mentor-grid h2{
font-weight: 700;
    font-size: 40px;
    color: #333333;
    font-family: 'Nunito Sans', sans-serif !important;
}
.mentor-grid .tag{
    color: #838383!important;
    font-size: 24px;
    font-weight: 400;
    margin-bottom: 0px;
    font-family: 'Nunito Sans', sans-serif !important;
}

@media(max-width:600px){
    .mentor-grid h2{
        font-size: 24px;
    }
    .mentor-grid p{
        font-size: 16px;
    }
}


.navbar-dark, .navbar[data-bs-theme=dark]{
    --bs-navbar-color: transparent!important;
}



.not-found{
    font-family: 'Nunito Sans', sans-serif !important;
    font-size: 18px;
    font-weight: 500;
}