:root{
  --red:#d40000;
  --deep-red:#7a0000;
  --black:#050505;
  --panel:#0d0d0f;
  --white:#f6f6f6;
  --muted:#b7b7b7;
  --line:#353535;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#050505;color:var(--white);font-family:"Oswald",Arial,sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
button{cursor:pointer}
.portfolio-banner{position:relative;z-index:1000;background:linear-gradient(90deg,#8b0000,#da1515,#8b0000);padding:10px 20px;text-align:center;font-family:Arial,sans-serif;box-shadow:0 2px 18px #000}
.portfolio-banner strong{display:block;font-size:18px}
.portfolio-banner span{display:block;font-size:12px;max-width:1050px;margin:auto}
.watermark{position:fixed;z-index:999;left:50%;top:55%;transform:translate(-50%,-50%) rotate(-28deg);font:bold clamp(55px,12vw,180px)/1 Arial,sans-serif;color:rgba(255,255,255,.055);white-space:nowrap;pointer-events:none}
.site-header{position:sticky;top:0;z-index:900;display:flex;align-items:center;gap:28px;padding:14px clamp(20px,6vw,100px);background:rgba(0,0,0,.95);border-bottom:1px solid #222}
.logo{display:flex;flex-direction:column;font-family:"Anton";line-height:.75;font-size:28px;letter-spacing:1px}
.logo em{font-family:"Rock Salt";color:var(--red);font-size:24px;transform:rotate(-5deg)}
.main-nav{display:flex;gap:24px;margin-left:auto;text-transform:uppercase;font-weight:700;font-size:14px}
.main-nav a:hover{color:#ef1d1d}
.menu-toggle{display:none;margin-left:auto;background:none;border:1px solid #555;color:#fff;padding:8px 12px}
.primary-btn,.outline-btn,.wide-btn,.show button,.button-row button{display:inline-block;border:1px solid var(--red);padding:12px 22px;text-transform:uppercase;font-weight:700;background:transparent;color:#fff;letter-spacing:.4px}
.primary-btn{background:linear-gradient(135deg,#e00000,#8c0000);border:none}
.primary-btn:hover,.outline-btn:hover,.wide-btn:hover,.show button:hover,.button-row button:hover{filter:brightness(1.25)}
.hero{position:relative;min-height:650px;display:flex;align-items:center;background:url("assets/midnight-rebel-hero.jpg") center/cover no-repeat}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.93) 0%,rgba(0,0,0,.7) 35%,rgba(0,0,0,.15) 75%)}
.hero-content{position:relative;z-index:2;padding:70px clamp(25px,7vw,120px);max-width:720px}
.eyebrow{text-transform:uppercase;color:#ff3232;font-weight:700;letter-spacing:2px}
.hero h1{margin:8px 0 24px;font-family:"Anton";font-size:clamp(62px,9vw,130px);line-height:.84;letter-spacing:1px}
.hero h1 em{font-family:"Rock Salt";color:var(--red);font-size:.7em}
.hero-copy{font-size:24px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:28px}
.feature-grid{display:grid;grid-template-columns:1.15fr .9fr 1.15fr;background:#080808}
.panel{padding:24px clamp(20px,3vw,40px);border:1px solid var(--line);min-height:430px}
.section-heading{display:flex;align-items:center;justify-content:center;gap:10px;text-transform:uppercase}
.section-heading span{color:var(--red)}
.section-heading h2{font-family:"Anton";letter-spacing:1px}
.show{display:grid;grid-template-columns:60px 1fr auto;gap:14px;align-items:center;padding:10px 0;border-bottom:1px solid #333}
.show time{border-right:2px solid var(--red);text-align:center;line-height:1}
.show time b{display:block;color:#ff3535}
.show time strong{display:block;font-size:25px}
.show h3,.show p{margin:0}
.show p{color:var(--muted)}
.show button{padding:7px 15px}
.release-panel{text-align:center}
.album-art{position:relative;width:min(250px,80%);aspect-ratio:1;margin:15px auto;background:linear-gradient(#071120,#451249 60%,#e1198b);overflow:hidden;box-shadow:0 15px 35px #000}
.album-skyline{position:absolute;inset:28% 0 0;background:repeating-linear-gradient(90deg,#071019 0 22px,#141f2b 22px 38px);clip-path:polygon(0 28%,8% 8%,15% 30%,23% 0,32% 24%,41% 12%,50% 32%,60% 4%,68% 20%,78% 0,86% 31%,94% 11%,100% 26%,100% 100%,0 100%)}
.album-title{position:absolute;inset:auto 0 18px;text-align:center;text-shadow:0 2px 10px #000}
.album-title small{display:block;font-family:"Anton";font-size:20px}
.album-title strong{font-family:"Rock Salt";font-size:28px;color:#ff36bd}
.button-row{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.spotify{border-color:#1ed760!important}
.video-card{position:relative;overflow:hidden;border:1px solid #444}
.video-card img{display:block;width:100%;height:250px;object-fit:cover}
.play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:68px;height:68px;border-radius:50%;border:3px solid #fff;background:rgba(0,0,0,.4);color:#fff;font-size:28px}
.video-caption{position:absolute;left:15px;bottom:12px;display:flex;flex-direction:column;text-shadow:0 2px 8px #000}
.wide-btn{display:block;margin:16px auto 0}
.about-section,.contact-section,.merch-section{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;padding:90px clamp(24px,8vw,130px);background:radial-gradient(circle at top right,#321010,#090909 45%)}
.about-section h2,.contact-section h2,.merch-section h2{font-family:"Anton";font-size:clamp(42px,6vw,78px);line-height:1;margin:10px 0 25px;text-transform:uppercase}
.about-section p,.contact-section p,.merch-section p{font-size:18px;color:#d2d2d2}
blockquote{margin:auto;font-family:"Rock Salt";font-size:clamp(34px,5vw,70px);color:#e31b1b;text-align:center;transform:rotate(-4deg)}
.members{display:grid;grid-template-columns:repeat(4,1fr);background:#000}
.members article{position:relative;min-height:360px;border:1px solid #222;padding:270px 20px 20px;overflow:hidden}
.member-photo{position:absolute;inset:0;background-image:linear-gradient(to top,#000 3%,transparent 65%),url("assets/midnight-rebel-hero.jpg");background-size:cover;filter:contrast(1.15) saturate(.8)}
.singer{background-position:32% center}.guitar{background-position:74% center}.bass{background-position:48% center}.drums{background-position:60% center}
.members h3{position:relative;margin:0;font-family:"Rock Salt";color:#ef2525;font-size:24px}
.members p{position:relative;margin:3px 0;text-transform:uppercase}
.merch-section{grid-template-columns:.8fr 1.2fr;background:#0a0a0a}
.merch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.merch-grid article{background:#111;border:1px solid #333;padding:14px;text-align:center}
.merch-art{display:grid;place-items:center;aspect-ratio:1;background:linear-gradient(145deg,#1a1a1a,#050505);font-family:"Anton";font-size:50px;color:#e51717;border:1px solid #444}
.vinyl{border-radius:50%;margin:8px}.poster{font-family:"Rock Salt"}
.contact-section{background:linear-gradient(140deg,#100000,#090909)}
form{display:grid;gap:14px}
label{display:grid;gap:5px;text-transform:uppercase;font-weight:700}
input,textarea{width:100%;background:#0b0b0b;border:1px solid #555;color:#fff;padding:12px}
.form-note{color:#ff4141!important}
footer{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:30px;padding:40px clamp(24px,6vw,100px) 25px;background:#000;border-top:1px solid #333}
footer>div{display:flex;flex-direction:column;gap:6px}
footer strong{text-transform:uppercase}
footer a,footer span{color:#ccc}
.footer-logo{font-family:"Anton";font-size:28px}.footer-logo em{color:#d71919}
.copyright{grid-column:1/-1;border-top:1px solid #222;padding-top:18px;color:#777;font-family:Arial,sans-serif;font-size:12px;text-align:center}
@media(max-width:1050px){
  .desktop-booking{display:none}
  .feature-grid{grid-template-columns:1fr 1fr}
  .feature-grid .panel:last-child{grid-column:1/-1}
  .main-nav{gap:14px}
}
@media(max-width:780px){
  .portfolio-banner strong{font-size:15px}
  .menu-toggle{display:block}
  .main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:#050505;padding:20px;flex-direction:column}
  .main-nav.open{display:flex}
  .hero{min-height:560px;background-position:62% center}
  .hero-overlay{background:linear-gradient(90deg,rgba(0,0,0,.95),rgba(0,0,0,.55))}
  .hero h1{font-size:58px}
  .feature-grid,.about-section,.merch-section,.contact-section,.members,footer{grid-template-columns:1fr}
  .feature-grid .panel:last-child{grid-column:auto}
  .members article{min-height:330px}
  .merch-grid{grid-template-columns:1fr}
  footer .copyright{grid-column:auto}
}