/* Red Light Skyscraper static website */
:root{
  --bg:#050505;
  --panel:#0d0d0f;
  --panel-2:#121217;
  --text:#f2f2ef;
  --muted:#a8a8a8;
  --line:rgba(255,255,255,.13);
  --red:#df2428;
  --red-dark:#8e1216;
  --blue:#86d7f5;
  --max:1180px;
  --radius:22px;
  --shadow:0 28px 80px rgba(0,0,0,.42);
  --font-title:"Syne", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body:"Josefin Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-body);
  background:radial-gradient(circle at 70% 15%, rgba(38,84,100,.22), transparent 32rem), var(--bg);
  color:var(--text);
  line-height:1.6;
  overflow-x:hidden;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:999;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    radial-gradient(circle at 50% 30%, transparent 0, rgba(0,0,0,.22) 70%);
  background-size:100% 3px, 100% 100%;
  mix-blend-mode:soft-light;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.skip-link{
  position:absolute;left:-999px;top:1rem;background:var(--text);color:#000;padding:.75rem 1rem;z-index:1000
}
.skip-link:focus{left:1rem}
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:90;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:1rem;
  align-items:center;
  padding:1rem clamp(1rem,4vw,3rem);
  background:linear-gradient(to bottom, rgba(5,5,5,.88), rgba(5,5,5,.25), transparent);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.brand img{width:42px;height:42px;object-fit:contain}
.site-nav{
  display:flex;
  justify-content:center;
  gap:clamp(.7rem,2vw,1.8rem);
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
}
.site-nav a{transition:color .2s ease}
.site-nav a:hover,.site-nav a:focus{color:var(--text)}
.lang-switch{
  display:flex;
  gap:.35rem;
  border:1px solid var(--line);
  border-radius:999px;
  padding:.25rem;
  background:rgba(255,255,255,.04);
}
.lang-btn{
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--muted);
  font-size:.72rem;
  letter-spacing:.12em;
  padding:.35rem .55rem;
  cursor:pointer;
}
.lang-btn.active{background:var(--red);color:var(--text)}
.nav-toggle{display:none}
.hero{
  min-height:100svh;
  position:relative;
  display:grid;
  place-items:center;
  padding:8rem 1rem 4rem;
  overflow:hidden;
}
.hero-bg{
  position:absolute;
  inset:0;
  background-image:url("../images/live/hero.webp");
  background-size:cover;
  background-position:center;
  transform:scale(1.04);
  filter:saturate(.9) contrast(1.05) brightness(.72);
}
.hero-overlay{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 50% 35%, rgba(5,5,5,.1), rgba(5,5,5,.74) 56%, #050505 100%),
    linear-gradient(90deg, rgba(5,5,5,.82), rgba(5,5,5,.25) 46%, rgba(5,5,5,.88));
}
.hero-content{
  position:relative;
  z-index:2;
  width:min(980px,100%);
  text-align:center;
  padding:2rem;
}
.hero-logo{
  width:min(430px,78vw);
  margin:0 auto 2rem;
  filter:drop-shadow(0 0 34px rgba(0,0,0,.8));
}
.eyebrow,.section-kicker,.tag{
  color:var(--red);
  letter-spacing:.2em;
  text-transform:uppercase;
  font-size:.78rem;
  font-weight:700;
}
h1,h2,h3,h4,h5,h6{font-family:var(--font-title);line-height:1.05;margin:0}
h1{
  font-size:clamp(2.6rem,8vw,7.4rem);
  letter-spacing:-.06em;
  max-width:950px;
  margin:0 auto;
}
.hero-copy{
  max-width:720px;
  margin:1.4rem auto 0;
  color:rgba(242,242,239,.78);
  font-size:clamp(1.05rem,2vw,1.28rem);
}
.cta-row{display:flex;justify-content:center;gap:.8rem;flex-wrap:wrap;margin-top:2rem}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:.75rem 1.1rem;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  color:var(--text);
  background:rgba(255,255,255,.06);
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.75rem;
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.45)}
.btn.primary{background:linear-gradient(135deg,var(--red),var(--red-dark));border-color:transparent}
.btn.ghost{background:transparent}
.btn.small{min-height:40px;font-size:.68rem;padding:.65rem .9rem}
.scroll-indicator{
  position:absolute;bottom:1.6rem;left:50%;width:1px;height:70px;background:linear-gradient(var(--text),transparent);
  opacity:.55;
}
.section{
  width:min(var(--max), calc(100% - 2rem));
  margin:0 auto;
  padding:clamp(4.5rem,9vw,8rem) 0;
}
.split{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(2rem,5vw,5rem);
  align-items:center;
}
.split.reverse{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.section-media img,.live-hero img{
  border-radius:var(--radius);
  min-height:420px;
  width:100%;
  object-fit:cover;
  box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.08);
}
.section-copy{
  padding:clamp(1rem,3vw,2rem);
}
.section-copy h2,.section-head h2{
  font-size:clamp(2.2rem,6vw,5rem);
  letter-spacing:-.055em;
}
.section-copy p,.section-head p{
  color:var(--muted);
  font-size:1.05rem;
  max-width:760px;
}
.section-head{
  margin-bottom:2rem;
  max-width:780px;
}
.music-layout{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr);
  gap:1.2rem;
}
.feature-card,.player-card,.quote-card,.contact-card,.archive-panel{
  background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.025));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.feature-card{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:1.2rem;
  padding:1rem;
  align-items:center;
}
.feature-card img,.release-card img{
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:18px;
}
.feature-card h3{font-size:clamp(1.6rem,3vw,2.5rem)}
.feature-card p{color:var(--muted)}
.inline-links{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}
.inline-links a,.footer-links a{
  color:var(--text);
  border-bottom:1px solid rgba(223,36,40,.65);
}
.player-card{padding:1.1rem}
.player-top{display:flex;align-items:center;gap:.6rem;text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;color:var(--muted)}
.red-dot{width:8px;height:8px;background:var(--red);display:inline-block}
.track-list{margin:1rem 0;display:grid;gap:.65rem}
.track{
  display:grid;
  grid-template-columns:54px 1fr auto;
  gap:.75rem;
  align-items:center;
  padding:.55rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(0,0,0,.24);
}
.track img{width:54px;height:54px;border-radius:11px;object-fit:cover}
.track h4{margin:0;font-size:.95rem}
.track span{display:block;color:var(--muted);font-size:.8rem}
.track .track-album{color:var(--text);font-size:.82rem;margin:.12rem 0 .04rem}
.track a{color:var(--red);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em}
.embed-placeholder{margin-top:1rem}
.embed-placeholder iframe{border:0;width:100%;min-height:352px;border-radius:14px}
.section-subhead{margin-top:3rem}
.subsection-title,.section-subhead h3{font-size:1.25rem;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin-bottom:1rem}
.discography-section{margin-top:1.5rem}
.discography-section h4{margin:0 0 1rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.18em;color:var(--text)}
.release-grid{
  display:grid;
  grid-template-columns:repeat(5, minmax(0,1fr));
  gap:1rem;
}
.release-card{
  border:1px solid var(--line);
  border-radius:18px;
  padding:.65rem;
  background:rgba(255,255,255,.035);
  transition:transform .2s ease,border-color .2s ease;
  color:var(--text);
  text-decoration:none;
  display:block;
}
.release-card:hover{transform:translateY(-4px);border-color:rgba(223,36,40,.65)}
.release-card h4{margin:.75rem 0 .1rem;font-size:.92rem}
.release-card p{margin:0;color:var(--muted);font-size:.78rem}
.video-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}
.video-card{
  position:relative;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--panel);
  box-shadow:var(--shadow);
}
.video-frame{
  aspect-ratio:16/9;
  background:#000;
  display:grid;
  place-items:center;
}
.video-frame button{
  width:100%;
  height:100%;
  border:0;
  color:var(--text);
  background:
    linear-gradient(rgba(5,5,5,.35),rgba(5,5,5,.7)),
    var(--thumb, #111);
  background-size:cover;
  background-position:center;
  font-size:1rem;
  cursor:pointer;
}
.video-card iframe{width:100%;height:100%;border:0}
.video-meta{padding:1rem}
.video-meta h3{font-size:1.2rem}
.video-meta p{margin:.25rem 0 0;color:var(--muted)}

.video-channel-card{
  min-height:100%;
}
.video-channel-frame{
  background:
    radial-gradient(circle at 20% 15%,rgba(223,36,40,.28),transparent 34%),
    linear-gradient(135deg,rgba(223,36,40,.18),rgba(255,255,255,.035) 45%,rgba(255,255,255,.02)),
    #090909;
  place-items:stretch;
}
.video-channel-content{
  width:100%;
  height:100%;
  padding:1.35rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:.55rem;
}
.video-channel-content h3{font-size:clamp(1.35rem,2.4vw,2rem);margin:0;letter-spacing:-.04em}
.video-channel-content p:not(.section-kicker){margin:0;color:var(--muted);max-width:34rem}
.video-channel-content .btn{align-self:flex-start;margin-top:.35rem}
.live-hero{margin-bottom:2rem}
.highlight-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.8rem;
  margin-bottom:2rem;
}
.highlight-card{
  border:1px solid var(--line);
  border-radius:18px;
  padding:1rem;
  background:rgba(255,255,255,.04);
}
.highlight-card strong{display:block;color:var(--red);font-size:1.5rem}
.highlight-card h4{margin:.4rem 0 .5rem;font-size:1rem}
.highlight-card p{color:var(--muted);margin:0;font-size:.9rem}
.archive-panel{padding:1rem}
.archive-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:1rem;
}
.archive-head h3{font-size:1.2rem}
#archive-filter{
  width:min(420px,100%);
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(0,0,0,.35);
  color:var(--text);
  padding:.85rem 1rem;
}
.table-wrap{max-height:520px;overflow:auto;border-radius:16px;border:1px solid rgba(255,255,255,.08)}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{padding:.85rem;border-bottom:1px solid rgba(255,255,255,.08);text-align:left}
th{position:sticky;top:0;background:#111;z-index:1;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.13em}
td{color:rgba(242,242,239,.85)}
.press-grid{
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr 1.25fr;
  gap:1rem;
}
.quote-card,.contact-card{padding:1.4rem}
.quote-priority{border-color:rgba(223,36,40,.75);background:linear-gradient(180deg,rgba(223,36,40,.18),rgba(255,255,255,.035));}
blockquote{margin:0;font-size:1.2rem;line-height:1.35}
cite{display:block;margin-top:1rem;color:var(--red);font-style:normal}
.mail{font-size:1.25rem;border-bottom:1px solid var(--red)}
.download-row{display:flex;gap:.6rem;flex-wrap:wrap;margin:1.2rem 0}
.contact-card p{color:var(--muted)}
.lineup{padding-left:1.1rem;color:var(--muted)}

.shop-section .section-head{max-width:820px}
.shop-layout{display:grid;grid-template-columns:1fr;gap:1.2rem;align-items:stretch}
.shop-feature{position:relative;display:grid;min-height:560px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#080808;box-shadow:var(--shadow)}
.shop-feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.56) saturate(.9)}
.shop-feature::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,5,5,.9),rgba(5,5,5,.08) 58%,rgba(5,5,5,.45));}
.shop-feature-copy{position:relative;z-index:1;align-self:end;padding:1.4rem;max-width:620px}
.shop-feature-copy h3{font-size:clamp(2rem,4vw,3.8rem);letter-spacing:-.05em;margin:.4rem 0 .6rem}
.shop-feature-copy p{color:var(--muted);max-width:520px}
.shop-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.shop-gallery a{position:relative;min-height:250px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#111;box-shadow:var(--shadow)}
.shop-gallery img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease, filter .45s ease;filter:brightness(.84)}
.shop-gallery a:hover img{transform:scale(1.04);filter:brightness(1)}
.shop-gallery span{position:absolute;left:.8rem;right:.8rem;bottom:.8rem;padding:.55rem .7rem;border-radius:999px;background:rgba(0,0,0,.66);border:1px solid rgba(255,255,255,.12);font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text)}

