:root {
  --black: #090909;
  --white: #f4f4f0;
  --line: rgba(244, 244, 240, 0.26);
  --muted: #9a9a96;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background: var(--black);
  color: var(--white);
  font-family: "DM Sans", Arial, sans-serif;
  margin: 0;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
.noise {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 250 250' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
  inset: 0; opacity: .055; pointer-events: none; position: fixed; z-index: 5;
}
.site-header {
  align-items: center; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto auto auto;
  gap: 2.5rem; padding: 1.25rem 2rem; position: relative; z-index: 3;
}
.wordmark { font-size: 1.18rem; font-weight: 700; letter-spacing: -.09em; }
.wordmark span { font-size: .5em; vertical-align: top; margin-left: .12rem; }
.header-link, .eyebrow, .hero-meta, footer, .release-number {
  font-family: "DM Mono", monospace; font-size: .66rem; letter-spacing: .04em; text-transform: uppercase;
}
.header-link { transition: opacity .2s; }
.header-link:hover { opacity: .55; }
.header-link span { margin-left: .35rem; }

.hero { min-height: min(830px, calc(100vh - 61px)); padding: 4.5rem 2rem 2.5rem; position: relative; }
.hero-meta { color: var(--muted); display: flex; justify-content: space-between; }
.hero-meta p { margin: 0; }
h1 {
  font-size: clamp(5rem, 15.5vw, 15rem); font-weight: 500; letter-spacing: -.105em; line-height: .72;
  margin: clamp(4rem, 11vh, 8.5rem) 0 0; position: relative; z-index: 1;
}
.orb-wrap { height: min(48vw, 540px); left: 51%; position: absolute; top: 50%; transform: translate(-50%, -42%); width: min(48vw, 540px); }
.logo-disc { animation: drift 9s ease-in-out infinite; border-radius: 50%; filter: contrast(1.12); height: 100%; object-fit: cover; position: relative; width: 100%; z-index: 1; }
.orb-ring { border: 1px solid rgba(244,244,240,.48); border-radius: 50%; inset: -7%; position: absolute; }
.ring-two { inset: -15%; opacity: .45; }
.ring-three { inset: -24%; opacity: .18; }
.orb-label { bottom: -16%; font: .57rem "DM Mono", monospace; letter-spacing: .08em; position: absolute; right: -8%; text-transform: uppercase; transform: rotate(-20deg); width: 9rem; z-index: 2; }
.hero-intro { bottom: 2.5rem; font-size: clamp(1rem, 1.4vw, 1.35rem); line-height: 1.25; margin: 0; max-width: 23rem; position: absolute; right: 8rem; }
.round-link { align-items: center; border: 1px solid var(--white); border-radius: 50%; bottom: 2.5rem; display: flex; font-size: 1.45rem; height: 3.5rem; justify-content: center; position: absolute; right: 2rem; transition: background .25s, color .25s; width: 3.5rem; }
.round-link:hover { background: var(--white); color: var(--black); }
@keyframes drift { 50% { transform: rotate(3deg) scale(1.025); } }

.ticker { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); overflow: hidden; padding: .8rem 0; white-space: nowrap; }
.ticker-track { animation: marquee 35s linear infinite; display: inline-flex; gap: 1.45rem; width: max-content; }
.ticker span { font: 500 .72rem "DM Mono", monospace; letter-spacing: .1em; }
.ticker i { font-size: .7rem; font-style: normal; }
@keyframes marquee { to { transform: translateX(-50%); } }

.formats { border-bottom: 1px solid var(--line); display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; padding: 6rem 2rem; position: relative; }
.formats .eyebrow { grid-column: 1 / -1; }
.formats h2 { grid-column: 1; }
.formats-copy { align-self: end; font-size: 1rem; line-height: 1.25; margin: 0 0 .4rem; max-width: 15rem; }
.format-card { aspect-ratio: 1.8 / 1; border: 1px solid var(--line); display: flex; flex-direction: column; justify-content: space-between; margin-top: 3rem; padding: 1rem; position: relative; transition: background .25s, color .25s; }
.format-card span { font: .62rem "DM Mono", monospace; text-transform: uppercase; }
.format-card strong { font-size: clamp(1.6rem, 3.5vw, 3.5rem); font-weight: 500; letter-spacing: -.08em; }
.format-card i { font-size: 1.1rem; font-style: normal; position: absolute; right: 1rem; top: 1rem; }
.format-card.digital { grid-column: 1; }
.format-card.vinyl { grid-column: 2; }
.format-card:hover { background: var(--white); color: var(--black); }

