:root{
  --sand:#eeeeee;
  --terracotta:#bdbdbd;
  --clay:#8a8a8a;
  --dusk:#232323;
  --night:#0a0a0a;
  --gold:#d4d4d4;
  --deep:#161616;
  --line:rgba(255,255,255,0.12);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  background:var(--night);
  color:var(--sand);
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img{display:block; max-width:100%;}
.logo, .footer-logo, h1, h2, .hero-tag, .section-label, .nav-links, .see-all,
.stat-num, .track-title, .hero-stat, .footer-col h4, .game-title, .step-label{
  font-family:'Space Grotesk', 'Inter', sans-serif;
}

/* NAV */
nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; justify-content:space-between; align-items:center;
  padding:28px 6vw;
  background:linear-gradient(to bottom, rgba(0,0,0,0.9), transparent);
}
.logo{
  font-size:1.2rem; font-weight:900; letter-spacing:0.16em;
  background:linear-gradient(120deg, #ffffff 0%, #a8a8a8 45%, #4a4a4a 80%, #1a1a1a 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.nav-right{ display:flex; align-items:center; gap:2rem; }
.nav-links{display:flex; gap:2.4rem; font-size:0.78rem; letter-spacing:0.14em; text-transform:uppercase; font-weight:600;}
.nav-links a{opacity:0.85; transition:opacity 0.2s, color 0.2s;}
.nav-links a:hover{opacity:1; color:var(--gold);}
.lang-toggle{ display:flex; align-items:center; border:1px solid var(--line); border-radius:999px; overflow:hidden; }
.lang-toggle button{
  background:transparent; border:none; color:var(--sand); opacity:0.6;
  font-family:'Space Grotesk','Inter',sans-serif; font-size:0.72rem; font-weight:700;
  letter-spacing:0.08em; padding:0.45rem 0.85rem; cursor:pointer;
  transition:background 0.18s ease, opacity 0.18s ease, color 0.18s ease;
}
.lang-toggle button.active{ background:var(--gold); color:var(--night); opacity:1; }
.lang-toggle button:hover{ opacity:1; }
.lang-toggle button:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }

/* HERO — full-bleed, content anchored bottom-left like a tour-poster hero */
.hero{
  min-height:max(640px, 100vh);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  background:
    linear-gradient(0deg, rgba(0,0,0,0.96) 0%, rgba(0,0,0,0.35) 45%, rgba(0,0,0,0.6) 100%),
    radial-gradient(circle at 75% 15%, rgba(255,255,255,0.16), transparent 55%),
    linear-gradient(0deg, rgba(0,0,0,0.55), rgba(0,0,0,0.15)),
    url('photos/hero-bg.jpg');
  background-size:cover;
  background-position:center 20%;
  background-blend-mode:normal, screen, normal, normal;
  padding:0 6vw 5rem;
}
.hero-tag{
  font-size:0.75rem; letter-spacing:0.35em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.4rem; font-weight:700;
}
.hero h1{
  font-size:clamp(3.4rem, 12vw, 8.5rem);
  font-weight:900; letter-spacing:-0.01em;
  line-height:0.9;
  color:var(--sand);
  text-transform:uppercase;
}
.hero-sub{
  display:flex; align-items:center; gap:1.5rem; margin-top:1.6rem; flex-wrap:wrap;
}
.hero-sub p{
  font-size:clamp(1rem,2vw,1.2rem);
  opacity:0.8; font-weight:300;
}
.hero-sub .dot{width:5px;height:5px;border-radius:50%;background:var(--gold); opacity:0.7;}
.hero-stat{
  font-size:0.8rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold); font-weight:700;
}
.scroll-cue{
  position:absolute; bottom:24px; right:6vw;
  font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase;
  opacity:0.45;
}
.hero-ctas{
  display:flex; gap:1rem; margin-top:2.2rem; flex-wrap:wrap;
}
.hero-ctas .game-btn{
  background:rgba(0,0,0,0.3);
  backdrop-filter:blur(4px);
}
.hero-ctas .game-btn:not(.secondary){
  background:var(--gold); color:var(--night);
}
.hero-ctas .game-btn:not(.secondary):hover{
  background:var(--sand);
}