.site-footer{
  padding:3rem 1rem 4rem;
  text-align:center;
  color:var(--muted);
  border-top:1px solid var(--line);
  background:#030303;
}
.site-footer img{width:58px;margin:0 auto 1.2rem}
.footer-links{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center;margin-bottom:1.2rem}
.site-footer p{max-width:900px;margin:.35rem auto}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .75s ease, transform .75s ease}
.reveal.visible{opacity:1;transform:none}

@media (max-width: 980px){
  .site-header{grid-template-columns:auto auto auto;justify-content:space-between}
  .nav-toggle{display:inline-flex;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);border-radius:999px;padding:.55rem .85rem;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem}
  .site-nav{
    position:absolute;top:100%;left:1rem;right:1rem;
    display:none;
    flex-direction:column;
    align-items:flex-start;
    background:rgba(5,5,5,.95);
    border:1px solid var(--line);
    border-radius:18px;
    padding:1rem;
  }
  .site-nav.open{display:flex}
  .split,.split.reverse,.music-layout,.press-grid,.shop-layout{grid-template-columns:1fr}
  .release-grid{grid-template-columns:repeat(3, minmax(0,1fr))}
  .highlight-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .video-grid{grid-template-columns:1fr}
  .shop-feature{min-height:420px}
  .archive-head{align-items:flex-start;flex-direction:column}
}
@media (max-width: 620px){
  .hero-content{padding:1rem}
  .hero-logo{width:min(320px,82vw)}
  .feature-card{grid-template-columns:1fr}
  .release-grid{grid-template-columns:repeat(2, minmax(0,1fr));gap:.75rem}
  .highlight-grid{grid-template-columns:1fr}
  .section-media img,.live-hero img{min-height:280px}
  .shop-gallery{grid-template-columns:1fr}
  .shop-gallery a{min-height:230px}
  .track{grid-template-columns:48px 1fr}
  .track a{grid-column:2}
  th,td{padding:.65rem;font-size:.82rem}
}


