:root{--k:#0b0d14;--paper:#f2d3cb;--white:#f7f1ec;--dim:rgba(247,241,236,.58);--line:rgba(247,241,236,.18);--amber:#f0b45e;--mono:"DM Mono",ui-monospace,Menlo,monospace}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--k);color:var(--white);font-family:var(--mono);font-size:13px;letter-spacing:.06em;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,video{display:block}
.u{text-transform:uppercase}
.ul{border-bottom:1px solid currentColor;padding-bottom:2px}
.ul:hover,a.h:hover{opacity:.55}

/* fixed chrome (all pages) */
.bar{position:fixed;left:0;right:0;z-index:40;display:flex;align-items:center;padding:0 22px;color:#fff;background:var(--k)}
.top{border-bottom:1px solid var(--line)}.bot{border-top:1px solid var(--line)}
body:has(.home) .bar{background:none;border:0;mix-blend-mode:difference}
.top{top:0;height:58px;justify-content:center}
.top ul{display:flex;align-items:center;gap:clamp(1.6rem,5vw,4.2rem);list-style:none;text-transform:uppercase;font-size:12px}
.top a:hover,.bot a:hover,.bot button:hover{opacity:.55}
.top a[aria-current]{border-bottom:1px solid currentColor;padding-bottom:2px}
.top .logo img{height:30px;width:auto;filter:brightness(0) invert(1)}
.bot{bottom:0;height:46px;justify-content:flex-end;gap:2rem;text-transform:uppercase;font-size:11px}
.bot button{background:none;border:0;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer}
.bot .join{margin-right:auto}

/* home */
.home{position:fixed;inset:0;overflow:hidden;background:#000}
.home video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.home::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55),rgba(0,0,0,0) 30%),linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,0) 18%);pointer-events:none}
.home .now{position:absolute;left:22px;bottom:62px;z-index:3;text-transform:uppercase;font-size:12px;line-height:2}
.home .now span{color:var(--dim)}
.home .sound{position:absolute;right:22px;bottom:62px;z-index:3;background:none;border:0;color:var(--white);font:inherit;font-size:12px;letter-spacing:inherit;text-transform:uppercase;cursor:pointer}
.home .sound:hover{opacity:.55}

