:root {

  --bg: #070710;
  --bg-light: #10101d;

  --text: #ffffff;
  --text-light: #b8b8c5;

  --primary: #7c5cff;
  --secondary: #00d4ff;

}

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

html{
  scroll-behavior:smooth;
}

body{

  font-family:'Space Grotesk',sans-serif;

  background: var(--bg);
  color: var(--text);

  overflow-x:hidden;
}

/* NAV */


.logo{

  font-size:30px;
  font-weight:700;

  color:white;
}

.logo span{
  color:var(--secondary);
}

nav{

  position:fixed;
  top:10px;
  left:50%;

  transform:translateX(-50%);

  width:95%;
  max-width:1300px;

  display:flex;
  justify-content:space-between;
  align-items:center;

  padding:18px 30px;

  z-index:1000;

  border-radius:24px;

  background:
  rgba(10,10,20,0.45);

  backdrop-filter:blur(16px);

  border:
  1px solid rgba(255,255,255,0.08);

  transition:0.4s;
}


.nav-links{

  display:flex;
  gap:30px;
}

.nav-links a{

  color:white;
  text-decoration:none;

  transition:0.3s;
}

.nav-links a:hover{
  color:var(--secondary);
}

/* =========================
   BURGER
========================= */

.burger{

  display:none;

  flex-direction:column;

  gap:6px;

  cursor:pointer;
}

.burger span{

  width:28px;
  height:3px;

  border-radius:10px;

  background:white;

  transition:0.4s;
}

.burger.active span:nth-child(1){

  transform:
  rotate(45deg)
  translate(7px, 7px);

}

.burger.active span:nth-child(2){

  opacity:0;

}

.burger.active span:nth-child(3){

  transform:
  rotate(-45deg)
  translate(7px, -7px);

}

/* MOBILE */

@media(max-width:768px){

  .burger{

    display:flex;
  }

  .nav-links{

  display:flex;

  position:absolute;

  top:100%;
  left:0;

  width:100%;

  padding:30px;

  border-radius:24px;

  flex-direction:column;

  gap:24px;

  background:
  rgba(10,10,20,0.96);

  backdrop-filter:blur(20px);

  border:
  1px solid rgba(255,255,255,0.08);

  opacity:0;
  visibility:hidden;

  pointer-events:none;

  transform:translateY(-20px);

  transition:0.4s;
}

.nav-links.active{

  opacity:1;
  visibility:visible;

  pointer-events:auto;

  transform:translateY(0);
}

}

/* HERO */

header{

  min-height:100vh;

  display:flex;
  justify-content:center;
  align-items:center;

  position:relative;

  overflow:hidden;

  padding:120px 5vw;

  background:
  radial-gradient(circle at top left,
  rgba(124,92,255,0.25),
  transparent 35%),

  radial-gradient(circle at bottom right,
  rgba(0,212,255,0.2),
  transparent 35%),

  #070710;
}

.hero-overlay{

  position:absolute;
  inset:0;

  background:
  linear-gradient(
    rgba(0,0,0,0.2),
    rgba(0,0,0,0.6)
  );
}

.hero-content{

  position:relative;
  z-index:2;

  max-width:900px;

  text-align:center;
}

.hero-tag{

  color:var(--secondary);

  letter-spacing:4px;

  margin-bottom:20px;

  font-size:14px;
}

h1{

  font-size:clamp(60px,10vw,140px);

  line-height:0.95;

  margin-bottom:30px;
}

.hero-text{

  max-width:700px;

  margin:auto;

  line-height:1.8;

  color:var(--text-light);

  font-size:18px;
}

.hero-buttons{

  display:flex;
  justify-content:center;
  gap:20px;

  flex-wrap:wrap;

  margin-top:40px;
}

.btn{

  padding:16px 32px;

  border-radius:50px;

  text-decoration:none;

  color:white;
  font-weight:600;

  transition:0.3s;

  background:linear-gradient(
    135deg,
    var(--primary),
    var(--secondary)
  );
}

.btn:hover{

  transform:translateY(-5px);

  box-shadow:
  0 10px 30px rgba(124,92,255,0.35);
}

