:root{
  --ink:#0A0A0A;
  --paper:#FFFFFF;
  --grey:#8A8A8A;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--ink);
  color:var(--paper);
  font-family:Futura,"Avenir Next",Avenir,"Century Gothic","Helvetica Neue",sans-serif;
  -webkit-font-smoothing:antialiased;
  display:flex;
  flex-direction:column;
  min-height:100svh;
  padding:7vmin;
}

/* ---------- header / nav ---------- */
.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  padding-bottom:clamp(28px,6vmin,48px);
}
.brand{
  display:flex;
  align-items:center;
  gap:.5em;
  color:var(--paper);
  text-decoration:none;
}
.brand svg{width:22px;height:22px;display:block;flex:0 0 auto}
.brand-word{
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:12px;
  line-height:1.15;
}
.brand-word span{display:block}
.site-nav{
  display:flex;
  gap:clamp(18px,3vmin,32px);
  flex-wrap:wrap;
}
.site-nav a{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-size:clamp(10px,1.6vmin,12px);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--grey);
  text-decoration:none;
  border-bottom:1px solid transparent;
  padding-bottom:3px;
  transition:color .18s ease,border-color .18s ease;
}
.site-nav a:hover,
.site-nav a:focus-visible,
.site-nav a[aria-current="page"]{
  color:var(--paper);
  border-bottom-color:var(--paper);
}

/* ---------- hero (home) ---------- */
main.hero{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:clamp(28px,6vmin,54px);
}

.carousel{
  --slide-w:min(380px,62vw);
  width:100%;
  max-width:760px;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.carousel-viewport{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:0 calc((100% - var(--slide-w)) / 2);
}
.carousel-track{
  display:flex;
  gap:20px;
  transition:transform .5s cubic-bezier(.65,0,.35,1);
}
.slide{
  flex:0 0 var(--slide-w);
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 2px,transparent 2px 16px),
    #111111;
  border:1px solid rgba(255,255,255,.12);
  opacity:.35;
  filter:blur(2px);
  transform:scale(.88);
  transition:opacity .5s ease,filter .5s ease,transform .5s ease,border-color .5s ease;
}
.slide.is-active{
  opacity:1;
  filter:none;
  transform:scale(1);
  border-color:rgba(255,255,255,.3);
}
.slide-index{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-weight:600;
  font-size:clamp(40px,9vmin,84px);
  letter-spacing:.05em;
  color:rgba(255,255,255,.18);
}
.carousel-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:clamp(32px,6vmin,40px);
  height:clamp(32px,6vmin,40px);
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.25);
  background:rgba(10,10,10,.55);
  color:var(--paper);
  font-size:20px;
  line-height:1;
  cursor:pointer;
  transition:border-color .18s ease,background .18s ease;
}
.carousel-arrow:hover,
.carousel-arrow:focus-visible{
  border-color:var(--paper);
  background:rgba(10,10,10,.8);
}
.carousel-prev{left:12px}
.carousel-next{right:12px}
.carousel-dots{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:clamp(16px,3vmin,24px);
}
.carousel-dots button{
  width:8px;
  height:8px;
  padding:0;
  border-radius:50%;
  border:1px solid var(--grey);
  background:transparent;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease;
}
.carousel-dots button[aria-current="true"]{
  background:var(--paper);
  border-color:var(--paper);
}

.status{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-size:clamp(11px,1.7vmin,14px);
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--grey);
}

/* ---------- interior pages ---------- */
main.page{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:clamp(28px,6vmin,48px);
  padding-top:clamp(8px,2vmin,16px);
}
.page-header{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.page-title{
  text-transform:uppercase;
  font-weight:600;
  font-size:clamp(28px,6vmin,44px);
  letter-spacing:.02em;
}
.prose{
  color:var(--paper);
  font-size:clamp(14px,2.2vmin,18px);
  line-height:1.7;
  max-width:60ch;
  display:flex;
  flex-direction:column;
  gap:1em;
}

.contact-link{
  display:inline-block;
  color:var(--paper);
  font-size:clamp(14px,2.2vmin,18px);
  text-decoration:none;
  border-bottom:1px solid var(--grey);
  padding-bottom:3px;
  width:fit-content;
  transition:border-color .18s ease;
}
.contact-link:hover,
.contact-link:focus-visible{
  border-bottom-color:var(--paper);
}

/* ---------- releases ---------- */
.art-placeholder{
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 2px,transparent 2px 16px),
    #111111;
  border:1px solid rgba(255,255,255,.12);
}
.art-index{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-weight:600;
  letter-spacing:.05em;
  color:rgba(255,255,255,.18);
  font-size:clamp(28px,6vmin,56px);
}

.release-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:clamp(20px,4vmin,32px);
}
.release-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  color:var(--paper);
  text-decoration:none;
}
.release-card .art-placeholder{
  transition:border-color .18s ease;
}
.release-card:hover .art-placeholder,
.release-card:focus-visible .art-placeholder{
  border-color:var(--paper);
}
.release-card-title{
  font-weight:600;
  font-size:clamp(13px,1.8vmin,15px);
  text-transform:uppercase;
  letter-spacing:.03em;
}
.release-layout{
  display:grid;
  grid-template-columns:minmax(220px,420px) 1fr;
  gap:clamp(28px,5vmin,48px);
  align-items:start;
}
.release-art .art-index{
  font-size:clamp(48px,9vmin,96px);
}
.release-info{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.release-meta{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-size:clamp(11px,1.7vmin,13px);
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--grey);
}
.release-links{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:8px;
}

@media (max-width:640px){
  .release-layout{grid-template-columns:1fr}
}

/* ---------- footer ---------- */
.site-footer{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
  padding-top:clamp(28px,6vmin,48px);
}
.social-links{
  display:flex;
  gap:clamp(16px,3vmin,24px);
}
.social-links a{
  display:flex;
  width:20px;
  height:20px;
  color:var(--grey);
  transition:color .18s ease;
}
.social-links a:hover,
.social-links a:focus-visible{
  color:var(--paper);
}
.social-links svg{width:100%;height:100%}
.copyright{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-size:clamp(10px,1.6vmin,12px);
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--grey);
}