:root{--black:#050505;--red:#ff1a1a;--white:#e8e8e8}
*{margin:0;padding:0;box-sizing:border-box;cursor:none}
body{background:var(--black);color:var(--white);font-family:'RUMBLEKILL',sans-serif}

/* fonts */
@font-face {font-family:'CINEMA';src:url('CINEMA.otf');}
@font-face {font-family:'RUMBLEKILL';src:url('RUMBLEKILL.otf');}

/* overlays */
body::after{content:"";position:fixed;width:100%;height:100%;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,0,0,.05)0px,rgba(255,0,0,.05)1px,transparent 1px,transparent 3px);z-index:999}
body::before{content:"";position:fixed;width:100%;height:100%;pointer-events:none;background:url('media/noise.png');opacity:.05;z-index:998}

/* cursor */
.cursor{position:fixed;width:12px;height:12px;background:red;border-radius:50%;pointer-events:none;box-shadow:0 0 15px red}

/* nav */
nav{position:fixed;top:0;width:100%;padding:10px;display:flex;justify-content:space-between;background:rgba(0,0,0,.6);z-index:1000}
nav h1{font-family:'CINEMA';color:red;font-size:16px}
nav a{color:white;margin-left:15px;text-decoration:none}

/* about section */
.about-container{display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:center;padding:100px 20px}
.artist-image{width:300px;max-width:90%;border:1px solid red}
.bio{max-width:800px}
.red-link{color:red;margin-right:20px;text-decoration:none}
.bio-links{margin-top:20px}

/* mixes */
.dj-container{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;padding:50px 20px}
.deck{background:#111;border:1px solid red;padding:15px;width:320px;position:relative}
.deck-label{color:red;margin-top:5px;text-align:center}

/* gallery */
.gallery{display:flex;flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;gap:20px;height:100vh}
.gallery video{flex:0 0 100%;height:100vh;scroll-snap-align:start}

/* age gate */
#ageGate{position:fixed;width:100%;height:100vh;background:black;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:3000;text-align:center;color:white}
.age-buttons{margin-top:20px}
.age-buttons button{background:red;color:white;border:none;padding:10px;margin:5px;cursor:pointer;font-size:1rem}

/* responsive */
@media(max-width:700px){
  .about-container{flex-direction:column}
  .artist-image{width:90%}
}