.archive-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.45rem 0.7rem;
  border: 1px solid rgba(225, 38, 38, 0.55);
  border-radius: 999px;
  color: var(--text);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  background: rgba(225, 38, 38, 0.08);
}

.archive-action:hover {
  border-color: var(--red);
  background: rgba(225, 38, 38, 0.18);
}

.shop-feature img {
  object-position: center center;
}

[hidden] { display: none !important; }


/* Typography update: Syne titles, Josefin Sans body */
.site-nav, .nav-toggle, .lang-btn, .btn, .eyebrow, .section-kicker, .tag, .player-top, .inline-links, .release-meta, .live-table th, .live-table td:first-child, .footer-brand, .photo-link {
  font-family:var(--font-title);
}

body, p, li, td, input, select, textarea {
  font-family:var(--font-body);
}

h1, h2, h3, h4, h5, h6 {
  font-weight:700;
}

.hero-copy, .section-copy p, .press-copy, .about-copy, .shop-copy {
  font-weight:400;
}

/* Cookie consent */
.cookie-banner {
  position: fixed;
  left: 1.25rem;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 1000;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1.25rem;
  align-items: center;
  padding: 1.1rem 1.2rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 22px;
  background: rgba(5,5,5,.94);
  box-shadow: 0 28px 80px rgba(0,0,0,.55);
  backdrop-filter: blur(16px);
}
.cookie-copy strong {
  display: block;
  margin-bottom: .35rem;
  font-family: var(--font-title);
  font-size: .95rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.cookie-copy p {
  margin: 0;
  max-width: 820px;
  color: var(--muted);
  line-height: 1.55;
}
.cookie-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  justify-content: flex-end;
}
.footer-cookie-settings {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--muted);
  font-family: var(--font-title);
  font-size: inherit;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
}
.footer-cookie-settings:hover {
  color: var(--text);
}
@media (max-width: 760px) {
  .cookie-banner {
    grid-template-columns: 1fr;
    left: .85rem;
    right: .85rem;
    bottom: .85rem;
  }
  .cookie-actions {
    justify-content: flex-start;
  }
}