.secondary-btn{

  background:transparent;

  border:1px solid rgba(255,255,255,0.15);
}

.hero-info{

  margin-top:60px;

  display:flex;
  justify-content:center;
  gap:60px;

  flex-wrap:wrap;
}

.hero-info div{

  background:rgba(255,255,255,0.04);

  border:1px solid rgba(255,255,255,0.08);

  padding:20px 28px;

  border-radius:20px;

  min-width:220px;
}

.hero-info span{

  display:block;

  color:var(--text-light);

  margin-bottom:10px;
}

/* MOBILE */




/* ABOUT */

.about-section{

  padding:120px 5vw;
}

.about-grid{

  max-width:1400px;
  margin:auto;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:70px;

  align-items:center;
}

.section-tag{

  color:var(--secondary);

  letter-spacing:4px;

  margin-bottom:20px;

  font-size:14px;
}

.about-text h2{

  font-size:clamp(36px,5vw,64px);

  line-height:1.1;

  margin-bottom:30px;
}

.about-text p{

  color:var(--text-light);

  line-height:1.9;

  margin-bottom:20px;

  font-size:17px;
}

.stats-grid{

  display:grid;
  grid-template-columns:repeat(2,1fr);

  gap:25px;
}

.stat-card{

  padding:40px 30px;

  border-radius:30px;

  background:rgba(255,255,255,0.03);

  border:1px solid rgba(255,255,255,0.08);

  backdrop-filter:blur(10px);

  transition:0.4s;
}

.stat-card:hover{

  transform:translateY(-8px);

  border-color:rgba(0,212,255,0.4);

  box-shadow:
  0 15px 40px rgba(0,212,255,0.12);
}