/* inner pages */
.page{padding:120px 22px 110px}
.wrap{width:min(1240px,100%);margin:0 auto}
.kicker{font-size:11px;text-transform:uppercase;color:var(--dim);margin-bottom:1.6rem}
.title{font-weight:400;font-size:clamp(34px,6.4vw,96px);line-height:1;text-transform:uppercase;letter-spacing:-.01em}
.title em{font-style:normal;color:var(--amber)}
.links{display:flex;flex-wrap:wrap;gap:1.6rem 2.4rem;margin-top:2.2rem;text-transform:uppercase;font-size:12px}
.split{display:grid;grid-template-columns:5fr 7fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.split .ph{position:sticky;top:90px}
.split .ph img{width:100%;aspect-ratio:4/5;object-fit:cover}
.cap{margin-top:.8rem;font-size:11px;text-transform:uppercase;color:var(--dim)}

.rec{margin-top:4.5rem}
.rec h2{font-weight:400;font-size:11px;text-transform:uppercase;color:var(--dim);margin-bottom:1.2rem}
.rec ol{list-style:none;border-top:1px solid var(--line)}
.rec li{display:grid;grid-template-columns:2.6rem 1fr auto auto;gap:1.2rem;align-items:baseline;padding:1.1rem 0;border-bottom:1px solid var(--line);text-transform:uppercase}
.rec li b{font-weight:400;font-size:clamp(15px,1.5vw,21px);letter-spacing:.02em}
.rec li i{font-style:normal;color:var(--dim);font-size:11px}
.rec li .go{display:flex;gap:1.1rem;font-size:11px}

.ff{position:relative;overflow:hidden;margin-top:5rem;border:1px solid var(--line);min-height:360px;display:flex;align-items:center;justify-content:center;text-align:center}
.ff canvas{position:absolute;inset:0;width:100%;height:100%}
.ff .in{position:relative;display:flex;flex-direction:column;align-items:center;gap:1.3rem;text-transform:uppercase;padding:3rem 1rem}
.ff .s{color:var(--amber);font-size:12px}
.ff .t{font-size:clamp(38px,7vw,96px);letter-spacing:.04em;line-height:.9}
.btn{background:none;border:1px solid var(--white);color:var(--white);font:inherit;text-transform:uppercase;padding:.85rem 1.8rem;cursor:pointer;letter-spacing:.08em;display:inline-block}
.btn:hover{background:var(--white);color:var(--k)}

.films{display:grid;gap:4.5rem;margin-top:3.5rem}
.film .frame{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.film .frame video,.film .frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.film .frame .poster{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-transform:uppercase;font-size:12px}
.film .frame .poster span{border:1px solid currentColor;padding:.85rem 1.8rem;position:relative;z-index:2}
.film .frame .poster:hover span{background:var(--white);color:var(--k)}
.dawn{position:absolute;inset:0;background:radial-gradient(ellipse 50% 30% at 50% 74%,#f6c27a 0%,#e48b6a 28%,rgba(158,59,59,.5) 52%,transparent 74%),linear-gradient(180deg,#0b0d14 0%,#252b48 55%,#6e4256 100%)}
.dawn::after{content:"";position:absolute;left:0;right:0;bottom:0;height:26%;background:linear-gradient(180deg,#151a2b,#090b12)}
.film .meta{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.1rem;text-transform:uppercase}
.film .meta b{font-weight:400;font-size:clamp(15px,1.6vw,22px)}
.film .meta span{color:var(--dim);font-size:11px}
.film p{color:var(--dim);margin-top:.8rem;max-width:70ch;line-height:1.75;letter-spacing:.04em}

.bio p{font-size:clamp(13px,1.05vw,15px);line-height:1.8;color:var(--dim);max-width:64ch;margin-bottom:1.3rem;letter-spacing:.04em}
.bio p.lead{color:var(--white);font-size:clamp(18px,1.9vw,28px);line-height:1.4;text-transform:uppercase;letter-spacing:.02em;margin-bottom:2rem}
.facts{list-style:none;margin:2.6rem 0;border-top:1px solid var(--line)}
.facts li{display:grid;grid-template-columns:13rem 1fr;gap:1rem;padding:.95rem 0;border-bottom:1px solid var(--line);text-transform:uppercase;font-size:11px;line-height:1.7}
.facts li span{color:var(--dim)}
.who{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:3rem;text-transform:uppercase;font-size:11px;line-height:2}
.who span{color:var(--dim)}

/* join overlay */
.ov{position:fixed;inset:0;z-index:60;background:rgba(11,13,20,.95);display:none;align-items:center;justify-content:center}
.ov.open{display:flex}
.ov .box{width:min(560px,88vw);text-align:center;text-transform:uppercase}
.ov h3{font-weight:400;font-size:clamp(24px,3.6vw,40px);margin-bottom:.8rem}
.ov p{color:var(--dim);font-size:12px;margin-bottom:2.2rem;text-transform:none;letter-spacing:.04em}
.ov form{display:flex;flex-direction:column;gap:.2rem;text-align:left}
.ov form .row{display:flex;gap:1.2rem}
.ov form .row input{flex:1}
.ov input{min-width:0;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.35);outline:0;color:var(--white);font:inherit;font-size:15px;padding:.9rem 0}
.ov input::placeholder{color:var(--dim)}
.ov input:focus{border-bottom-color:var(--white)}
.ov form button{align-self:center;margin-top:1.6rem;background:none;border:1px solid var(--amber);padding:.8rem 2.6rem;color:var(--amber);font:inherit;text-transform:uppercase;cursor:pointer}
.ov form button:hover{background:var(--amber);color:var(--bg,#0b0d14)}
.ov form button:disabled{opacity:.5}
.ov .note{min-height:1.4em;margin-top:1.2rem;font-size:12px;color:var(--dim);text-transform:none}
.ov .x{position:absolute;top:18px;right:22px;background:none;border:0;color:var(--white);font:inherit;text-transform:uppercase;cursor:pointer}

@media (max-width:820px){
  .top ul{gap:1.1rem;font-size:11px;width:100%;justify-content:space-between}
  .hide-m{display:none!important}
  .bot{gap:1.1rem;font-size:10px}
  .page{padding:96px 6vw 96px}
  .split{grid-template-columns:1fr}
  .split .ph{position:static}
  .rec li{grid-template-columns:1fr;gap:.35rem}
  .rec li i.n{display:none}
  .facts li,.who{grid-template-columns:1fr}
  .home .now{font-size:10px;right:22px}
  .home .sound{bottom:96px}
}

/* ---- releases page ---- */
.rel-index{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin:2rem 0 0;text-transform:uppercase;font-size:11px;color:var(--dim)}
.rel-index a:hover{color:var(--white)}
.release{padding:5.5rem 0 1rem;border-top:1px solid var(--line);margin-top:5.5rem;scroll-margin-top:60px}
.release:first-of-type{margin-top:3.5rem}
.r-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-bottom:1.8rem}
.r-head h2{font-weight:400;font-size:clamp(26px,4.4vw,64px);line-height:1;text-transform:uppercase;letter-spacing:-.01em}
.r-head h2 em{font-style:normal;color:var(--amber)}
.r-head span{font-size:11px;text-transform:uppercase;color:var(--dim)}
.r-grid{display:grid;grid-template-columns:8fr 4fr;gap:2.4rem;align-items:start}
.yt{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;display:block}
.yt img,.yt video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.yt img{opacity:.7;transition:opacity .4s,transform 1.2s}
.yt:hover img{opacity:.85;transform:scale(1.015)}
.yt .pl{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;text-transform:uppercase;font-size:12px;z-index:2}
.yt .pl b{width:72px;height:72px;border:1px solid var(--white);border-radius:50%;display:grid;place-items:center;transition:background .3s}
.yt:hover .pl b{background:var(--white);color:var(--k)}
.yt .pl b svg{margin-left:4px}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:3}
.r-side p{color:var(--dim);line-height:1.8;letter-spacing:.04em;margin-bottom:1.2rem}
.r-side .art{width:100%;aspect-ratio:1;object-fit:cover;margin-bottom:1.4rem}
.r-side dl{display:grid;grid-template-columns:auto 1fr;gap:.45rem 1rem;font-size:11px;text-transform:uppercase;line-height:1.6;border-top:1px solid var(--line);padding-top:1.1rem;margin-top:1.4rem}
.r-side dt{color:var(--dim)}
.r-side .links{margin-top:1.4rem}
.polaroids{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2.4vw,2.2rem);margin-top:3rem;padding:1rem .5rem}
.pola{background:#f4efe6;padding:10px 10px 46px;box-shadow:0 18px 40px rgba(0,0,0,.45);transform:rotate(var(--r,0deg));transition:transform .4s;position:relative}
.pola:hover{transform:rotate(0deg) scale(1.03);z-index:2}
.pola img{width:100%;aspect-ratio:1/1.03;object-fit:cover}
.pola figcaption{position:absolute;left:12px;right:12px;bottom:15px;color:#3a3530;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.photo-credit{font-size:10px;text-transform:uppercase;color:var(--dim);margin-top:.8rem}
@media (max-width:820px){
  .r-grid{grid-template-columns:1fr}
  .polaroids{grid-template-columns:repeat(2,1fr)}
  .release{padding-top:3.5rem;margin-top:3.5rem}
}

/* ---- live section ---- */
.live-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.live-head h2{font-weight:400;font-size:clamp(44px,9vw,140px);line-height:.9;letter-spacing:.02em}
.live-head span{font-size:11px;text-transform:uppercase;color:var(--dim)}
.live-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:2.4rem}
.live-grid .cap{margin-top:.8rem;font-size:11px;text-transform:uppercase;color:var(--white)}
.live-grid .cap span{display:block;color:var(--dim);margin-top:.2rem}
.stage-bg{position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 35%,rgba(240,180,94,.32),transparent 60%),linear-gradient(180deg,#141826,#07080d)}
.stage-bg::after{content:"";position:absolute;left:50%;top:0;width:44%;height:100%;transform:translateX(-50%);background:linear-gradient(180deg,rgba(255,236,200,.16),transparent 75%);clip-path:polygon(40% 0,60% 0,100% 100%,0 100%)}
@media (max-width:820px){.live-grid{grid-template-columns:1fr}}

/* ---- contact sheets & live wall ---- */
.sheets{margin-top:3rem;display:grid;gap:1.2rem}
.sheets .two{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.sheets .three{display:grid;grid-template-columns:1.1fr 1fr 1.6fr;gap:1.2rem;align-items:stretch}
.sheet{background:#050608;border:1px solid var(--line);overflow:hidden;position:relative}
.sheet img{width:100%;height:100%;object-fit:contain;display:block}
.sheets .three .sheet img{object-fit:cover}
.sheet figcaption{position:absolute;left:10px;bottom:8px;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--white);mix-blend-mode:difference}
.strip{margin-top:1.6rem}
.strip img{width:100%;display:block;border:1px solid var(--line)}
.live-photos{columns:3 280px;column-gap:1.2rem;margin-top:3rem}
.live-photos figure{break-inside:avoid;margin:0 0 1.2rem;overflow:hidden;background:#000}
.live-photos img,.live-photos video{width:100%;display:block;transition:transform 1.2s}
.live-photos figure:hover img{transform:scale(1.03)}
@media (max-width:820px){.sheets .two,.sheets .three{grid-template-columns:1fr}}
.ov .fine{min-height:0;margin-top:.8rem;font-size:11px;opacity:.75}
@media (max-width:520px){.ov form .row{flex-direction:column;gap:.2rem}}