:root{
  --bg:#020318;
  --accent:#7ef0ff;
  --muted:#9fb4d0;
}
*{box-sizing:border-box}

/* Use default system cursor everywhere */
*, *::before, *::after{
  cursor:default !important;
}

/* === SCROLL-TO-TOP BUTTON === */
.scroll-to-top{
  position:fixed;
  bottom:2rem;
  right:2rem;
  width:50px;
  height:50px;
  background:linear-gradient(135deg, rgba(126,240,255,0.15) 0%, rgba(126,240,255,0.08) 100%);
  border:1px solid rgba(126,240,255,0.3);
  border-radius:50%;
  color:#7ef0ff;
  font-size:1.5rem;
  cursor:default;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:999;
  transition:all 0.3s ease;
  backdrop-filter:blur(8px);
  box-shadow:0 4px 16px rgba(126,240,255,0.1);
}

.scroll-to-top.show{
  display:flex;
}

.scroll-to-top:hover{
  background:linear-gradient(135deg, rgba(126,240,255,0.25) 0%, rgba(126,240,255,0.15) 100%);
  border-color:rgba(126,240,255,0.5);
  box-shadow:0 8px 24px rgba(126,240,255,0.25);
  transform:translateY(-3px);
}

.scroll-to-top:active{
  transform:translateY(0);
}

body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  background:linear-gradient(180deg,var(--bg) 0%, #071025 100%);
  color:#e6f5ff;
  -webkit-font-smoothing:antialiased;
  cursor:default;
}

/* === SCANLINE OVERLAY === */
.scanlines{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:9999;
  background:repeating-linear-gradient(
    0deg,
    rgba(0,0,0,0) 0px,
    rgba(0,0,0,0) 1px,
    rgba(126,240,255,0.03) 2px,
    rgba(0,0,0,0) 3px
  );
  opacity:0.3;
}

/* === CUSTOM CURSOR === */
.custom-cursor{
  display:none;
  position:fixed;
  width:20px;
  height:20px;
  border:2px solid #7ef0ff;
  border-radius:50%;
  pointer-events:none;
  z-index:10000;
  transition:transform 0.1s ease;
  box-shadow:
    0 0 10px rgba(126,240,255,0.5),
    inset 0 0 10px rgba(126,240,255,0.3);
  mix-blend-mode:screen;
}

.custom-cursor::before{
  content:'';
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  width:4px;
  height:4px;
  background:#7ef0ff;
  border-radius:50%;
  box-shadow:0 0 5px rgba(126,240,255,0.8);
}

#cursorTrail{
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:9998;
}


.container{max-width:1000px;margin:0 auto;padding:1rem}
.site-header{position:sticky;top:0;background:rgba(2,6,15,0.6);backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,0.03);z-index:20}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem}
.logo{font-weight:700;letter-spacing:2px}

.logo-link{
  display:inline-flex;
  align-items:center;
  gap:0.6rem;
  color:inherit;
  text-decoration:none;
}

.logo-icon-wrap{
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:50%;
}

.logo-img{
  height:clamp(22px, 3vw, 30px);
  width:auto;
  display:block;
  transform:scale(1.4);
  transform-origin:center;
}
.nav a{
  color:var(--muted);
  margin-left:1rem;
  text-decoration:none;
  position:relative;
  transition:color 0.3s ease;
  font-family:'JetBrains Mono', monospace;
  letter-spacing:0.5px;
}

.nav a::before{
  content:attr(data-cyber);
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  color:#7ef0ff;
  text-shadow:
    0 0 10px rgba(126,240,255,0.6),
    2px 0 2px rgba(255,0,255,0.4),
    -2px 0 2px rgba(0,255,255,0.4);
  transition:opacity 0.3s ease;
  pointer-events:none;
  white-space:nowrap;
}

.nav a:hover{
  color:#7ef0ff;
  text-shadow:0 0 8px rgba(126,240,255,0.4);
}

@keyframes glitch{
  0%{
    transform:translate(0);
    text-shadow:
      0 0 10px rgba(126,240,255,0.6),
      1px 0 1px rgba(255,0,255,0.3),
      -1px 0 1px rgba(0,255,255,0.3);
  }
  20%{
    transform:translate(-1px, 0.5px);
    text-shadow:
      0 0 12px rgba(126,240,255,0.7),
      1.5px 0 1.5px rgba(255,0,255,0.4),
      -1.5px 0 1.5px rgba(0,255,255,0.4);
  }
  40%{
    transform:translate(1px, -0.5px);
    text-shadow:
      0 0 10px rgba(126,240,255,0.6),
      -1px 0 1px rgba(255,0,255,0.3),
      1px 0 1px rgba(0,255,255,0.3);
  }
  60%{
    transform:translate(-0.5px, 1px);
  }
  80%{
    transform:translate(0.5px, -1px);
  }
  100%{
    transform:translate(0);
  }
}