.stat-card h3{

  font-size:48px;

  margin-bottom:10px;

  background:linear-gradient(
    135deg,
    var(--secondary),
    var(--primary)
  );

  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.stat-card span{

  color:var(--text-light);

  font-size:16px;
}

/* MOBILE */

@media(max-width:900px){

  .about-grid{

    grid-template-columns:1fr;
  }

}

@media(max-width:600px){

  .stats-grid{

    grid-template-columns:1fr;
  }

}


/* SPEAKERS */

.speakers-section{

  padding:120px 5vw;
}

.section-heading{

  text-align:center;

  margin-bottom:70px;
}

.section-heading h2{

  font-size:clamp(36px,5vw,64px);

  margin-top:20px;
}

.speakers-grid{

  max-width:1400px;
  margin:auto;

  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:30px;
}

.speaker-card{

  position:relative;

  overflow:hidden;

  border-radius:30px;

  background:rgba(255,255,255,0.03);

  border:1px solid rgba(255,255,255,0.08);

  transition:0.4s;
}

.speaker-card:hover{

  transform:translateY(-10px);

  border-color:rgba(124,92,255,0.5);

  box-shadow:
  0 20px 50px rgba(124,92,255,0.15);
}

.speaker-card img{

  width:100%;
  height:420px;

  object-fit:cover;
  object-position:center;
}

.speaker-content{

  padding:30px;
}

.speaker-content h3{

  font-size:28px;

  margin-bottom:10px;
}

.speaker-content span{

  display:inline-block;

  color:var(--secondary);

  margin-bottom:20px;

  font-weight:600;
}

.speaker-content p{

  color:var(--text-light);

  line-height:1.8;
}

/* MOBILE */

@media(max-width:1000px){

  .speakers-grid{

    grid-template-columns:1fr;
  }

}

/* =========================
   SCHEDULE
========================= */

.schedule-section{

  padding:120px 5vw;
}

.timeline{

  max-width:1000px;
  margin:80px auto 0;

  display:flex;
  flex-direction:column;
  gap:30px;
}

.timeline-item{

  display:grid;
  grid-template-columns:160px 1fr;

  gap:30px;

  align-items:start;

  padding:35px;

  border-radius:30px;

  background:rgba(255,255,255,0.03);

  border:1px solid rgba(255,255,255,0.08);

  transition:0.4s;
}

.timeline-item:hover{

  transform:translateY(-6px);

  border-color:rgba(0,212,255,0.35);

  box-shadow:
  0 15px 40px rgba(0,212,255,0.12);
}

.timeline-time{

  font-size:42px;
  font-weight:700;

  color:var(--secondary);
}

.timeline-content h3{

  font-size:28px;

  margin-bottom:15px;
}

.timeline-content p{

  color:var(--text-light);

  line-height:1.8;
}

/* MOBILE */

@media(max-width:768px){

  .timeline-item{

    grid-template-columns:1fr;

    gap:20px;
  }

  .timeline-time{

    font-size:34px;
  }

}


/* =========================
   TICKETS
========================= */

.tickets-section{

  padding:120px 5vw;
}

.tickets-grid{

  max-width:1400px;
  margin:80px auto 0;

  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:30px;
}

.ticket-card{

  position:relative;

  padding:50px 40px;

  border-radius:32px;

  background:rgba(255,255,255,0.03);

  border:1px solid rgba(255,255,255,0.08);

  transition:0.4s;
}

.ticket-card:hover{

  transform:translateY(-10px);

  border-color:rgba(124,92,255,0.45);

  box-shadow:
  0 20px 50px rgba(124,92,255,0.15);
}

.ticket-label{

  color:var(--secondary);

  letter-spacing:3px;

  font-size:14px;
}

.ticket-card h3{

  font-size:58px;

  margin:20px 0;
}

.ticket-desc{

  color:var(--text-light);

  line-height:1.8;

  margin-bottom:30px;
}

.ticket-card ul{

  list-style:none;

  margin-bottom:40px;
}

.ticket-card ul li{

  display:flex;
  align-items:center;

  gap:12px;

  margin-bottom:18px;

  color:var(--text-light);
}

.ticket-card ul i{

  color:var(--secondary);
}

.featured-ticket{

  border:1px solid rgba(0,212,255,0.5);

  transform:scale(1.04);
}

.featured-ticket:hover{

  transform:scale(1.04) translateY(-10px);
}

.featured-badge{

  position:absolute;

  top:-14px;
  right:30px;

  padding:8px 18px;

  border-radius:50px;

  background:linear-gradient(
    135deg,
    var(--primary),
    var(--secondary)
  );

  font-size:12px;
  font-weight:700;

  letter-spacing:2px;
}

/* MOBILE */

@media(max-width:1000px){

  .tickets-grid{

    grid-template-columns:1fr;
  }

  .featured-ticket{

    transform:none;
  }

  .featured-ticket:hover{

    transform:translateY(-10px);
  }

}


/* =========================
   FAQ
========================= */

.faq-section{

  padding:120px 5vw;
}

.faq-container{

  max-width:900px;
  margin:80px auto 0;

  display:flex;
  flex-direction:column;
  gap:20px;
}

.faq-item{

  border-radius:24px;

  overflow:hidden;

  background:rgba(255,255,255,0.03);

  border:1px solid rgba(255,255,255,0.08);
}

.faq-question{

  width:100%;

  display:flex;
  justify-content:space-between;
  align-items:center;

  padding:28px 30px;

  background:none;
  border:none;

  color:white;

  font-size:18px;
  font-family:'Space Grotesk',sans-serif;

  cursor:pointer;
}

.faq-question span{

  font-size:28px;

  color:var(--secondary);

  transition:0.3s;
}

.faq-answer{

  max-height:0;

  overflow:hidden;

  transition:0.4s ease;
}

.faq-answer p{

  padding:0 30px 30px;

  color:var(--text-light);

  line-height:1.8;
}

.faq-item.active .faq-answer{

  max-height:300px;
}

.faq-item.active .faq-question span{

  transform:rotate(45deg);
}


/* =========================
   COUNTDOWN
========================= */

.countdown{

  display:flex;
  justify-content:center;
  gap:20px;

  flex-wrap:wrap;

  margin-top:60px;
}

.countdown-box{

  min-width:120px;

  padding:25px 20px;

  border-radius:24px;

  background:rgba(255,255,255,0.04);

  border:1px solid rgba(255,255,255,0.08);

  backdrop-filter:blur(10px);

  text-align:center;

  transition:0.4s;
}

.countdown-box:hover{

  transform:translateY(-6px);

  border-color:rgba(0,212,255,0.4);

  box-shadow:
  0 15px 40px rgba(0,212,255,0.12);
}

.countdown-box span{

  display:block;

  font-size:48px;
  font-weight:700;

  margin-bottom:10px;

  background:linear-gradient(
    135deg,
    var(--secondary),
    var(--primary)
  );

  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.countdown-box small{

  color:var(--text-light);

  letter-spacing:2px;

  text-transform:uppercase;
}

/* MOBILE */

@media(max-width:768px){

  .countdown{

    gap:15px;
  }

  .countdown-box{

    min-width:140px;
  }

}


/* =========================
   CTA SECTION
========================= */

.cta-section{

  padding:120px 5vw 140px;
}

.cta-box{

  max-width:1000px;
  margin:auto;

  padding:80px 50px;

  border-radius:40px;

  text-align:center;

  position:relative;

  overflow:hidden;

  background:
  linear-gradient(
    135deg,
    rgba(124,92,255,0.18),
    rgba(0,212,255,0.12)
  );

  border:1px solid rgba(255,255,255,0.08);

  backdrop-filter:blur(14px);
}

.cta-box::before{

  content:"";

  position:absolute;

  width:500px;
  height:500px;

  background:
  radial-gradient(
    circle,
    rgba(124,92,255,0.25),
    transparent 70%
  );

  top:-200px;
  left:-150px;
}

.cta-box::after{

  content:"";

  position:absolute;

  width:400px;
  height:400px;

  background:
  radial-gradient(
    circle,
    rgba(0,212,255,0.2),
    transparent 70%
  );

  bottom:-180px;
  right:-120px;
}

.cta-box h2{

  position:relative;
  z-index:2;

  font-size:clamp(40px,6vw,72px);

  line-height:1.1;

  margin:20px 0 30px;
}

.cta-box p{

  position:relative;
  z-index:2;

  max-width:700px;
  margin:auto;

  color:var(--text-light);

  line-height:1.9;

  margin-bottom:40px;

  font-size:18px;
}

.cta-box .btn{

  position:relative;
  z-index:2;
}


/* =========================
   FOOTER
========================= */

footer{

  padding:100px 5vw 40px;

  border-top:
  1px solid rgba(255,255,255,0.08);

  background:#05050c;
}

.footer-grid{

  max-width:1400px;
  margin:auto;

  display:grid;
  grid-template-columns:
  repeat(auto-fit,minmax(220px,1fr));

  gap:60px;
}

.footer-logo{

  font-size:34px;
  font-weight:700;

  margin-bottom:25px;
}

.footer-logo span{

  color:var(--secondary);
}

footer h3{

  margin-bottom:25px;

  font-size:22px;
}

footer p,
footer a{

  color:var(--text-light);

  line-height:1.9;

  text-decoration:none;

  display:block;

  margin-bottom:12px;

  transition:0.3s;
}

footer a:hover{

  color:var(--secondary);
}

.socials{

  display:flex;
  gap:15px;
}

.socials a{

  width:50px;
  height:50px;

  display:flex;
  justify-content:center;
  align-items:center;

  border-radius:50%;

  background:rgba(255,255,255,0.04);

  border:1px solid rgba(255,255,255,0.08);

  font-size:20px;
}

.socials a:hover{

  transform:translateY(-5px);

  border-color:rgba(0,212,255,0.4);

  box-shadow:
  0 10px 30px rgba(0,212,255,0.15);
}

.footer-bottom{

  margin-top:80px;
  padding-top:30px;

  text-align:center;

  border-top:
  1px solid rgba(255,255,255,0.05);
}


/* =========================
   REVEAL ANIMATION
========================= */

.reveal{

  opacity:0;

  transform:translateY(70px);

  transition:
  opacity 1s ease,
  transform 1s ease;
}

.reveal.active{

  opacity:1;

  transform:translateY(0);
}


/* =========================
   PARTNERS
========================= */

.partners-section{

  padding:120px 5vw;
}

.partners-grid{

  max-width:1200px;
  margin:80px auto 0;

  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:30px;
}

.partner-card{

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;

  gap:20px;

  padding:50px 30px;

  border-radius:30px;

  background:rgba(255,255,255,0.03);

  border:1px solid rgba(255,255,255,0.08);

  transition:0.4s;
}

.partner-card:hover{

  transform:translateY(-8px);

  border-color:rgba(0,212,255,0.35);

  box-shadow:
  0 15px 40px rgba(0,212,255,0.12);
}

.partner-card i{

  font-size:54px;

  color:var(--secondary);
}

.partner-card span{

  font-size:20px;
  font-weight:600;
}

/* MOBILE */

@media(max-width:900px){

  .partners-grid{

    grid-template-columns:repeat(2,1fr);
  }

}

@media(max-width:600px){

  .partners-grid{

    grid-template-columns:1fr;
  }

}


/* =========================
   BACKGROUND GLOW
========================= */

.background-glow{

  position:fixed;

  inset:0;

  z-index:-1;

  overflow:hidden;
}

.background-glow::before,
.background-glow::after{

  content:"";

  position:absolute;

  width:600px;
  height:600px;

  border-radius:50%;

  filter:blur(120px);

  opacity:0.25;

  animation:
  floatGlow 12s ease-in-out infinite;
}

.background-glow::before{

  background:#7c5cff;

  top:-200px;
  left:-150px;
}

.background-glow::after{

  background:#00d4ff;

  bottom:-200px;
  right:-150px;

  animation-delay:6s;
}

@keyframes floatGlow{

  0%{
    transform:translateY(0) scale(1);
  }

  50%{
    transform:translateY(40px) scale(1.1);
  }

  100%{
    transform:translateY(0) scale(1);
  }

}


/* =========================
   NAV SCROLLED
========================= */

nav.scrolled{

  background:
  rgba(5,5,15,0.85);

  border:
  1px solid rgba(0,212,255,0.25);

  box-shadow:
  0 10px 40px rgba(0,0,0,0.35);
}


/* =========================
   CONTACT
========================= */

.contact-section{

  padding:120px 5vw;
}

.contact-wrapper{

  max-width:1300px;
  margin:80px auto 0;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:40px;
}

.contact-info{

  display:flex;
  flex-direction:column;

  gap:25px;
}

.contact-card{

  display:flex;
  align-items:center;

  gap:25px;

  padding:35px;

  border-radius:30px;

  background:rgba(255,255,255,0.03);

  border:1px solid rgba(255,255,255,0.08);

  transition:0.4s;
}

.contact-card:hover{

  transform:translateY(-6px);

  border-color:rgba(0,212,255,0.35);

  box-shadow:
  0 15px 40px rgba(0,212,255,0.12);
}

.contact-card i{

  font-size:32px;

  color:var(--secondary);
}

.contact-card h3{

  margin-bottom:8px;

  font-size:22px;
}

.contact-card p{

  color:var(--text-light);
}

.contact-form{

  display:flex;
  flex-direction:column;

  gap:20px;
}

.contact-form input,
.contact-form textarea{

  width:100%;

  padding:22px 24px;

  border:none;

  outline:none;

  border-radius:24px;

  background:rgba(255,255,255,0.04);

  border:1px solid rgba(255,255,255,0.08);

  color:white;

  font-size:16px;

  font-family:'Space Grotesk',sans-serif;

  transition:0.3s;
}

.contact-form input:focus,
.contact-form textarea:focus{

  border-color:rgba(0,212,255,0.45);

  box-shadow:
  0 0 20px rgba(0,212,255,0.15);
}

.contact-form textarea{

  resize:none;
}

.contact-form ::placeholder{

  color:var(--text-light);
}

/* MOBILE */

@media(max-width:900px){

  .contact-wrapper{

    grid-template-columns:1fr;
  }

}



#form-message{

  margin-top:18px;

  font-size:15px;

  font-weight:600;

  opacity:0;

  transition:0.4s;
}

#form-message.show{

  opacity:1;
}

#form-message.success{

  color:#4caf50;
}

#form-message.error{

  color:#ff4d4d;
}