.releases { display: grid; gap: 3rem; grid-template-columns: minmax(14rem, .74fr) 1.4fr; padding: 9rem 2rem; }
.eyebrow { color: var(--muted); margin: 0 0 2rem; }
h2 { font-size: clamp(3.5rem, 7vw, 7rem); font-weight: 400; letter-spacing: -.085em; line-height: .78; margin: 0; }
h2 em { font-family: Georgia, serif; font-weight: 400; }
.underlined-link { border-bottom: 1px solid var(--white); display: inline-block; font: .67rem "DM Mono", monospace; margin-top: 5rem; padding-bottom: .35rem; text-transform: uppercase; }
.underlined-link span { margin-left: .8rem; }
.release-list { counter-reset: releases; list-style: none; margin: 0; padding: 0; }
.release-list li { align-items: center; border-top: 1px solid var(--line); display: grid; gap: 1rem; grid-template-columns: 3.2rem 2.5rem 1fr 1.2fr 1rem; min-height: 5.6rem; padding: .65rem 0; transition: padding .25s, background .25s; }
.release-list li:last-child { border-bottom: 1px solid var(--line); }
.release-list li:hover { background: var(--white); color: var(--black); padding-left: .7rem; padding-right: .7rem; }
.release-cover { align-items: center; aspect-ratio: 1; background: var(--white); color: var(--black); display: flex; font: 500 .38rem/.95 "DM Mono", monospace; justify-content: center; letter-spacing: -.025em; margin: 0; overflow: hidden; position: relative; text-align: center; }
.release-cover img { filter: contrast(1.05); height: 100%; object-fit: cover; width: 100%; }
.release-number { color: var(--muted); }
.release-artist { font-size: .85rem; font-weight: 500; }
.release-title { color: var(--muted); font-size: .85rem; }
.release-list a { font-size: 1rem; text-align: right; }

.statement { border-top: 1px solid var(--line); min-height: 85vh; overflow: hidden; padding: 2rem; position: relative; }
.statement-copy { font-size: clamp(4.8rem, 14vw, 14rem); letter-spacing: -.11em; line-height: .74; margin: 9vh 0 0 -.7vw; position: relative; z-index: 1; }
.statement-copy span { color: var(--black); font-family: Georgia, serif; font-style: italic; -webkit-text-stroke: 1px var(--white); }
.statement-mark { bottom: 2rem; font: 1.3rem/1 "DM Mono", monospace; position: absolute; right: 2rem; }
footer { align-items: end; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr 1fr 1fr; padding: 2rem; }
footer p { color: var(--muted); line-height: 1.45; margin: 0; }
.footer-email { font: 500 clamp(1.25rem, 2.5vw, 2.3rem) "DM Sans", sans-serif; letter-spacing: -.06em; text-align: center; }
.footer-email span { font-size: .6em; vertical-align: top; }
.footer-copyright { text-align: right; }