.menu-toggle{display:none;background:none;border:0;color:var(--muted);font-size:1.25rem}
.hero{position:relative;height:700px;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-image{width:100%;height:100%;object-fit:cover;object-position:100% 100px;top:0;bottom:0;display:block;filter:contrast(1.02) saturate(1.05);transition:filter 0.6s ease}
.hero:hover .hero-image{filter:contrast(1.15) saturate(1.1) brightness(0.9)}

.hero-content{
  position:absolute;
  text-align:center;
  z-index:10;
  padding:clamp(1.5rem, 5vw, 3rem);
  width:auto;
  max-width:90%;
  top:68%;
  left:50%;
  transform:translate(-50%, -50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:linear-gradient(
    135deg,
    rgba(2,3,24,0.4) 0%,
    rgba(2,3,24,0.6) 50%,
    rgba(2,3,24,0.4) 100%
  );
  backdrop-filter:blur(8px);
  border:1px solid rgba(126,240,255,0.15);
  border-radius:2px;
  transition:all 0.4s ease;
  overflow:visible;
}

.hero-content::before{
  content:'';
  position:absolute;
  inset:-1px;
  background:linear-gradient(45deg, rgba(126,240,255,0.3), transparent, rgba(126,240,255,0.2));
  border-radius:2px;
  opacity:0;
  transition:opacity 0.4s ease;
  pointer-events:none;
  z-index:-1;
}

.hero-content::after{
  content:'';
  position:absolute;
  top:-2px;
  left:50%;
  transform:translateX(-50%);
  width:60%;
  height:2px;
  background:linear-gradient(90deg, transparent, #7ef0ff, transparent);
  opacity:0;
  transition:opacity 0.4s ease;
}

.hero-content:hover{
  background:linear-gradient(
    135deg,
    rgba(2,3,24,0.7) 0%,
    rgba(2,3,24,0.8) 50%,
    rgba(2,3,24,0.7) 100%
  );
  border-color:rgba(126,240,255,0.4);
  box-shadow:
    0 0 30px rgba(126,240,255,0.25),
    inset 0 0 30px rgba(126,240,255,0.08);
}

.hero-content:hover::before{
  opacity:1;
}

.hero-content:hover::after{
  opacity:1;
}

.band{
  font-size:clamp(2.5rem, 8vw, 4rem);
  letter-spacing:clamp(2px, 1vw, 8px);
  color:#fff;
  margin:0;
  text-shadow:
    0 0 25px rgba(126,240,255,0.35),
    0 0 55px rgba(126,240,255,0.2);
  transition: text-shadow 0.4s ease, transform 0.3s ease, letter-spacing 0.4s ease;
  background:transparent;
  text-transform:uppercase;
  font-family:'JetBrains Mono', monospace;
}

.band:hover{
  text-shadow:
    0 0 35px rgba(126,240,255,0.6),
    0 0 70px rgba(126,240,255,0.35);
  letter-spacing:clamp(4px, 2vw, 10px);
}

.tag{
  color:#7ef0ff;
  font-size:clamp(0.85rem, 2.5vw, 1.3rem);
  margin:clamp(0.75rem, 3vw, 1.5rem) 0 0 0;
  text-shadow:
    0 0 10px rgba(126,240,255,0.7),
    0 0 20px rgba(255,140,0,0.4);
  transition: all 0.4s ease;
  letter-spacing:2px;
  text-transform:uppercase;
  font-weight:500;
  font-family:'JetBrains Mono', monospace;
}

.tag:hover{
  text-shadow:
    0 0 15px rgba(126,240,255,1),
    0 0 30px rgba(255,140,0,0.6);
  letter-spacing:3px;
}
.btn{display:inline-block;padding:.6rem 1rem;background:var(--accent);color:#021;border-radius:8px;text-decoration:none;font-weight:600}
.section{padding:3vh 0}

/* Section heading styles with cyber hover */
.section h3{
  position:relative;
  cursor:default;
  transition:color 0.3s ease;
  font-family:'JetBrains Mono', monospace;
  font-size:clamp(2rem, 3vw, 2.8rem);
  margin:0 0 clamp(1.5rem, 3vw, 2rem) 0;
  letter-spacing:1px;
  color:#fff;
  text-transform:uppercase;
  font-weight:700;
}

.section h3::before{
  content:attr(data-cyber);
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  color:#7ef0ff;
  text-shadow:
    0 0 15px rgba(126,240,255,0.7),
    2px 0 3px rgba(255,0,255,0.5),
    -2px 0 3px rgba(0,255,255,0.5);
  transition:opacity 0.3s ease;
  white-space:nowrap;
}

.section h3:hover::before{
  opacity:1;
  animation:glitch 0.3s infinite;
}

.section h3:hover{
  color:transparent;
}

/* === ABOUT SECTION REDESIGN === */
.about-section{
  padding:0;
  overflow:hidden;
  background:#020318;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100vh;
}

.about-container{
  position:relative;
  width:100%;
  height:100%;
  max-height:90vh;
  display:flex;
  align-items:center;
  justify-content:center;
}

.about-image{
  position:relative;
  width:100%;
  height:auto;
  max-height:90vh;
  object-fit:contain;
  z-index:1;
  filter:brightness(0.7) contrast(1.1);
  transition:transform 0.3s ease-out;
  will-change:transform;
}

.about-overlay{
  position:absolute;
  top:0;
  left:0;
  z-index:2;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(2rem, 8vw, 4rem);
}

.about-left,
.about-right{
  display:flex;
  flex-direction:column;
  transition:all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), transform 0.3s ease-out;
  will-change:transform;
}

.about-left{
  max-width:25%;
  padding:clamp(1.5rem, 4vw, 2.5rem);
  margin-right:clamp(2rem, 6vw, 5rem);
  position:relative;
  overflow:hidden;
}

.about-left::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(126,240,255,0.1), transparent);
  transition:left 0.3s ease;
  pointer-events:none;
}

.about-left:hover::before{
  left:100%;
}

.about-right{
  max-width:45%;
  padding:clamp(1.5rem, 4vw, 2.5rem);
  margin-left:clamp(4rem, 10vw, 9rem);
  position:relative;
  overflow:hidden;
}

.about-right::after{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(126,240,255,0.1), transparent);
  transition:left 0.3s ease;
  pointer-events:none;
}