section{padding:7rem 6vw;}
.section-head{
  display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:2.5rem; flex-wrap:wrap; gap:1rem;
}
.section-label{
  font-size:0.78rem; letter-spacing:0.3em; text-transform:uppercase;
  color:var(--terracotta); margin-bottom:1rem; font-weight:700;
}
h2{
  font-size:clamp(2.1rem,4.8vw,3rem);
  font-weight:900; letter-spacing:-0.01em;
  color:var(--sand);
}
.see-all{
  font-size:0.78rem; letter-spacing:0.12em; text-transform:uppercase; font-weight:700;
  color:var(--gold); border-bottom:1px solid var(--gold); padding-bottom:2px;
  white-space:nowrap;
}

/* BIO */
.bio{ background:var(--deep); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.bio-grid{ display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.bio-text p{
  font-size:1.08rem; line-height:1.8; color:var(--sand); opacity:0.85;
  margin-bottom:1.3rem; font-weight:300;
}
.bio-visual{
  aspect-ratio:1/1;
  position:relative;
}
.bio-visual::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.18), transparent 55%),
    radial-gradient(circle at 70% 75%, rgba(0,0,0,0.4), transparent 55%);
  pointer-events:none;
}
.bio-visual img{
  position:relative; z-index:1;
  width:100%; height:100%; object-fit:cover;
  filter:grayscale(0.15) contrast(1.05);
  -webkit-mask-image: radial-gradient(ellipse 68% 76% at 50% 36%, #000 50%, transparent 100%);
  mask-image: radial-gradient(ellipse 68% 76% at 50% 36%, #000 50%, transparent 100%);
}
.stats{ display:flex; gap:3rem; margin-top:2.2rem; flex-wrap:wrap; }
.stat-num{font-size:2.2rem; font-weight:900; color:var(--gold);}
.stat-label{font-size:0.72rem; letter-spacing:0.15em; text-transform:uppercase; opacity:0.65;}
.bio-text p.influences{ font-size:0.92rem; opacity:0.6; font-style:italic; }
.bio-text em{ font-style:italic; color:var(--gold); opacity:1; }
.achievement{
  margin-top:1.6rem; font-size:0.85rem; opacity:0.65; font-weight:400;
  padding-top:1.4rem; border-top:1px solid var(--line);
}
.achievement em{ font-style:normal; font-weight:700; color:var(--gold); opacity:1; }

.al1ve-transition{
  margin-top:4rem; text-align:center;
  font-size:1.1rem; font-style:italic; opacity:0.55;
  font-family:'Space Grotesk','Inter',sans-serif;
}
.al1ve-box{
  margin-top:1.2rem; padding:2.2rem;
  border:1px solid var(--line); border-radius:14px;
  background:rgba(255,255,255,0.02);
}
.al1ve-tag{
  font-size:0.72rem; letter-spacing:0.25em; text-transform:uppercase;
  color:var(--gold); opacity:0.8; margin-bottom:0.6rem; font-weight:700;
}
.al1ve-box h3{
  font-size:1.8rem; font-weight:900; margin-bottom:0.6rem;
  font-family:'Space Grotesk','Inter',sans-serif;
}
.al1ve-motto{
  font-size:1.05rem; font-style:italic; opacity:0.85; margin-bottom:1rem;
}
.al1ve-box p{ font-size:1rem; line-height:1.7; opacity:0.8; font-weight:300; margin-bottom:1.2rem; }
.al1ve-tracks{ font-size:0.85rem; opacity:0.6; letter-spacing:0.02em; line-height:1.8; margin-bottom:1rem; }
.al1ve-link{ display:inline-block; }

/* MUSIC — card grid, Don Diablo style */
.music{ background:var(--night); }
.music-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1.6rem;
}
.track-card{
  display:block;
  border-radius:10px;
  overflow:hidden;
  background:var(--deep);
  border:1px solid var(--line);
  transition:transform 0.25s ease, border-color 0.25s ease;
}
.track-card:hover{ transform:translateY(-6px); border-color:var(--gold); }
.track-art{
  aspect-ratio:1/1;
  display:flex; align-items:center; justify-content:center;
  position:relative;
}
.track-art img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.track-info{ padding:1rem 1.2rem 1.3rem; }
.track-title{ font-size:1rem; font-weight:800; margin-bottom:0.2rem; }
.track-feat{ font-size:0.8rem; opacity:0.7; margin-bottom:0.35rem; font-weight:400; }
.track-meta{ font-size:0.72rem; opacity:0.55; letter-spacing:0.04em; }
.music-links{ display:flex; gap:1.2rem; margin-top:2.5rem; flex-wrap:wrap; }
.pill{
  padding:0.8rem 1.6rem; border-radius:999px; border:1px solid var(--gold);
  font-size:0.8rem; letter-spacing:0.1em; text-transform:uppercase; font-weight:700;
  cursor:pointer;
  transition:background 0.18s ease, color 0.18s ease, transform 0.15s ease, box-shadow 0.18s ease;
}
.pill:hover{ background:var(--gold); color:var(--night); transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,0.35); }
.pill:active{ transform:translateY(0); box-shadow:none; }
.pill:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.discography-more{ margin-top:2.5rem; padding-top:2rem; border-top:1px solid var(--line); }
.discography-label{
  font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--gold); opacity:0.75; margin-bottom:0.8rem; font-weight:700;
}
.discography-more p{ font-size:0.92rem; line-height:1.9; opacity:0.6; font-weight:300; }

