:root {
    --lighterblue: #6EBFEB;
    --lightblue: #2EA3DE;
    --blue: #176BB5;
    --darkblue: #1C4596;
}
body {
      font-family: 'Montserrat', sans-serif;
      scroll-behavior: smooth; font-style: normal; background: #FFF;
    }
.resp{ width: 100%;}
h1, h2, h3, h4, h5{ color: var(--darkblue); font-weight: 500 !important; letter-spacing: -1px; text-transform:uppercase !important;}
.extra-space{ padding-top: 100px !important; padding-bottom: 100px !important;}    




    
.hero-section h1{ display:inline-block; padding:10px 16px; line-height:32px; background: var(--darkblue); font-size: 1.7rem; margin:0; color: #FFF; text-shadow: 0 0 3px #000; font-weight: 600 !important; text-transform: uppercase;}
.hero-section h1 sup{ color: #FFF; font-size: 12px;}

.hero-section h2{ display:inline-block;  color: #FFF; padding:8px 16px; line-height:22px; background: var(--blue); font-size: 1.4rem; font-weight: 500 !important; clear: both;}

.hero-section p{ display:inline-block; padding:6px 16px; line-height:22px; background: var(--lighterblue); font-size:1rem; font-weight: 500; color: var(--darkblue);}

.hero-section h6{ font-weight: 600; color: #333;}
.hero-section h4{ font-weight: 700 !important; font-size:32px;}

.note { font-size: 18px; line-height: 32px !important; font-weight: 600; letter-spacing: inherit;}
.note span{ font-size: 16px; font-weight: 500; display: block; color: #333; line-height: 16px;}


.spc { width: 80px; background: #6ebfeb; border-radius:6px; border: 1px solid #6ebfeb;}

@media (max-width:900px){
    p{ font-size: 12px !important; text-align: justify;}
    .title{ text-align: center;}
    .note{ font-size: 16px;}
    .note span{font-size: 12px;}
    .logo { width:100%; max-width: 240px !important;
    }
    .hero-section h1{ font-size: 1.3rem; display: block; border-radius: 10px 10px 0 0;}
    .hero-section h2{ font-size: 1.3rem; display: block;  border-radius:0 0 10px 10px;}
    .hero-section p{ font-size: 1.1rem !important; background: transparent; color: var(--darkblue);}
    .hero-section h4{ font-size: 18px;}
    .hero-section h6{ font-size: 12px;}
}
.navbar-nav{margin-top:20px; border-radius: 32px;
background: linear-gradient(90deg, rgba(18, 126, 194, 1) 0%, rgba(27, 187, 237, 1) 35%, rgba(29, 68, 153, 1) 100%);
 
}



/* Navbar solid background on scroll */
nav.navbar.scrolled {
  /*box-shadow: 0 2px 12px rgb(0 0 0 / 0.4);*/
  padding: 0.6rem 0;
    background: transparent;
    transition: background-color 0.4s ease, box-shadow 0.4s ease;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);    
}


.navbar-brand {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--lighterblue);
  letter-spacing: 0.05em;
  transition: color 0.3s ease;
}
.navbar-brand:hover {
  color: var(--lightblue);
  text-decoration: none;
}

.logo { width:100%; max-width: 200px; margin-top: 15px;
  transition: opacity 0.3s ease-in-out;
}
.dasman{ width: 260px; display: block; margin: 0 auto;}

.navbar-nav .nav-link { 
    display: block;
    padding:7px 10px !important;
    font-size:18px;
    font-weight: 600;
    color: #FFF;
    text-decoration: none;
    background: 0 0;
    border: 0px solid #fff;
    border-radius: 32px;
    transition: color .15s ease-in-out, background-color .15s ;
    }

/* Navbar links */

    /* Hover underline effect */
    .navbar-nav .nav-link::after {
      content: '';
      position: absolute;
      width: 0;
      height: 2px;
      display: block;
      margin-top: 4px;
      right: 0;
      transition: width 0.3s ease;
      -webkit-transition: width 0.3s ease;
      left: 0;
      bottom: 0;
    }
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus {
      color: #FFF; background: #1c4596; border: 0px solid #fff;
    }
    .navbar-nav .nav-link:hover::after,
    .navbar-nav .nav-link:focus::after {
      width: 100%;
    }

.bg-darkblue{  background-color:var(--darkblue) !important; }
    /* Mobile menu background */
    .navbar-collapse {
      background-color:var(--darkblue);
      padding: 1rem;
      border-radius: 8px;
      margin-top: 10px;
    }

    @media(min-width: 992px) {
      .navbar-collapse {
        background: transparent !important;
        margin-top: 0;
        padding: 0;
      }    
    }  
     

.countdown {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  align-items: stretch;
}

/* Each unit box (recommended wrapper .countdown-item) */
.countdown-item {
  flex: 0 1 40px;            /* responsive width */
  min-width: 80px;
  max-width: 160px;
  border-radius: 12px;
  padding: 12px 12px;
  text-align: center;
  border: 2px solid #4d4d4d;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* Number container */
.countdown-item .number,
.countdown .number {            
  font-weight: 500;
  font-size: 32px;
  line-height: 1;
  color: #4d4d4d;
  display: inline-block;
  perspective: 600px;          /* for 3D-like animation */
}

/* The changing digit itself */
.countdown-item .number span,
.countdown .number span,
.countdown .days,
.countdown .hours,
.countdown .minutes,
.countdown .seconds {
  display: inline-block;
  min-width: 48px;             /* keeps boxes aligned when numbers change */
  padding: 4px 10px;
  transition: transform 260ms cubic-bezier(.2,.8,.2,1), opacity 260ms;
  font-variant-numeric: tabular-nums; /* keeps digits aligned */    
}

/* Small label (DAY / HOUR / ...) */
.countdown-item .label,
.countdown .label {
  margin-top: 8px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #4d4d4d;
}

/* Pop/slide animation when value updates — apply .tick to the span */
@keyframes tickPop {
  0%   { transform: translateY(10px) rotateX(10deg) scale(0.96); opacity: 0; }
  60%  { transform: translateY(-6px) rotateX(-6deg) scale(1.03); opacity: 1; }
  100% { transform: translateY(0) rotateX(0) scale(1); opacity: 1; }
}
.countdown .tick,
.countdown-item .tick {
  animation: tickPop 420ms cubic-bezier(.2,.9,.3,1);
}

/* Responsive tweaks */
@media (max-width: 480px) {
  .countdown-item { flex: 1 1 25% !important; max-width: 21%; }
  .countdown-item .number { font-size: 20px; }
}

@media (max-width: 992px){
    .cdetails h5{ font-size: 14px; text-shadow: none !important; letter-spacing: inherit !important;}
    .cdetails p{ font-size:12px; color:#666; text-align:center !important;}
    .speaker-details h5{ font-size: 12px !important; letter-spacing: inherit !important;}
    .navbar-nav .nav-link{ color: #FFF;}
    .navbar-nav .nav-link:hover {
          color: var(--lightblue) !important;
        }
    
}
      
    
    .section { 
      padding: 80px 0;
    }
    .section h2 {
      font-weight: 700;
      margin-bottom: 30px;
    }
.section#welcome{ padding: 0; background: url('../../assets/welcome.jpg') no-repeat center top; background-size: cover;}
    .slider img {
      max-height: 300px;
      object-fit: contain;
    }
      
.hero-section {
  min-height: auto;
  /*background: linear-gradient(to right, #b6e6f8, #6fc3e0);*/
  background: url('../../slider-bg.jpg') no-repeat center top;
  background-size: cover;   
  padding:70px 0 100px 0;
  position: relative;
  overflow: hidden;
}



.hero-slider-images img {
  width: 100%;
  height: auto;       /* let it scale naturally */
  object-fit: contain;
  animation: fadeIn 1s ease-in-out;
}

@media (max-width: 767.98px) {
  .hero-section {
    padding: 80px 15px;   /* smaller padding on mobile */
    text-align: center;
  }

  .hero-section h6,
  .hero-section h4 {
    font-size: 14px;      /* shrink heading text */
    line-height: 1.4;
  }

  .countdown {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
  }

  .countdown-item {
    min-width: 60px;
  }
}

@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}


.slide-up {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.slide-up.active {
  opacity: 1;
  transform: translateY(0);
}


.scroll-bg-section {
  position: relative;
  min-height: auto;
  background: none;
  overflow: hidden;
  z-index: 1; background: #8ddfeb;
}



/* Content on top of background */
.scroll-bg-section .container {
  position: relative;
  z-index: 1;
}

.scroll-bg-section .bg-holder::after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background:#f1f1f1;
  /*background: var(--lighterblue);*/
}

.parallax-section {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  height: 100vh; /* full screen height */
  position: relative;
  display: flex;
  align-items: center;
  z-index: 1;
}

.parallax-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.6); /* dark overlay for text readability */
  z-index: 0;
}
.parallax-section .container {
  position: relative;
  z-index: 1;
}
@media (max-width: 768px) {
  .parallax-section {
    background-attachment: scroll;
  }
  .hamburger-btn {
  display: flex !important;
  }
}

.hamburger-btn {
  width: 42px;
  height: 32px;
  display: none;
  flex-direction: column;
  justify-content: space-between;
  background: none;
  border: none;
  cursor: pointer;
  padding: 5px;
  z-index: 1001;
}

.hamburger-btn span {
  display: block;
  width: 28px;
  height: 3px;
  background-color: #1c4596;  /* dark so it shows */
  border-radius: 2px;
  transition: all 0.3s ease;
}


/* When open, shape into an X */
.hamburger-btn.open span:nth-child(1) {
  transform: translateY(7px) rotate(50deg);
}

.hamburger-btn.open span:nth-child(2) {
  opacity: 0;
}

.hamburger-btn.open span:nth-child(3) {
  transform: translateY(-14px) rotate(-50deg);
}
.position-relative{
    display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

.committee-image img{ width: 280px; margin: 0 auto;}

@media (max-width:900px){
.committee-image img{ width: 100%; margin: 0 auto;}    
}

.speaker-box {
  display: flex; background: #f1f1f1;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  /*background: linear-gradient(145deg, #2EA3DE, #176BB5);*/    
  border-radius: 6px;
  overflow: hidden;
  /*box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);*/
  padding: 0;
  position: relative;
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  color: #fff;
}

.speaker-box:hover {
  transform: translateY(-8px);
  /*box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);*/
}

.speaker-image {
  overflow: hidden; background:#b8b7b7;
}

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

.speaker-box:hover .speaker-image img {
  transform: scale(1.05);
}
.speaker-box a{ cursor:pointer; text-decoration: none;}

.flag-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 40px; height: 40px;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

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

/* Make badge smaller on mobile */
@media (max-width: 576px) {
  .flag-badge {
    top: 5px;
    right: 5px;
    width: 32px;
    height: 32px;
  }
}



.cdetails h5{ color: #333; text-shadow: none !important; margin-top:10px; text-transform:capitalize !important; }

.speaker-details h5 { font-size: 17px; text-transform: capitalize !important; font-weight: 500; margin:20px auto 0 auto !important; padding: 0 !important;}
.speaker-details p{ font-size: 14px; color: #666; text-align: center; font-weight: 500; padding:0 10px;}
.cdetails p{ font-weight:500 !important; font-size:14px !important;}
  margin-top: 1rem; font-size: 17px; 
 letter-spacing:inherit; font-weight: 500 !important;
}

.speaker-details .title {
  font-size: 0.9rem;
  color: #bbb;
}


.timeline {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.bg-1{
  background: #d3f2fa;
}
.bg-2{
  background: #c6e7ff;
}
.agenda-card{
  padding:1rem 1.5rem;
  border-left: 5px solid #6ebfeb;
  border-radius: 8px;
  /*    
  border-top: 1px solid #cfcfcf;
  border-right: 1px solid #cfcfcf;
  border-bottom: 1px solid #cfcfcf;
  box-shadow:0 0px 12px rgba(0,0,0,0.05);
  */    
  animation: fadeInUp 0.6s ease;
  margin-bottom: 10px;    
}
.agenda-card h5{ font-size: 1.2rem;}
.agenda-card p{ font-size: 1rem; font-weight: 500;}
.agenda-block {
  padding: .5rem 1.5rem; border: 0px solid #cfcfcf;
  border-radius: 0px; /*box-shadow: 0 4px 4px rgba(0,0,0,0.05);*/
  /*box-shadow: inset 0 2px 8px rgba(0,0,0,0.08);*/
  animation: fadeInUp 0.4s ease; margin-bottom: 10px !important;
}
.agenda-card .time{ font-size: 14px; font-weight: 600;}
.bg-faq{ background: #c4f1fc !important; color: #333;}
.bg-break{ background: #6ebfeb !important; color: #FFF;}
.bg-session{ background: #176bb5 !important; color: #FFF;}
.bg-sessions{ background: #1c4596 !important; color: #FFF;}

@media (max-width:900px){
 .agenda-card h6{ font-size: 17px; margin-top: 5px;} 
    .agenda-card p, .agenda-card p strong{ font-size: 1rem !important; text-align: left !important;}    
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.agenda-tabs {
  flex-wrap: nowrap;
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE */
  border-bottom: 2px solid #eee;    
}
.agenda-tabs::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
}


.agenda-tabs .nav-link {
  position: relative;
  color: #ccc;
  font-weight: 600;
  font-size: 1.5rem;
  margin: 0 auto;
  padding: 0.75rem 2rem;
  background: #eee;
  border: none;
  border-radius: 0;
  transition: all 0.3s ease; text-align: center;
}
@media (max-width:900px){
    
    .agenda-tabs .nav-link { padding: 0.75rem .6rem !important; font-size: 0.8rem !important; text-align: center;}
    .agenda-tabs .nav-link span { font-size: 11px !important;}
}
.agenda-tabs .nav-link::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0%;
  height: 6px;
  background: #66c;
  transition: width 0.3s ease;
}



.agenda-entry {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 20px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  flex-wrap: wrap;
  transition: transform 0.3s ease;
}

.agenda-entry:hover {
  transform: translateY(-3px);
}

.agenda-entry .time {
  font-weight: bold;
  width: 120px;
  color: #333;
}

.agenda-entry .lecture {
  flex: 1;
}

.agenda-entry .lecture h5 {
  margin: 0 0 5px;
  font-size: 1rem;
}

.agenda-entry .speaker {
  font-size: 0.9rem;
  color: #666;
  display: flex;
  align-items: center;
  gap: 10px;
}

.agenda-entry .speaker img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
}

/* Colors */
.agenda-entry.session {
  background: #f8f9fa;
  border-left: 5px solid #007bff;
}
.agenda-entry.break {
  background: #eaf7ff;
  border-left: 5px solid #17a2b8;
}
.agenda-entry.faq {
  background: #fff3cd;
  border-left: 5px solid #ffc107;
}

/* Responsive */
@media (max-width: 768px) {
  .agenda-entry {
    flex-direction: column;
    align-items: flex-start;
    padding: 15px;
  }
  .agenda-entry .time {
    width: 100%;
    margin-bottom: 8px;
  }
  .agenda-entry .speaker {
    flex-direction: row;
  }
}

.agenda-tabs .nav-link:hover::after,
.agenda-tabs .nav-link.active::after {
  width: 100%;
}

.agenda-tabs .nav-link:hover,
.agenda-tabs .nav-link.active {
  color: #fff; background: #176bb5;
}

.nav-link img{ width:54px; display: block; margin:0 auto 3px auto;}
.nav-link span { font-size: .8rem; display: block; color: #dadada; font-weight: 500;}
.text-gray { color: #999;}


.footer-section {
  background-color: #336;
  color: #ddd;
  font-size: 0.95rem;
}

.footer-section h5 {
  color: #fff;
  font-weight: 600;
}

.footer-section .footer-link {
  color: #bbb;
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-section .footer-link:hover {
  color: #007bff;
  text-decoration: none;
}

.footer-section ul {
  padding-left: 0;
  list-style: none;
}

.footer-section p {
  margin-bottom: 0.5rem;
}
.xs { font-size: 12px;}
@media (max-width: 767px) {
    .xs { font-size: 10px;}
  .footer-section {
    text-align: center;
  }
}




.sponsor-card {
  background: #222;
  color: #fff;
  border-radius: 15px;
  padding: 25px 20px;
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
  transition: transform 0.3s ease;
}
.sponsor-card:hover {
  transform: translateY(-5px);
}
.sponsor-card h4 {
  font-size: 1.5rem;
  margin-bottom: 10px;
}
.sponsor-card h5 {
  font-size: 1.2rem;
  margin-bottom: 20px;
  color: #ccc;
}
.sponsor-card ul {
  list-style: none;
  padding: 0;
  margin-bottom: 20px;
}
.sponsor-card ul li {
  margin-bottom: 10px;
}

/* Color themes */
.sponsor-card.platinum {
  background: linear-gradient(135deg, #e5e4e2, #d4af37);
  color: #000;
}
.sponsor-card.gold {
  background: linear-gradient(135deg, #FFD700, #e6c200);
  color: #000;
}
.sponsor-card.silver {
  background: linear-gradient(135deg, #C0C0C0, #b8b8b8);
  color: #000;
}
.sponsor-card.bronze {
  background: linear-gradient(135deg, #cd7f32, #b87333);
  color: #fff;
}



.modal-content {
  border-radius: 12px;
  border: none;
}

.modal-header {
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
label{ font-weight: 400 !important;}
.form-control{ font-weight: 400 !important; padding: 12px; margin-bottom: 10px;}
::placeholder { color: #bbb !important; font-weight: 300 !important;}