.about-right:hover::after{
  left:100%;
}

.about-left h3{
  font-size:clamp(2rem, 3vw, 2.8rem);
  margin:0 0 clamp(1rem, 2.5vw, 1.5rem) 0;
  letter-spacing:1px;
  color:#fff;
  text-transform:uppercase;
  font-weight:700;
  opacity:0.9;
  transition:opacity 0.3s ease, color 0.3s ease;
  position:relative;
  cursor:default;
  font-family:'JetBrains Mono', monospace;
  font-weight:600;
}

.about-left h3::after{
  content:attr(data-cyber);
  display:block;
  font-size:clamp(0.75rem, 1.2vw, 0.95rem);
  color:#7ef0ff;
  opacity:0;
  margin-top:0.5rem;
  letter-spacing:0.5px;
  font-weight:500;
  text-shadow:0 0 10px rgba(126,240,255,0.4);
  transition:opacity 0.3s ease;
}

.about-left h3:hover::after{
  opacity:1;
}
.about-left p{
  font-size:clamp(0.9rem, 1.3vw, 1rem);
  line-height:1.8;
  color:rgba(230,245,255,0.7);
  margin:0;
  opacity:0.8;
  transition:opacity 0.4s ease;
}

.about-right h4{
  font-size:clamp(2rem, 3vw, 2.8rem);
  margin:0 0 clamp(1rem, 2.5vw, 1.5rem) 0;
  letter-spacing:1px;
  color:#fff;
  text-transform:uppercase;
  font-weight:700;
  opacity:0.9;
  transition:opacity 0.4s ease;
  position:relative;
  cursor:default;
  font-family:'JetBrains Mono', monospace;
  font-weight:600;
}

.about-right h4::after{
  content:attr(data-cyber);
  display:block;
  font-size:clamp(0.75rem, 1.2vw, 0.95rem);
  color:#7ef0ff;
  opacity:0;
  margin-top:0.5rem;
  letter-spacing:0.5px;
  font-weight:500;
  text-shadow:0 0 10px rgba(126,240,255,0.4);
  transition:opacity 0.3s ease;
}

.about-right h4:hover::after{
  opacity:1;
}

.lineup{
  list-style:none;
  padding:0;
  margin:0;
  position:relative;
  overflow:hidden;
}

.lineup::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(126,240,255,0.1), transparent);
  transition:left 0.3s ease;
  pointer-events:none;
  z-index:0;
}

.lineup:hover::before{
  left:100%;
}

.lineup li{
  font-size:clamp(0.9rem, 1.3vw, 1rem);
  line-height:2.2;
  color:rgba(230,245,255,0.7);
  margin:0;
  opacity:0.8;
  transition:opacity 0.4s ease;
}

.lineup li strong{
  color:#7ef0ff;
  font-weight:600;
  letter-spacing:0.5px;
}

.lineup li strong a,
.lineup li strong a:visited,
.lineup li strong a:hover,
.lineup li strong a:active{
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
  text-decoration:none;
}

.lineup li strong a{
  display:inline-block;
  transition:transform 0.2s ease, text-shadow 0.2s ease, opacity 0.2s ease;
}

.lineup li strong a:hover,
.lineup li strong a:focus-visible{
  transform:translateY(-1px);
  text-shadow:0 0 8px rgba(126,240,255,0.45);
  opacity:1;
}

.lineup li::before{
  content:'◆ ';
  color:rgba(126,240,255,0.4);
  margin-right:0.5rem;
  opacity:0;
  transition:opacity 0.4s ease;
}