/* INSTAGRAM */
.instagram{ background:var(--night); }
.ig-fallback{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  padding:2.2rem 2.4rem; border-radius:14px;
  border:1px solid var(--line); background:rgba(255,255,255,0.02);
  transition:border-color 0.2s, background 0.2s, transform 0.2s;
}
.ig-fallback:hover{ border-color:var(--gold); background:rgba(255,255,255,0.05); transform:translateY(-2px); }
.ig-fallback-handle{
  font-size:1.4rem; font-weight:900; font-family:'Space Grotesk','Inter',sans-serif;
}
.ig-fallback-cta{
  font-size:0.8rem; letter-spacing:0.1em; text-transform:uppercase; font-weight:700; color:var(--gold);
}

/* CONTACT */
.contact{
  position:relative;
  border-top:1px solid var(--line); text-align:center;
  background:
    linear-gradient(180deg, rgba(0,0,0,0.93), rgba(0,0,0,0.97)),
    url('photos/contact-bg.jpg');
  background-size:cover;
  background-position:center 30%;
}
.contact h2{margin-bottom:1rem;}
.contact p{
  font-size:1.02rem; opacity:0.75; max-width:520px; margin:0 auto 2.5rem;
  font-weight:300; line-height:1.7;
}
.socials{ display:flex; justify-content:center; gap:1.2rem; margin-bottom:3rem; flex-wrap:wrap; }
.social-btn{
  padding:0.9rem 1.8rem; border-radius:8px;
  background:rgba(255,255,255,0.04); border:1px solid var(--line);
  font-size:0.82rem; letter-spacing:0.1em; text-transform:uppercase; font-weight:700;
  cursor:pointer;
  transition:transform 0.18s ease, background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.social-btn:hover{ transform:translateY(-3px); background:rgba(255,255,255,0.1); border-color:var(--gold); box-shadow:0 8px 20px rgba(0,0,0,0.3); }
.social-btn:active{ transform:translateY(-1px); }
.social-btn:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.contact-email{ font-size:1.3rem; font-weight:700; color:var(--gold); }

.contact-form{
  max-width:560px; margin:3rem auto 0; text-align:left;
}
.form-row{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.form-field{ flex:1; min-width:200px; margin-bottom:1.2rem; }
.form-field label{
  display:block; font-size:0.72rem; letter-spacing:0.15em; text-transform:uppercase;
  opacity:0.65; margin-bottom:0.5rem; font-weight:700;
}
.form-field input, .form-field textarea{
  width:100%; padding:0.8rem 1rem; border-radius:8px;
  background:rgba(255,255,255,0.03); border:1px solid var(--line);
  color:var(--sand); font-family:'Inter',sans-serif; font-size:0.95rem;
  resize:vertical;
}
.form-field input:focus, .form-field textarea:focus{
  outline:none; border-color:var(--gold);
}
.form-submit{ width:100%; margin-top:0.5rem; }
.form-note{ margin-top:1.2rem; font-size:0.78rem; opacity:0.55; text-align:center; }
.form-note a{ text-decoration:underline; opacity:0.9; }

/* GAME — beat machine */
.game{ background:var(--deep); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.game-intro{ max-width:640px; margin-bottom:2.5rem; }
.game-intro p{ font-size:1.02rem; opacity:0.75; font-weight:300; line-height:1.7; }
.game-box{
  background:rgba(255,255,255,0.02);
  border:1px solid var(--line);
  border-radius:14px;
  padding:2rem;
}
.game-controls{
  display:flex; align-items:center; gap:1rem 2rem; margin-bottom:2rem; flex-wrap:wrap;
}
.game-btn{
  padding:0.85rem 1.9rem; border-radius:999px; border:1px solid var(--gold);
  font-size:0.8rem; letter-spacing:0.1em; text-transform:uppercase; font-weight:700;
  background:transparent; color:var(--sand); cursor:pointer;
  transition:background 0.18s ease, color 0.18s ease, transform 0.15s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  font-family:'Space Grotesk','Inter',sans-serif;
  line-height:1;
  box-shadow:0 0 0 0 rgba(255,255,255,0);
}
.game-btn:hover{
  background:var(--gold); color:var(--night);
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(0,0,0,0.35);
}
.game-btn:active{ transform:translateY(0); box-shadow:none; }
.game-btn:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.game-btn.secondary{ border-color:var(--line); font-weight:600; }
.game-btn.secondary:hover{ background:rgba(255,255,255,0.1); color:var(--sand); border-color:var(--gold); }
.tempo-control{
  display:flex; align-items:center; gap:0.9rem;
  margin-left:auto;
  padding:0.6rem 1.1rem;
  border:1px solid var(--line); border-radius:999px;
  background:rgba(255,255,255,0.02);
}
.tempo-control label{ font-size:0.72rem; letter-spacing:0.15em; text-transform:uppercase; opacity:0.65; }

/* Custom range slider */
.tempo-control input[type=range]{
  -webkit-appearance:none; appearance:none;
  width:140px; height:4px; border-radius:999px;
  background:linear-gradient(90deg, var(--gold) 0%, var(--gold) var(--fill, 50%), rgba(255,255,255,0.15) var(--fill, 50%), rgba(255,255,255,0.15) 100%);
  cursor:pointer; outline:none;
}
.tempo-control input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none;
  width:16px; height:16px; border-radius:50%;
  background:var(--sand);
  border:2px solid var(--night);
  box-shadow:0 0 0 1px var(--gold), 0 2px 6px rgba(0,0,0,0.5);
  cursor:pointer;
  transition:transform 0.15s ease;
  margin-top:0;
}
.tempo-control input[type=range]::-webkit-slider-thumb:hover{ transform:scale(1.15); }
.tempo-control input[type=range]::-moz-range-track{
  height:4px; border-radius:999px; background:rgba(255,255,255,0.15);
}
.tempo-control input[type=range]::-moz-range-progress{
  height:4px; border-radius:999px; background:var(--gold);
}
.tempo-control input[type=range]::-moz-range-thumb{
  width:16px; height:16px; border-radius:50%;
  background:var(--sand); border:2px solid var(--night);
  box-shadow:0 0 0 1px var(--gold);
  cursor:pointer;
}
.tempo-control input[type=range]:focus-visible{ outline:2px solid var(--gold); outline-offset:4px; }

#bpmValue{ font-weight:800; color:var(--gold); font-size:0.95rem; min-width:3.5rem; }
.sequencer{ display:flex; flex-direction:column; gap:0.7rem; overflow-x:auto; }
.seq-row{ display:flex; align-items:center; gap:0.9rem; }
.step-label{
  width:70px; flex-shrink:0; font-size:0.72rem; letter-spacing:0.1em;
  text-transform:uppercase; opacity:0.7; font-weight:700;
}
.seq-steps{ display:flex; gap:0.5rem; }
.step{
  width:34px; height:34px; border-radius:6px;
  border:1px solid var(--line);
  background:rgba(255,255,255,0.03);
  cursor:pointer;
  transition:background 0.15s, border-color 0.15s, transform 0.1s;
  flex-shrink:0;
}
.step:nth-child(4n+1){ border-color:rgba(255,255,255,0.22); }
.step:hover{ transform:scale(1.08); }
.step.active{ background:var(--gold); border-color:var(--gold); }
.step.playhead{ box-shadow:0 0 0 2px rgba(255,255,255,0.6); }
.game-hint{ margin-top:1.6rem; font-size:0.78rem; opacity:0.5; }

/* SYNTH */
.synth-box{ margin-top:2rem; }
.section-mini-label{
  font-size:0.72rem; letter-spacing:0.25em; text-transform:uppercase;
  color:var(--gold); opacity:0.8; margin-bottom:1.4rem; font-weight:700;
  font-family:'Space Grotesk','Inter',sans-serif;
}
.synth-controls{ display:flex; align-items:center; gap:1rem; margin-bottom:1.6rem; flex-wrap:wrap; }
.synth-controls label{ font-size:0.72rem; letter-spacing:0.15em; text-transform:uppercase; opacity:0.65; }
.synth-controls select{
  -webkit-appearance:none; appearance:none;
  background:rgba(255,255,255,0.04) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d4d4d4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 0.75rem center;
  background-size:14px;
  color:var(--sand);
  border:1px solid var(--line); border-radius:8px;
  padding:0.6rem 2.2rem 0.6rem 1rem; font-size:0.85rem; font-family:'Inter',sans-serif;
  cursor:pointer;
  transition:border-color 0.18s ease, background-color 0.18s ease;
}
.synth-controls select:hover{ border-color:var(--gold); background-color:rgba(255,255,255,0.07); }
.synth-controls select:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.synth-controls select option{ background:var(--deep); color:var(--sand); }
.keyboard{
  position:relative;
  display:flex;
  height:150px;
  max-width:100%;
  overflow-x:auto;
  user-select:none;
  -webkit-user-select:none;
}
.white-key{
  position:relative;
  width:48px; height:150px; flex-shrink:0;
  background:linear-gradient(180deg, #ececec, #d0d0d0);
  border:1px solid #1a1a1a;
  border-radius:0 0 6px 6px;
  cursor:pointer;
  transition:background 0.05s;
}
.white-key.pressed{ background:linear-gradient(180deg, var(--gold), #b8b8b8); }
.white-key .key-label{
  position:absolute; bottom:8px; left:50%; transform:translateX(-50%);
  font-size:0.65rem; color:#333; letter-spacing:0.05em; font-weight:700;
  font-family:'Space Grotesk',sans-serif; pointer-events:none;
}
.black-key{
  position:absolute; top:0;
  width:30px; height:90px;
  background:linear-gradient(180deg, #2a2a2a, #050505);
  border:1px solid #000;
  border-radius:0 0 5px 5px;
  cursor:pointer;
  z-index:2;
  transition:background 0.05s;
}
.black-key.pressed{ background:linear-gradient(180deg, var(--gold), #7a7a5a); }
.black-key .key-label{
  position:absolute; bottom:6px; left:50%; transform:translateX(-50%);
  font-size:0.58rem; color:#ccc; letter-spacing:0.05em; font-weight:700;
  font-family:'Space Grotesk',sans-serif; pointer-events:none;
}

/* FOOTER — two columns like Don Diablo */
footer{ background:var(--night); border-top:1px solid var(--line); padding:4rem 6vw 2rem; }
.footer-top{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:3rem; padding-bottom:3rem;
}
.footer-logo{
  font-size:1.3rem; font-weight:900; letter-spacing:0.14em;
  background:linear-gradient(120deg, #ffffff 0%, #a8a8a8 45%, #4a4a4a 80%, #1a1a1a 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.footer-cols{ display:flex; gap:5rem; flex-wrap:wrap; }
.footer-col h4{
  font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1rem; font-weight:700;
}
.footer-col a{
  display:block; font-size:0.9rem; opacity:0.75; margin-bottom:0.7rem; font-weight:400;
  transition:opacity 0.2s, color 0.2s;
}
.footer-col a:hover{ opacity:1; color:var(--gold); }
.footer-bottom{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
  border-top:1px solid var(--line); padding-top:1.6rem;
  font-size:0.72rem; letter-spacing:0.06em; opacity:0.45;
}
.footer-bottom .footer-legal{ display:flex; gap:1.5rem; }
.footer-bottom a:hover{ opacity:1; color:var(--gold); }

/* COOKIE BANNER */
.cookie-banner{
  position:fixed; left:0; right:0; bottom:0; z-index:200;
  display:flex; align-items:center; justify-content:center; gap:1.5rem;
  flex-wrap:wrap;
  padding:1.2rem 6vw;
  background:rgba(10,10,10,0.97);
  border-top:1px solid var(--line);
  backdrop-filter:blur(6px);
  transform:translateY(120%);
  transition:transform 0.4s ease;
}
.cookie-banner.visible{ transform:translateY(0); }
.cookie-text{ font-size:0.85rem; opacity:0.75; max-width:640px; line-height:1.6; }
.cookie-text a{ text-decoration:underline; opacity:0.9; }
.cookie-accept{
  padding:0.7rem 1.6rem; border-radius:999px; border:1px solid var(--gold);
  background:var(--gold); color:var(--night);
  font-size:0.78rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:700;
  cursor:pointer; white-space:nowrap;
  font-family:'Space Grotesk','Inter',sans-serif;
  transition:transform 0.15s ease, box-shadow 0.18s ease;
}
.cookie-accept:hover{ transform:translateY(-2px); box-shadow:0 8px 20px rgba(0,0,0,0.35); }
.cookie-accept:active{ transform:translateY(0); }
.cookie-accept:focus-visible{ outline:2px solid var(--sand); outline-offset:3px; }

/* LEGAL PAGE (privacy.html) */
.legal{ padding-top:9rem; max-width:760px; margin:0 auto; }
.legal h1{
  font-size:clamp(2.2rem,5vw,3rem); font-weight:900; margin-bottom:0.6rem;
  font-family:'Space Grotesk','Inter',sans-serif;
}
.legal .updated{ font-size:0.8rem; opacity:0.5; margin-bottom:3rem; }
.legal h2{
  font-size:1.3rem; font-weight:800; margin-top:2.6rem; margin-bottom:1rem;
}
.legal p{ font-size:1rem; line-height:1.8; opacity:0.8; font-weight:300; margin-bottom:1.1rem; }
.legal ul{ margin:0 0 1.1rem 1.3rem; }
.legal li{ font-size:1rem; line-height:1.8; opacity:0.8; font-weight:300; margin-bottom:0.5rem; }
.legal a{ text-decoration:underline; opacity:0.9; }
.back-link{ display:inline-block; margin-top:3rem; margin-bottom:5rem; font-size:0.85rem; opacity:0.7; }
.back-link:hover{ opacity:1; color:var(--gold); }

/* EPK */
.epk-logo-preview{
  max-width:320px; margin:1rem 0 2.5rem;
  background:rgba(255,255,255,0.03); border:1px solid var(--line); border-radius:12px;
  padding:2rem;
}
.epk-facts{
  display:grid; grid-template-columns:1fr 1fr; gap:1.4rem 2rem;
  margin:1rem 0 2.5rem; padding:1.6rem 2rem;
  background:rgba(255,255,255,0.02); border:1px solid var(--line); border-radius:12px;
}
.epk-fact-label{ font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; opacity:0.55; margin-bottom:0.3rem; }
.epk-fact-value{ font-size:1.1rem; font-weight:700; font-family:'Space Grotesk','Inter',sans-serif; }
.download-list{ display:flex; flex-direction:column; gap:0.9rem; margin:1rem 0 2.5rem; }
.download-item{
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 1.4rem; border:1px solid var(--line); border-radius:10px;
  background:rgba(255,255,255,0.02); cursor:pointer;
  transition:border-color 0.18s ease, background 0.18s ease, transform 0.15s ease;
}
.download-item:hover{ border-color:var(--gold); background:rgba(255,255,255,0.05); transform:translateX(4px); }
.download-item:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.download-item span{ font-size:0.95rem; font-weight:600; }
.download-item .dl-icon{ font-size:0.78rem; opacity:0.6; letter-spacing:0.08em; text-transform:uppercase; }
.press-photos-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; margin-bottom:1rem; }
.press-photos-grid img{ border-radius:10px; border:1px solid var(--line); aspect-ratio:1/1; object-fit:cover; }

@media (max-width:800px){
  .nav-links{display:none;}
  .bio-grid{grid-template-columns:1fr; gap:2.5rem;}
  .bio-visual{order:-1; max-width:260px; margin:0 auto;}
  .music-grid{grid-template-columns:repeat(2, 1fr);}
  section{padding:5rem 6vw;}
  .footer-cols{gap:3rem;}
  .footer-bottom{ flex-direction:column; align-items:flex-start; gap:0.8rem; }
}
@media (max-width:520px){
  .music-grid{grid-template-columns:1fr;}
}