/* ===========================
   Reset
=========================== */
* { margin: 0; padding: 0; box-sizing: border-box; }

/* ===========================
   Global
=========================== */
body {
  margin: 0;
  min-height: 100vh;
  background: linear-gradient(135deg, #b5e0d8, #c4d7d6, #a9c7c2);
  background-attachment: fixed;
  font-family: 'Orbitron', sans-serif;
  color: #111827;
}

/* Particle Background (SINGLE SOURCE OF TRUTH) */
#particle-canvas{
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  background: linear-gradient(135deg, #E8DDD7, #A7C7BD, #C9D6E3);
}

/* ===========================
   Preloader
=========================== */
.preloader{
  position: fixed; inset: 0;
  background:#2563EB; color:#F0F4FF;
  display:flex; align-items:center; justify-content:center;
  font-size:2rem; letter-spacing:.15em; z-index: 9999;
  animation: fadeOut 1s ease forwards; animation-delay:3s;
}
.preloader--hide{ animation: fadeOut 2s forwards; }
@keyframes fadeOut { to{ opacity:0; visibility:hidden; } }
.loader{ text-transform:uppercase; font-weight:700; animation:pulse 2s infinite ease-in-out; color:#E6FFFA; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.5} }

/* ===========================
   Header / Navbar
=========================== */
header{ background: linear-gradient(90deg, #2563EB, #9333EA); 
  padding: 1rem 2rem; 
  display:flex; 
  align-items:center; 
  justify-content:space-between; 
  border-bottom:2px solid #E6FFFA; 
  position: sticky; top:0;
   z-index: 1000; box-shadow: 0 2px 8px rgba(0,0,0,.25); } 
.logo{ height:50px; width:auto; } 
nav ul{ list-style:none; display:flex; gap:2rem; } 
nav ul li a{ color:#F0F4FF; text-decoration:none; font-weight:600; transition:color .3s ease; } 
nav ul li a:hover, nav ul li a:focus{ color:#E6FFFA; }



/* ===========================
   Hover Banner
=========================== */
.hover-banner{
  background: linear-gradient(90deg, #9333EA, #2563EB);
  border-bottom:1px solid #E6FFFA; overflow:hidden; position:relative; z-index: 950;
}
.scrolling-text{
  white-space:nowrap; display:inline-block; padding:.5rem 0;
  color:#F0F4FF; font-weight:700; font-size:.85rem;
  animation: scrollText 100s linear infinite;
}
@keyframes scrollText { 0%{transform:translateX(100%)} 100%{transform:translateX(-100%)} }

/* ===========================
   Section & Container Defaults
=========================== */
section{ padding: 4rem 1rem; }
.container{ max-width: 1200px; margin: 0 auto; }
h2{
  font-size: 2.5rem; color:#2563EB; margin-bottom:1.5rem; text-align:center; text-transform: none;
}
h3{ margin-top:2rem; font-size:1.8rem; color:#9333EA; }

/* ===========================
   Hero
=========================== */
.hero-left .hero-title{
  font-size: 4rem; font-weight:900; color:#2563EB; text-transform:uppercase;
  margin-bottom:1rem; white-space:nowrap; line-height:1;
  word-spacing: .35rem; /* INSIGNIA | 2025 ka gap */
}
.info-links{
  display:flex; align-items:center; gap:3rem;
  font-size:1.8rem; color:#9333EA; font-weight:800; margin-bottom:1.5rem; letter-spacing:1px;
}
.info-links span{
  cursor:pointer; padding:.4rem .9rem; border-radius:6px;
  transition: background-color .3s ease, color .3s ease, transform .2s ease;
}
.info-links span:hover, .info-links span:focus{
  background:#9333EA; color:#F0F4FF; transform: scale(1.05);
}

/* optional small banner image on right of WHAT/WHY/WHEN if you add it */
.info-links .info-banner{ height:40px; margin-left:auto; opacity:.9; transition: transform .3s ease; }
.info-links .info-banner:hover{ transform: scale(1.05); }

.event-info p{ font-size:1.4rem; margin-bottom:.9rem; font-weight:600; color:#111827; }

/* Countdown */
#countdown{
  display:flex; gap:.7rem; justify-content:center; margin-top:1rem;
  font-size:1.4rem; font-weight:700;
}
#countdown div{
  padding:.7rem 1rem; border:2px solid #2563EB; border-radius:10px; min-width:60px; text-align:center;
  background:#F0F4FF; color:#2563EB; font-weight:800; box-shadow:0 2px 8px rgba(37,99,235,.3);
}

/* Hero Right Banner image constraints */
.hero-right .banner{ max-width: 540px; width: 100%; height:auto; }

/* ===========================
   Partners (White card look)
=========================== */
.partners{
  display:flex; justify-content:center; gap:2rem; margin-top:3rem; padding:1rem 0;
  background:#2563EB; border-radius:10px; box-shadow:0 0 25px #2563eb33; flex-wrap:wrap;
}
.partners img{
  max-height:80px; width:auto; filter:grayscale(50%); transition: filter .3s ease, transform .3s ease;
  cursor:pointer;
}
.partners img:hover{
  filter:grayscale(0%); transform:scale(1.1);
  filter: drop-shadow(0 0 5px #2563EB); -webkit-filter: drop-shadow(0 0 5px #2563EB);
}

/* ===========================
   About (small box)
=========================== */
#about{
  padding:2rem; background:#ffffff; max-width:900px; margin:0 auto 3rem auto;
  border-radius:12px; box-shadow:0 0 25px #9333ea33; color:#111827;
}
#about h2{ margin-bottom:1rem; color:#2563EB; font-weight:700; font-size:2rem; text-transform:uppercase; }
#about p{ font-size:1.1rem; line-height:1.5; }

/* ===========================
   NEW: About Insignia / Competition / Schedule / Speakers (big sections)
=========================== */
.about-section {
  padding: 60px 20px;
  background: transparent; /* background ke sath merge ho */
  text-align: center;
}

.about-content {
  max-width: 1100px; /* readability ke liye width limit */
  margin: 0 auto; /* center align */
  color: #222; /* text color readable ho */
}

.about-content h2, 
.about-content h3 {
  margin-bottom: 20px;
  font-weight: 700;
}

/* Fix for bullet points positioning */
.about-content ul {
  text-align: left; /* Align list to left for better readability */
  max-width: 800px; /* Control width of lists */
  margin: 0 auto 30px auto; /* Center the list container */
  padding-left: 20px; /* Reduce left padding to bring bullets closer */
}

.about-content li {
  margin-bottom: 8px; /* Add some spacing between list items */
  line-height: 1.5; /* Improve readability */
}


.competition-section .round{
  background:#F0F4FF; padding:1.5rem; border-left:5px solid #2563EB;
  margin-bottom:1rem; border-radius:8px;
} /* <-- MISSING BRACE FIXED (this was breaking below CSS) */

.schedule-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2rem;
}
.schedule-section .day{
  background:#F0F4FF; padding:1.5rem; border-radius:10px; box-shadow:0 3px 8px rgba(0,0,0,.1);
}

.speakers-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(350px,1fr)); gap:2rem; margin-top:2rem;
}
.speaker-card{
  display:flex; align-items:center; gap:1rem; background:#fff; padding:1.5rem; border-radius:12px;
  box-shadow:0 3px 8px rgba(0,0,0,.1);
}
.speaker-card img{
  width:120px; height:120px; border-radius:50%; object-fit:cover; border:3px solid #2563EB;
}
.speaker-info h4{ font-size:1.3rem; color:#2563EB; }
.speaker-info p{ font-size:.95rem; color:#374151; }

/* ===========================
   Tracks Container
=========================== */
#tracks {
  padding:2rem;
  max-width:95%;
  margin:0 auto 3rem auto;
  background:#ffffff;           /* container white */
  box-shadow:0 0 25px #9333ea33;
  color:#111827;
  border-radius:12px;
}

#tracks h2 {
  color:#2563EB;
  margin-bottom:1.5rem;
  font-weight:700;
  font-size:2rem;
  text-transform:uppercase;
  text-align:center;
}

/* ===========================
   Track Cards
=========================== */
.tracks {
  padding:0;
  margin:0;
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:1.5rem;
  justify-content:center;
}

.tracks li {
  background:#2563EB;              /* blue cards */
  border-radius:12px;
  padding:1.5rem 1rem;
  flex:0 0 calc(25% - 1.5rem);     /* desktop: 4 per row */
  text-align:center;
  color:#F0F4FF;
  font-weight:700;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  box-shadow:0 0 15px #2563eb55;
  transition: transform .3s ease, box-shadow .3s ease;
  min-height:300px;                /* 🔹 equal card height */
}

.tracks li:hover {
  transform: translateY(-6px);
  box-shadow:0 0 25px #2563ebcc;
}

/* 🔹 Image Wrapper for equal sizing */
.tracks li .img-wrapper {
  width:80px;
  height:80px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:.75rem;
}

.tracks li img {
  max-width:100%;
  max-height:100%;
  object-fit:contain;              /* maintain aspect ratio */
  filter: drop-shadow(0 0 2px #2563EB);
}

.tracks li h3 {
  margin:0.5rem 0;
  font-size:1.1rem;
}

.tracks li .description {
  font-size:.85rem;
  font-weight:400;
  line-height:1.3;
  color:#E6FFFA;
  margin-top:auto;                 /* description bottom */
}

/* ===========================
   Responsive
=========================== */
@media (max-width:992px) {
  .tracks li {
    flex:0 0 calc(33.333% - 1rem); /* tablet: 3 per row */
  }
}

@media (max-width:768px) {
  .tracks li {
    flex:0 0 calc(50% - 1rem);     /* mobile: 2 per row */
  }
}

@media (max-width:480px) {
  .tracks li {
    flex:0 0 100%;                 /* very small: 1 per row */
  }
}

/* ===========================
   Registration
=========================== */
#register{
  padding:2rem; background:#ffffff; max-width:900px; margin:0 auto 3rem auto; border-radius:8px;
  box-shadow:0 0 30px #2563eb55; color:#111827;
}
.pages-grid{ margin-bottom:1.5rem; gap:1rem; }
.page-card{
  background:#2563EB; border-radius:8px; padding:1rem; color:#F0F4FF;
  box-shadow:0 0 20px #9333ea55; cursor:pointer; text-align:center;
  transition: transform .3s ease, box-shadow .3s ease, background .3s ease, color .3s ease;
  margin-bottom:1rem;
}
.page-card h3{ color:#F0F4FF; font-weight:800; }
.page-card:hover{
  background:#f0faff; color:#000; transform: scale(1.05);
  box-shadow: 0 0 20px rgba(0,255,255,.7);
}
.page-card:hover h3, .page-card:hover p{ color:#000; }

/* Register buttons */
.register-btn-container p{ margin-bottom:8px; font-size:1.1rem; color:#111827; }
.register-btn{
  display:inline-block; min-width:250px; border-radius:10px; font-weight:600; transition: all .3s ease;
}
.register-btn:hover{ transform:scale(1.05); box-shadow:0 4px 15px rgba(0,0,0,.2); }
.btn-primary{ background-color:#2563EB; border:none; }
.btn-success{ background-color:#9333EA; border:none; }
.register-btn:hover, .register-btn:focus{
  background: linear-gradient(45deg, #2563EB, #9333EA); box-shadow:0 0 35px #9333eacc;
}

/* ===========================
   Sponsor & Investor
=========================== */
#sponsor, #investor{
  padding:2rem; background:#ffffff; max-width:900px; margin:0 auto 3rem auto; border-radius:12px;
  box-shadow:0 0 30px #2563eb33; color:#111827;
}
#sponsor h2, #investor h2{
  margin-bottom:1rem; color:#2563EB; font-weight:700; font-size:2rem; text-transform:uppercase; text-align:center;
}
#sponsor h4, #investor h4{ color:#9333EA; margin-top:1.5rem; font-size:1.25rem; font-weight:700; }
#sponsor ul, #investor ul{
  margin-bottom:1.5rem; padding-left:1.25rem; list-style: inside disc; font-size:1.05rem;
}
#sponsor ul li, #investor ul li{ margin-bottom:.5rem; }
#sponsor a.btn, #investor a.btn{
  border-radius:25px; font-weight:700; padding:.6rem 1.5rem; box-shadow:0 0 15px #9333ea33;
  transition: transform .2s ease, box-shadow .2s ease;
}
#sponsor a.btn:hover, #investor a.btn:hover{ transform:scale(1.05); box-shadow:0 0 25px #2563ebcc; }
#sponsor .contact-block, #investor .contact-block{
  background:#E6FFFA; padding:1rem; border-radius:10px; box-shadow: inset 0 0 10px #9333ea22; text-align:center;
}

/* ===========================
   Venue
=========================== */

#venue {
  margin-top: 0 !important;
  padding-top: 20px; /* thoda space rahe toh clean lage */
}

.venue-header{
  background:url("assets/venue-bg.png") center/cover no-repeat; color:#fff; padding:80px 20px;
}
.venue-header h2{ font-size:28px; font-weight:bold; }
.venue-header p{ font-size:16px; margin-bottom:20px; }
.venue-header .btn{ background:#2563EB; border:none; padding:10px 25px; border-radius:6px; font-size:16px; font-weight:bold; }
.map-section{ padding:40px 20px; background: linear-gradient(135deg, #2563EB, #9333EA); color:#2563EB; }


<!-- CSS for Venue -->
<style>
  #venue {
    margin: 60px 0;
  }
  .venue-header {
    background: url("assets/venue-bg.png") center/cover no-repeat; /* Replace with your photo */
    color: white;
    padding: 80px 20px;
  }
  .venue-header h2 {
    font-size: 28px;
    font-weight: bold;
  }
  .venue-header p {
    font-size: 16px;
    margin-bottom: 20px;
  }
  .venue-header .btn {
    background: #0099cc;
    border: none;
    padding: 10px 25px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: bold;
  }
  .map-section {
    padding: 40px 20px;
    background: linear-gradient(135deg, #007bff);
    color: white;
  }
</style>

/* ===========================
   Contact
=========================== */
#contact{
  padding:2rem; background:#ffffff; max-width:900px; margin:0 auto 3rem auto; border-radius:12px;
  box-shadow:0 0 30px #9333ea55; color:#111827;
}
#contact h2{
  margin-bottom:1rem; color:#2563EB; font-weight:700; font-size:2rem; text-transform:uppercase; text-align:center;
}
#contact form{ display:flex; flex-direction:column; gap:1rem; max-width:600px; margin:0 auto; }
#contact label{ font-weight:700; color:#2563EB; }
#contact input, #contact textarea{
  padding:.5rem; border-radius:8px; border:1px solid #9333EA; font-size:1rem; background:#F9F9F9; color:#111827;
}
#contact input:focus, #contact textarea:focus{ outline:2px solid #2563EB; background:#fff; }
#contact button{
  background: linear-gradient(45deg, #2563EB, #9333EA); color:#F0F4FF; border:none; padding:.75rem;
  font-weight:700; font-size:1.2rem; border-radius:25px; cursor:pointer; box-shadow:0 0 25px #9333ea55;
  transition: background .3s ease, box-shadow .3s ease;
}
#contact button:hover, #contact button:focus{
  background: linear-gradient(45deg, #9333EA, #2563EB); box-shadow:0 0 35px #2563ebcc;
}

/* ===========================
   FAQ
=========================== */
#faq .accordion-button{
  background:#f9f9ff; color:#111827; border-radius:8px !important; transition: all .3s ease;
}
#faq .accordion-button:not(.collapsed){
  background:#2563EB; color:#fff; box-shadow:0 0 10px #2563EB55;
}
#faq .accordion-button:focus{ box-shadow:none; }
#faq .accordion-body{ text-align:left; color:#374151; font-size:.95rem; line-height:1.6; }

/* ===========================
   Footer
=========================== */
footer{
  background: linear-gradient(90deg, #2563EB, #9333EA);
  box-shadow: inset 0 2px 6px rgba(0,0,0,.4);
  color:#F0F4FF; text-align:center; padding:1rem 0; font-weight:600; letter-spacing:.1em;
}

/* ===========================
   Responsive
=========================== */
@media (max-width: 991px){
  .hero-left .hero-title{ font-size:3.2rem; white-space:normal; }
}
@media (max-width: 767px){
  .home-flex{ flex-direction:column; }
  nav ul{ flex-direction:column; gap:1rem; }
  .info-links{ font-size:1.3rem; justify-content:center; gap:1.5rem; }
  .event-info p{ font-size:1.1rem; }
  #countdown{ font-size:1.1rem; }
  #countdown div{ min-width:50px; padding:.5rem .7rem; }
  .partners{ justify-content:center; }
  .tracks{ flex-direction:column; overflow-x:visible; }
  .hero-right .banner{ max-width: 420px; }
}