/* Hover States */
.about-left:hover,
.about-right:hover{
  background:
    radial-gradient(120% 120% at 15% 0%, rgba(120,200,255,0.12) 0%, transparent 58%),
    linear-gradient(165deg, rgba(6,10,28,0.82) 0%, rgba(6,10,28,0.62) 48%, rgba(6,10,28,0.38) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(120,200,255,0.14),
    0 8px 24px rgba(4,8,20,0.32),
    0 0 16px rgba(120,200,255,0.12);
  filter:drop-shadow(0 0 10px rgba(120,200,255,0.16));
}

.about-left:hover h3,
.about-right:hover h4{
  color:#e1f6ff;
  opacity:1;
  text-shadow:
    0 0 8px rgba(120,200,255,0.3),
    0 0 16px rgba(120,200,255,0.18);
}

.about-left:hover p,
.about-right:hover li{
  color:#f4fbff;
  opacity:1;
}

.about-right:hover li::before{
  opacity:1;
  color:rgba(120,200,255,0.5);
}

/* === END ABOUT SECTION === */

/* === MUSIC/LATEST SECTION === */
.music-section{
  padding:4rem 0;
  background:linear-gradient(180deg, rgba(2,3,24,0) 0%, rgba(6,10,28,0.4) 50%, rgba(2,3,24,0) 100%);
  border-top:1px solid rgba(126,240,255,0.1);
  border-bottom:1px solid rgba(126,240,255,0.1);
  position:relative;
}

.music-section::before{
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:80%;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(126,240,255,0.3), transparent);
}

.music-header{
  text-align:center;
  margin-bottom:3rem;
  position:relative;
}

.music-accent-line{
  width:60px;
  height:2px;
  background:linear-gradient(90deg, transparent, #7ef0ff, transparent);
  margin:0 auto 1.5rem;
  animation:pulse 3s ease-in-out infinite;
  transition:width 0.3s ease-out;
  will-change:width;
}

.music-icon{
  font-size:2.5rem;
  color:#7ef0ff;
  margin-bottom:1rem;
  text-shadow:0 0 20px rgba(126,240,255,0.5);
  animation:float 4s ease-in-out infinite;
  transition:transform 0.3s ease-out;
  will-change:transform;
}

.music-title{
  font-size:2.5rem;
  margin:0 0 0.5rem 0;
  letter-spacing:2px;
  color:#fff;
  text-transform:uppercase;
  font-weight:700;
  position:relative;
  cursor:default;
  transition:color 0.3s ease;
  font-family:'JetBrains Mono', monospace;
}

.music-title::before{
  content:attr(data-cyber);
  position:absolute;
  top:0;
  left:0;
  right:0;
  text-align:center;
  opacity:0;
  color:#7ef0ff;
  text-shadow:
    0 0 15px rgba(126,240,255,0.7),
    2px 0 3px rgba(255,0,255,0.5),
    -2px 0 3px rgba(0,255,255,0.5);
  transition:opacity 0.3s ease;
  white-space:nowrap;
}

.music-title:hover::before{
  opacity:1;
  animation:glitch 0.3s infinite;
}

.music-title:hover{
  color:transparent;
}

.music-subtitle{
  font-size:1.3rem;
  color:#7ef0ff;
  margin:0 0 1rem 0;
  font-weight:500;
  letter-spacing:1px;
  text-shadow:0 0 10px rgba(126,240,255,0.3);
}

.music-description{
  font-size:0.95rem;
  color:rgba(230,245,255,0.7);
  margin:1rem auto 0;
  max-width:500px;
  line-height:1.6;
}

.embed{
  max-width:600px;
  margin:2rem auto;
  padding:1.5rem;
  background:linear-gradient(135deg, rgba(6,10,28,0.5) 0%, rgba(6,10,28,0.3) 100%);
  border:1px solid rgba(126,240,255,0.2);
  border-radius:8px;
  backdrop-filter:blur(8px);
  box-shadow:
    0 8px 32px rgba(0,0,0,0.3),
    inset 0 0 30px rgba(126,240,255,0.05);
  transition:all 0.4s ease;
}

.embed:hover{
  border-color:rgba(126,240,255,0.35);
  box-shadow:
    0 12px 40px rgba(126,240,255,0.15),
    inset 0 0 40px rgba(126,240,255,0.08);
}

.embed iframe{
  min-height:80px;
  border:0;
  border-radius:4px;
}

@keyframes pulse{
  0%, 100%{
    opacity:0.6;
    width:60px;
  }
  50%{
    opacity:1;
    width:80px;
  }
}

@keyframes float{
  0%, 100%{
    transform:translateY(0px);
  }
  50%{
    transform:translateY(-10px);
  }
}

/* === END MUSIC SECTION === */

/* === CONTACT SECTION === */
#contactForm{
  max-width:600px;
  margin:0 auto;
}

input,
textarea{
  width:100%;
  padding:0.9rem 1rem;
  border-radius:6px;
  border:1px solid rgba(126,240,255,0.15);
  background:linear-gradient(135deg, rgba(6,10,28,0.4) 0%, rgba(6,10,28,0.2) 100%);
  color:inherit;
  margin:0.6rem 0;
  font-family:inherit;
  transition:all 0.3s ease;
  backdrop-filter:blur(4px);
}