.catalog { padding: 5rem 2rem 7rem; }
.catalog-heading { display: grid; grid-template-columns: minmax(16rem, 1fr) 1.2fr; margin-bottom: 5rem; }
.catalog-heading .eyebrow { grid-column: 1; }
.catalog-heading h1 { font-size: clamp(5rem, 12vw, 12rem); grid-column: 1 / -1; letter-spacing: -.105em; line-height: .7; margin: 0; }
.catalog-heading h1 em { font-family: Georgia, serif; font-weight: 400; }
.catalog-heading > p:last-child { align-self: end; font-size: 1.05rem; grid-column: 2; line-height: 1.3; margin: 0 0 .35rem; max-width: 18rem; }
.catalog-source { align-items: center; border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: flex; font: .67rem "DM Mono", monospace; justify-content: space-between; padding: 1rem 0; text-transform: uppercase; }
.catalog-source a { border-bottom: 1px solid var(--white); padding-bottom: .2rem; }
.catalog-list { border-top: 1px solid var(--line); list-style: none; margin: 1rem 0 0; padding: 0; }
.catalog-list li { border-bottom: 1px solid var(--line); }
.catalog-list a { align-items: center; display: grid; gap: 1.4rem; grid-template-columns: 7.5rem minmax(4rem, .3fr) 1fr 1fr auto; padding: 1rem 0; position: relative; transition: background .25s, color .25s, padding .25s; }
.catalog-list img { aspect-ratio: 1; display: block; object-fit: cover; transition: filter .35s, transform .35s; width: 100%; }
.catalog-list a:hover:not(.catalog-all-link) { background: var(--white); color: var(--black); padding-left: 1rem; padding-right: 1rem; }
.catalog-list a:hover img { filter: grayscale(1); transform: scale(.96); }
.catalog-list strong, .catalog-list a > span { display: block; }
.catalog-list strong { font-size: clamp(1.35rem, 3vw, 2.8rem); font-weight: 500; letter-spacing: -.07em; }
.catalog-list a > span:not(.catalog-date) { color: var(--muted); font-size: .82rem; }
.catalog-date { color: var(--muted); font: .59rem "DM Mono", monospace; }
.catalog-list i { font-size: 1.2rem; font-style: normal; }
.catalog-all-link { align-items: flex-start; border: 1px solid var(--white); display: flex !important; flex-direction: column; font-size: clamp(1.5rem, 3vw, 3rem); justify-content: space-between; letter-spacing: -.07em; line-height: .9; }
.catalog-all-link b { border-bottom: 1px solid var(--white); font: .62rem "DM Mono", monospace; letter-spacing: .04em; padding-bottom: .3rem; text-transform: uppercase; }

@media (max-width: 700px) {
  .site-header { gap: 1rem; grid-template-columns: 1fr auto; padding: 1.1rem 1rem; }
  .contact-link, .links-link { display: none; }
  .hero { min-height: 690px; padding: 3.4rem 1rem 1.5rem; }
  h1 { font-size: clamp(4.7rem, 24vw, 8rem); margin-top: 4.8rem; }
  .orb-wrap { height: 76vw; left: 50%; top: 52%; width: 76vw; }
  .hero-intro { bottom: 7rem; font-size: .95rem; left: 1rem; right: auto; width: 13rem; }
  .round-link { bottom: 1.5rem; right: 1rem; }
  .releases { display: block; padding: 5rem 1rem; }
  .formats { gap: 1rem; grid-template-columns: 1fr 1fr; padding: 4rem 1rem; }
  .formats h2 { font-size: 16vw; }
  .formats-copy { font-size: .82rem; }
  .format-card { aspect-ratio: 1 / 1; margin-top: 1.5rem; padding: .75rem; }
  .format-card strong { font-size: 1.45rem; }
  .underlined-link { margin: 2.5rem 0 4rem; }
  .release-list li { grid-template-columns: 2.8rem 2rem 1fr auto 1rem; gap: .5rem; }
  .release-title { display: none; }
  .statement { min-height: 58vh; padding: 1rem; }
  .statement-copy { font-size: 21vw; margin-top: 11vh; }
  .statement-mark { bottom: 1rem; right: 1rem; }
  footer { gap: 2rem; grid-template-columns: 1fr; padding: 1.5rem 1rem; }
  .footer-email, .footer-copyright { text-align: left; }
  .catalog { padding: 3.5rem 1rem 5rem; }
  .catalog-heading { display: block; margin-bottom: 3rem; }
  .catalog-heading h1 { font-size: 22vw; margin: 3rem 0; }
  .catalog-heading > p:last-child { font-size: .95rem; }
  .catalog-list a { gap: .75rem; grid-template-columns: 4rem 1fr auto; }
  .catalog-list .catalog-date { display: none; }
  .catalog-list a > span:not(.catalog-date) { display: none; }
  .catalog-list strong { font-size: 1.35rem; }
  .catalog-list i { grid-column: 3; grid-row: 1; }
  .catalog-list .catalog-all-link { min-height: 10rem; padding: 1rem; }
}