html{scroll-behavior:smooth}
body{margin:0;font-family:Segoe UI,Arial;background:#000;color:#fff}
.nav{position:fixed;top:0;width:100%;padding:.8rem;background:rgba(0,0,0,.65);text-align:center;z-index:1000}
.nav a{color:#f2c200;margin:0 .8rem;text-decoration:none;font-weight:600}
.hero{position:relative;height:100vh;overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.parallax-layer{position:absolute;inset:0;background-size:cover;background-position:center;will-change:transform}
.photo-back{background:url(images/photo-back.jpg) center/cover no-repeat;filter:blur(6px) brightness(.7);transform:scale(1.1)}
.photo-mid{background:url(images/photo-mid.jpg) center/cover no-repeat;filter:blur(2px)}
.photo-front{background:url(images/photo-front.jpg) center/cover no-repeat}
.hero-content{position:relative;z-index:5;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0 1rem}
.title{font-size:clamp(2.8rem,8vw,4.5rem)}
.subtitle{font-size:clamp(1.1rem,4vw,1.6rem)}
#musicToggle{margin-top:1rem;padding:.6rem 1.2rem;background:#f2c200;border:none; text-decoration: none;font-weight:600;cursor:pointer}
#countdown{margin-top:1.2rem;color:#f2c200;font-size:1.2rem}
.section{padding:5rem 1.5rem;text-align:center}
.section.dark{background:#0a7a2f}
.section h2{color:#f2c200}
.venue-name{font-size:1.6rem;font-weight:700}



.image-border {
  border: 5px solid #000000; /* 5px width, solid style, black color */
  padding: 3px;             /* Optional: adds space between the image content and the border */
  margin: 5px;              /* Optional: adds space outside the border */
  border-radius: 10px;      /* Optional: gives the border rounded corners */
}