input::placeholder,
textarea::placeholder{
  color:rgba(159,180,208,0.5);
  transition:color 0.3s ease;
}

input:focus,
textarea:focus{
  outline:none;
  border-color:rgba(126,240,255,0.4);
  background:linear-gradient(135deg, rgba(6,10,28,0.6) 0%, rgba(6,10,28,0.4) 100%);
  box-shadow:
    0 0 20px rgba(126,240,255,0.15),
    inset 0 0 15px rgba(126,240,255,0.05);
}

input:focus::placeholder,
textarea:focus::placeholder{
  color:rgba(159,180,208,0.7);
}

textarea{
  min-height:150px;
  resize:vertical;
}

.btn{
  display:inline-block;
  padding:0.8rem 2rem;
  background:linear-gradient(135deg, rgba(126,240,255,0.2) 0%, rgba(126,240,255,0.1) 100%);
  color:#7ef0ff;
  border:1px solid rgba(126,240,255,0.3);
  border-radius:6px;
  text-decoration:none;
  font-weight:600;
  cursor:default;
  transition:all 0.3s ease;
  text-transform:uppercase;
  letter-spacing:1px;
  font-size:0.9rem;
  margin-top:0.5rem;
  position:relative;
  overflow:hidden;
}

.btn::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(126,240,255,0.3) 0%, rgba(126,240,255,0.15) 100%);
  opacity:0;
  transition:opacity 0.3s ease;
}

.btn:hover{
  background:linear-gradient(135deg, rgba(126,240,255,0.25) 0%, rgba(126,240,255,0.15) 100%);
  border-color:rgba(126,240,255,0.5);
  box-shadow:
    0 0 25px rgba(126,240,255,0.3),
    inset 0 0 20px rgba(126,240,255,0.1);
  transform:translateY(-2px);
  color:#a8f7ff;
}

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

.btn:active{
  transform:translateY(0);
}

/* Form Validation Styling */
.form-error{
  color:#ff6b6b;
  font-size:0.85rem;
  margin-top:0.5rem;
  text-shadow:0 0 5px rgba(255,107,107,0.3);
  display:none;
  min-height:1.2rem;
}

.form-error.show{
  display:block;
}

#contactForm input:invalid,
#contactForm textarea:invalid{
  border-color:rgba(255,107,107,0.4) !important;
  background:linear-gradient(135deg, rgba(255,107,107,0.08) 0%, rgba(255,107,107,0.03) 100%) !important;
}

#contactForm input:valid,
#contactForm textarea:valid{
  border-color:rgba(50,255,150,0.3) !important;
}

/* === BOOKING SECTION === */
.booking-section{
  background:linear-gradient(180deg, rgba(7,16,37,0.5) 0%, rgba(2,3,24,0.3) 100%);
  border-top:1px solid rgba(126,240,255,0.15);
  border-bottom:1px solid rgba(126,240,255,0.15);
}

.booking-content{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3rem;
  align-items:start;
}

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

.booking-status{
  font-size:clamp(1.1rem, 3vw, 1.4rem);
  color:#7ef0ff;
  font-weight:600;
  letter-spacing:2px;
  text-shadow:0 0 15px rgba(126,240,255,0.4);
}

.booking-info p{
  color:var(--muted);
  line-height:1.6;
}

.booking-details{
  background:rgba(6,10,28,0.4);
  border:1px solid rgba(126,240,255,0.2);
  border-radius:6px;
  padding:1.5rem;
  backdrop-filter:blur(4px);
}

.booking-details p{
  margin:0.8rem 0;
  font-family:'JetBrains Mono', monospace;
  font-size:0.95rem;
}

.booking-details a{
  color:#7ef0ff;
  text-decoration:none;
  transition:all 0.3s ease;
  border-bottom:1px solid rgba(126,240,255,0.3);
}

.booking-details a:hover{
  color:#a8f7ff;
  border-bottom-color:rgba(126,240,255,0.6);
  text-shadow:0 0 10px rgba(126,240,255,0.3);
}

.booking-card{
  background:linear-gradient(135deg, rgba(7,16,37,0.8), rgba(2,3,24,0.9));
  border:1px solid rgba(126,240,255,0.2);
  border-radius:8px;
  padding:2rem;
  backdrop-filter:blur(10px);
}

.booking-card h4{
  color:#7ef0ff;
  font-size:1.2rem;
  margin:0 0 1.5rem 0;
  text-transform:uppercase;
  letter-spacing:1px;
}

#bookingForm input,
#bookingForm textarea{
  width:100%;
  padding:0.8rem;
  background:rgba(6,10,28,0.5);
  border:1px solid rgba(126,240,255,0.2);
  border-radius:4px;
  color:#fff;
  font-family:'JetBrains Mono', monospace;
  font-size:0.9rem;
  margin-bottom:1rem;
  transition:all 0.3s ease;
}

#bookingForm input:focus,
#bookingForm textarea:focus{
  outline:none;
  border-color:rgba(126,240,255,0.4);
  background:linear-gradient(135deg, rgba(6,10,28,0.6) 0%, rgba(6,10,28,0.4) 100%);
  box-shadow:0 0 20px rgba(126,240,255,0.15);
}

#bookingForm input:invalid,
#bookingForm textarea:invalid{
  border-color:rgba(255,107,107,0.4) !important;
  background:linear-gradient(135deg, rgba(255,107,107,0.08) 0%, rgba(255,107,107,0.03) 100%) !important;
}

#bookingForm input:valid,
#bookingForm textarea:valid{
  border-color:rgba(50,255,150,0.3) !important;
}

#bookingForm button{
  width:100%;
}

/* === END BOOKING SECTION === */

/* === END CONTACT SECTION === */

/* === SHOWS SECTION === */
.shows-list{
  list-style:none;
  padding:0;
  margin:0;
  color:var(--muted);
  font-family:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  background:none;
  border-top:0px solid rgba(126,240,255,0.15);
  border-bottom:0px solid rgba(126,240,255,0.15);
  padding:3rem 0;
}

.shows-list li{
  position:relative;
  overflow:hidden;
  padding:1.2rem 1rem 1.2rem 2.5rem;
  margin:0.75rem 0;
  background:linear-gradient(90deg, rgba(6,10,28,0.3) 0%, rgba(6,10,28,0.1) 100%);
  border:1px solid rgba(126,240,255,0.08);
  border-radius:4px;
  transition:all 0.3s ease, transform 0.2s ease-out;
  backdrop-filter:blur(4px);
  will-change:transform;
}

.shows-list li strong{
  color:#7ef0ff;
  font-weight:600;
  letter-spacing:1px;
  text-shadow:0 0 8px rgba(126,240,255,0.3);
  transition:text-shadow 0.3s ease;
}

.shows-list li::before{
  content:"▸";
  position:absolute;
  left:1rem;
  top:50%;
  transform:translateY(-50%);
  color:rgba(126,240,255,0.4);
  font-size:1rem;
  transition:all 0.3s ease;
}

.shows-list li::after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(to bottom, var(--accent), transparent);
  transform:translateX(-3px);
  opacity:0;
  transition:all 0.3s ease;
}

.shows-list li:hover{
  background:linear-gradient(90deg, rgba(126,240,255,0.08) 0%, rgba(126,240,255,0.03) 100%);
  border-color:rgba(126,240,255,0.2);
  transform:translateX(4px);
  box-shadow:
    0 4px 12px rgba(126,240,255,0.1),
    inset 0 0 20px rgba(126,240,255,0.05);
}

.shows-list li:hover::before{
  color:rgba(126,240,255,0.9);
  left:1.3rem;
}

.shows-list li:hover::after{
  transform:translateX(0);
  opacity:1;
}

.shows-list li:hover strong{
  color:#a8f7ff;
  text-shadow:0 0 12px rgba(126,240,255,0.5);
}

.shows-list li.show-item--past{
  opacity:0.58;
  border-color:rgba(170,190,210,0.16);
  background:linear-gradient(90deg, rgba(6,10,28,0.2) 0%, rgba(6,10,28,0.08) 100%);
}

.shows-list li.show-item--past:hover{
  opacity:0.72;
}

.show-status{
  font-size:0.7rem;
  padding:0.2rem 0.5rem;
  border-radius:3px;
  border:1px solid rgba(126,240,255,0.3);
  text-transform:uppercase;
  letter-spacing:0.12em;
  background:rgba(126,240,255,0.05);
  transition:all 0.3s ease;
}

.show-status--confirmed{
  color:rgb(50,255,150);
  border-color:rgba(50,255,150,0.3);
  background:rgba(50,255,150,0.08);
  box-shadow:0 0 8px rgba(50,255,150,0.15);
}

.show-status--confirmed:hover{
  box-shadow:0 0 12px rgba(50,255,150,0.3);
  background:rgba(50,255,150,0.12);
}

.show-status--tbc{
  color:rgb(255,120,100);
  border-color:rgba(255,120,100,0.3);
  background:rgba(255,120,100,0.08);
  box-shadow:0 0 8px rgba(255,120,100,0.15);
}

.show-status--tbc:hover{
  box-shadow:0 0 12px rgba(255,120,100,0.3);
  background:rgba(255,120,100,0.12);
}

.show-status--past{
  color:rgb(170,190,210);
  border:1px solid rgba(170,190,210,0.3);
  border-radius:3px;
  padding:0.2rem 0.5rem;
  letter-spacing:0.12em;
  background:rgba(170,190,210,0.08);
  text-transform:uppercase;
}

.show-status--free{
  color:rgb(126,240,255);
  border:1px solid rgba(126,240,255,0.3);
  border-radius:3px;
  padding:0.2rem 0.5rem;
  letter-spacing:0.12em;
  background:rgba(126,240,255,0.08);
  text-transform:uppercase;
}

.show-ticket-link,
.show-ticket-link:visited{
  color:#7ef0ff;
  text-transform:uppercase;
  letter-spacing:0.12em;
  text-decoration:none;
  border-bottom:1px solid rgba(126,240,255,0.35);
  transition:all 0.2s ease;
}

.show-ticket-link:hover,
.show-ticket-link:focus-visible{
  color:#a8f7ff;
  border-bottom-color:rgba(168,247,255,0.9);
  text-shadow:0 0 8px rgba(126,240,255,0.35);
}

/* === END SHOWS SECTION === */

/* === DISCOGRAPHY SECTION === */
#discography h3{
  position:relative;
  cursor:default;
  transition:color 0.3s ease;
  font-family:'JetBrains Mono', monospace;
  font-size:clamp(2rem, 3vw, 2.8rem);
  margin:0 0 clamp(1.5rem, 3vw, 2rem) 0;
  letter-spacing:1px;
  color:#fff;
  text-transform:uppercase;
  font-weight:700;
}

#discography h3::before{
  content:attr(data-cyber);
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  color:#7ef0ff;
  text-shadow:
    0 0 15px rgba(126,240,255,0.7),
    2px 0 3px rgba(255,0,255,0.5),
    -2px 0 3px rgba(0,255,255,0.5);
  transition:opacity 0.3s ease;
  white-space:nowrap;
}

#discography h3:hover::before{
  opacity:1;
  animation:glitch 0.3s infinite;
}

#discography h3:hover{
  color:transparent;
}

.discography-container{
  display:grid;
  gap:2rem;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
}

.discography-coming-soon{
  padding:3rem 2rem;
  background:linear-gradient(135deg, rgba(6,10,28,0.4) 0%, rgba(6,10,28,0.2) 100%);
  border:1px solid rgba(126,240,255,0.2);
  border-radius:8px;
  text-align:center;
  backdrop-filter:blur(8px);
  transition:all 0.3s ease;
  position:relative;
  overflow:hidden;
}

.discography-coming-soon::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(126,240,255,0.1), transparent);
  transition:left 0.3s ease;
}

.discography-coming-soon:hover{
  border-color:rgba(126,240,255,0.4);
  background:linear-gradient(135deg, rgba(6,10,28,0.5) 0%, rgba(6,10,28,0.3) 100%);
  box-shadow:0 8px 24px rgba(126,240,255,0.1);
}

.discography-coming-soon:hover::before{
  left:100%;
}

.coming-soon-icon{
  font-size:3rem;
  color:#7ef0ff;
  margin-bottom:1rem;
  text-shadow:0 0 15px rgba(126,240,255,0.4);
  animation:pulse 2s ease-in-out infinite;
}

.discography-coming-soon h4{
  font-size:1.5rem;
  color:#fff;
  text-transform:uppercase;
  letter-spacing:1px;
  font-family:'JetBrains Mono', monospace;
  margin:0 0 0.5rem 0;
}

.discography-coming-soon p{
  color:rgba(230,245,255,0.7);
  margin:0;
  line-height:1.6;
}

/* === END DISCOGRAPHY SECTION === */

/* === FOOTER === */
.site-footer{
  padding:3rem 0 2rem 0;
  border-top:1px solid rgba(126,240,255,0.15);
  background:linear-gradient(180deg, rgba(2,3,24,0.6) 0%, rgba(2,3,24,0.9) 100%);
  backdrop-filter:blur(10px);
  position:relative;
}

.site-footer::before{
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:60%;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(126,240,255,0.4), transparent);
}

.footer-inner{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:2rem;
  flex-wrap:wrap;
}

.footer-left,
.footer-center,
.footer-right{
  flex:1;
  min-width:200px;
}

.footer-brand{
  font-size:1.5rem;
  font-weight:700;
  letter-spacing:2px;
  color:#7ef0ff;
  margin:0 0 0.5rem 0;
  text-shadow:0 0 10px rgba(126,240,255,0.4);
}

.footer-email{
  margin:0;
  font-size:0.9rem;
}

.footer-email a{
  color:var(--muted);
  text-decoration:none;
  transition:all 0.3s ease;
}

.footer-email a:hover{
  color:#7ef0ff;
  text-shadow:0 0 8px rgba(126,240,255,0.3);
}

.footer-center{
  display:flex;
  justify-content:center;
  align-items:center;
}

.social{
  display:flex;
  gap:1rem;
}

.social a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  color:var(--muted);
  text-decoration:none;
  border:1px solid rgba(126,240,255,0.2);
  border-radius:4px;
  background:rgba(126,240,255,0.05);
  transition:all 0.3s ease;
  font-weight:600;
  font-size:0.85rem;
}

.social a svg{
  width:28px;
  height:28px;
  display:block;
}

.social-instagram{
  border-radius:8px;
}

.social-spotify{
  border-radius:50%;
}

.social-bandcamp{
  border-radius:8px;
}

.social-instagram:hover{
  box-shadow:0 0 18px rgba(214,41,118,0.35);
}

.social-spotify:hover{
  box-shadow:0 0 18px rgba(29,185,84,0.4);
}

.social-bandcamp:hover{
  box-shadow:0 0 18px rgba(29,160,195,0.4);
}

.social a:hover{
  color:#7ef0ff;
  border-color:rgba(126,240,255,0.5);
  background:rgba(126,240,255,0.12);
  box-shadow:0 0 15px rgba(126,240,255,0.2);
  transform:translateY(-2px);
}

.footer-right{
  text-align:right;
}

.footer-links{
  display:flex;
  gap:1rem;
  justify-content:flex-end;
  margin-bottom:0.5rem;
}

.footer-links a{
  color:var(--muted);
  text-decoration:none;
  font-size:0.85rem;
  transition:all 0.3s ease;
  padding:0.3rem 0.8rem;
  border:1px solid rgba(126,240,255,0.15);
  border-radius:3px;
  background:rgba(126,240,255,0.03);
}

.footer-links a:hover{
  color:#7ef0ff;
  border-color:rgba(126,240,255,0.4);
  background:rgba(126,240,255,0.08);
  box-shadow:0 0 10px rgba(126,240,255,0.15);
}

.footer-copy{
  margin:0;
  font-size:0.8rem;
  color:rgba(159,180,208,0.6);
}

/* === END FOOTER === */
@media (max-width:800px){
  .nav{display:none;position:absolute;right:1rem;top:64px;background:rgba(2,6,15,0.95);padding:.5rem;border-radius:8px}
  .nav.open{display:block}
  .menu-toggle{display:block}
  
  .hero{
    height:100vh;
    margin:0;
    padding:0;
  }
  
  .hero-image{
    object-position:center center;
  }
  
  .band{font-size:2.2rem}
  .hero-content{left:50%; top:68%;}
  
  .about-section{
    min-height:auto;
    padding:2rem 0;
  }
  
  .about-container{
    max-height:none;
    min-height:600px;
  }
  
  .about-image{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    max-height:none;
    object-fit:cover;
    object-position:center;
  }
  
  .about-overlay{
    position:absolute;
    flex-direction:column;
    padding:clamp(1.5rem, 5vw, 2rem);
    gap:clamp(1.5rem, 4vw, 2rem);
    align-items:center;
    justify-content:center;
  }
  
  .about-left,
  .about-right{
    max-width:100%;
    width:100%;
    margin:0;
    padding:clamp(1.5rem, 5vw, 2rem);
    background:linear-gradient(135deg, rgba(2,3,24,0.88) 0%, rgba(2,3,24,0.92) 100%);
    backdrop-filter:blur(12px);
    border:1px solid rgba(126,240,255,0.2);
    border-radius:4px;
    box-shadow:0 8px 32px rgba(0,0,0,0.4);
  }
  
  .about-left{
    border-right:none;
  }
  
  .about-left h3,
  .about-right h4{
    font-size:clamp(1.5rem, 5vw, 2rem);
    margin-bottom:1rem;
  }
  
  .about-left p,
  .about-right li{
    font-size:clamp(0.9rem, 2.5vw, 1rem);
  }
  
  .footer-inner{
    flex-direction:column;
    text-align:center;
    gap:2rem;
  }
  
  .footer-left,
  .footer-center,
  .footer-right{
    width:100%;
  }
  
  .footer-right{
    text-align:center;
  }
  
  .footer-links{
    justify-content:center;
  }
  
  .social{
    justify-content:center;
  }

  .booking-content{
    grid-template-columns:1fr;
    gap:2rem;
  }
}

@media (max-width:600px){
  .container{
    padding:0.75rem;
  }

  .header-inner{
    padding:0.6rem 0.75rem;
  }

  .hero{
    height:75vh;
    min-height:440px;
  }

  .hero-content{
    width:calc(100% - 1.5rem);
    max-width:520px;
    left:50%;
    top:70%;
  }

  .band{
    font-size:clamp(1.7rem, 8vw, 2.2rem);
    letter-spacing:2px;
  }

  .tag{
    font-size:clamp(0.78rem, 3.4vw, 0.95rem);
    letter-spacing:1px;
  }

  .about-container{
    min-height:unset;
  }

  .about-overlay{
    padding:1rem;
    gap:1rem;
  }

  .about-left,
  .about-right{
    padding:1rem;
  }

  .music-section{
    padding:2.25rem 0;
  }

  .embed{
    margin:1.25rem auto;
    padding:0.75rem;
  }

  .shows-list{
    padding:1.5rem 0;
  }

  .shows-list li{
    padding:0.95rem 0.85rem 0.95rem 2rem;
    margin:0.55rem 0;
  }

  .booking-card,
  .booking-details{
    padding:1rem;
  }

  .footer-links{
    flex-wrap:wrap;
    gap:0.6rem;
  }

  .scroll-to-top{
    width:44px;
    height:44px;
    right:1rem;
    bottom:1rem;
  }
}
@keyframes blink{
  0%,49%{opacity:0;}
  50%,100%{opacity:1;}
}
