/* ─────────────────────────────────────────────
   deepdance.dk — Main Stylesheet
   For Statamic / Antlers
───────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --cream:       #f5f0e8;
  --cream-mid:   #ede5d5;
  --cream-dark:  #d5c9b2;
  --ink:         #1a0d04;
  --ink2:        #4a2c10;
  --orange:      #c2410c;
  --orange2:     #ea580c;
  --dark:        #120b03;
  --dark2:       #1e1208;
  --gold:        #a16207;
}

html { scroll-behavior: smooth; }

body {
  background: var(--dark);
  color: var(--cream);
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}

body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  opacity: .45;
}

::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: #1a0d04; }
::-webkit-scrollbar-thumb { background: var(--orange); border-radius: 2px; }

/* ── ANIMATIONS ─────────────────────────────── */
@keyframes fadeUp   { from { opacity:0; transform:translateY(24px) } to { opacity:1; transform:translateY(0) } }
@keyframes fadeIn   { from { opacity:0 } to { opacity:1 } }
@keyframes spin     { from { transform:rotate(0) } to { transform:rotate(360deg) } }
@keyframes pulse    { 0%,100% { opacity:1; transform:scale(1) } 50% { opacity:.4; transform:scale(.8) } }
@keyframes ticker   { from { transform:translateX(0) } to { transform:translateX(-50%) } }
@keyframes waveBar  { 0%,100% { transform:scaleY(.2) } 50% { transform:scaleY(1) } }
@keyframes borderPulse { 0%,100% { border-color:rgba(194,65,12,.3) } 50% { border-color:rgba(194,65,12,.9) } }
@keyframes float    { 0%,100% { transform:translateY(0) rotate(-2deg) } 50% { transform:translateY(-12px) rotate(2deg) } }

/* ── NAV ──────────────────────────────────────── */
.dd-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 44px; height: 64px;
  background: rgba(18,11,3,.85);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(194,65,12,.15);
  transition: border-color .3s;
}
.dd-nav.scrolled { border-bottom-color: rgba(194,65,12,.3); }

.dd-nav__logo {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px; letter-spacing: .06em;
  color: var(--cream); text-decoration: none;
  display: flex; align-items: center; gap: 8px;
}
.dd-nav__logo-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--orange);
  animation: pulse 2s infinite;
}
.dd-nav__logo span { color: var(--orange); }

.dd-nav__links { display: flex; align-items: center; gap: 32px; }
.dd-nav__links a {
  font-family: 'DM Mono', monospace; font-size: 11px;
  letter-spacing: .15em; text-transform: uppercase;
  color: rgba(245,240,232,.45); text-decoration: none;
  transition: color .2s;
}
.dd-nav__links a:hover { color: var(--orange); }
.dd-nav__links a.cta {
  background: var(--orange); color: #fff;
  padding: 8px 18px;
}
.dd-nav__links a.cta:hover { background: var(--orange2); color: #fff; }

/* ── TICKER ───────────────────────────────────── */
.dd-ticker {
  background: var(--orange); overflow: hidden;
  padding: 11px 0;
  border-top: 2px solid rgba(0,0,0,.3);
  border-bottom: 2px solid rgba(0,0,0,.3);
}
.dd-ticker__inner {
  display: flex; gap: 0; white-space: nowrap;
  animation: ticker 22s linear infinite;
}
.dd-ticker__item {
  font-family: 'Bebas Neue', sans-serif; font-size: 18px;
  color: rgba(245,240,232,.9); letter-spacing: .12em;
  flex-shrink: 0; padding: 0 36px;
}
.dd-ticker__sep { color: rgba(245,240,232,.35); }

/* ── HERO ─────────────────────────────────────── */
.dd-hero {
  min-height: 100vh;
  display: flex; flex-direction: column; justify-content: center;
  position: relative; overflow: hidden;
  padding: 100px 48px 80px;
}
.dd-hero__bg {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 80% 60% at 65% 40%, rgba(194,65,12,.12) 0%, transparent 70%);
}
.dd-hero__stripes {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(-52deg, transparent, transparent 80px, rgba(194,65,12,.03) 80px, rgba(194,65,12,.03) 81px);
}
.dd-hero__ghost {
  position: absolute; right: -40px; top: 50%; transform: translateY(-50%);
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(220px, 38vw, 540px); line-height: 1;
  color: transparent; -webkit-text-stroke: 1px rgba(194,65,12,.08);
  user-select: none; pointer-events: none;
}
.dd-hero__content { position: relative; z-index: 2; max-width: 740px; }
.dd-hero__eyebrow {
  font-family: 'DM Mono', monospace; font-size: 11px;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--orange); margin-bottom: 24px;
  display: flex; align-items: center; gap: 12px;
  animation: fadeUp .6s .2s both;
}
.dd-hero__eyebrow::before { content:''; display:block; width:32px; height:1px; background:var(--orange); }
.dd-hero__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(80px, 15vw, 200px); line-height: .88;
  animation: fadeUp .7s .35s both;
}
.dd-hero__title .line1 { color: var(--cream); display: block; }
.dd-hero__title .line2 { color: var(--orange); display: block; }
.dd-hero__subtitle {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(22px, 3.5vw, 48px); letter-spacing: .12em;
  color: rgba(245,240,232,.2); margin-top: 6px; margin-bottom: 48px;
  animation: fadeUp .7s .45s both;
}
.dd-hero__desc {
  max-width: 520px; font-size: 16px; line-height: 1.7;
  color: rgba(245,240,232,.55); margin-bottom: 48px;
  animation: fadeUp .7s .55s both;
}
.dd-hero__btns { display: flex; gap: 16px; flex-wrap: wrap; animation: fadeUp .7s .65s both; }

.dd-hero__vinyl {
  position: absolute; right: 8%; top: 50%; transform: translateY(-50%);
  opacity: .18; pointer-events: none;
  animation: float 8s ease-in-out infinite;
}
.dd-hero__vinyl svg { animation: spin 12s linear infinite; }

.dd-hero__stats {
  position: absolute; bottom: 0; left: 0; right: 0;
  display: flex;
  border-top: 1px solid rgba(245,240,232,.06);
  animation: fadeIn .8s .8s both;
}
.dd-hero__stat {
  flex: 1; padding: 24px 32px;
  border-right: 1px solid rgba(245,240,232,.06);
}
.dd-hero__stat:last-child { border-right: none; }
.dd-hero__stat strong {
  display: block; font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(28px, 3vw, 44px); color: var(--cream); line-height: 1;
}
.dd-hero__stat small {
  font-family: 'DM Mono', monospace; font-size: 9px;
  letter-spacing: .2em; text-transform: uppercase;
  color: rgba(245,240,232,.3); margin-top: 4px; display: block;
}

/* ── BUTTONS ──────────────────────────────────── */
.btn-primary {
  background: var(--orange); color: #fff;
  font-family: 'DM Mono', monospace; font-size: 12px;
  letter-spacing: .18em; text-transform: uppercase;
  padding: 16px 36px; text-decoration: none;
  display: inline-block; transition: background .2s, transform .2s;
  border: none; cursor: pointer;
}
.btn-primary:hover { background: var(--orange2); transform: translateY(-2px); color: #fff; }

.btn-ghost {
  border: 1px solid rgba(245,240,232,.2); color: rgba(245,240,232,.7);
  font-family: 'DM Mono', monospace; font-size: 12px;
  letter-spacing: .18em; text-transform: uppercase;
  padding: 16px 36px; text-decoration: none;
  display: inline-block; transition: border-color .2s, color .2s;
}
.btn-ghost:hover { border-color: var(--orange); color: var(--orange); }

/* ── SECTION UTILITY ──────────────────────────── */
.dd-section { padding: 96px 48px; }
.dd-section--dark { background: var(--dark); }
.dd-section--cream { background: var(--cream-mid); color: var(--ink); }
.section-label {
  font-family: 'DM Mono', monospace; font-size: 10px;
  letter-spacing: .25em; text-transform: uppercase;
  color: var(--orange); margin-bottom: 12px;
}
.section-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(36px, 5vw, 68px); line-height: 1;
  letter-spacing: .02em; margin-bottom: 48px;
}

/* ── FEATURED CARDS ───────────────────────────── */
.dd-feat-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: rgba(245,240,232,.05);
  border: 1px solid rgba(245,240,232,.05);
}
.dd-feat-card {
  background: var(--dark2); padding: 40px 36px;
  position: relative; overflow: hidden;
  cursor: pointer; transition: background .2s;
  text-decoration: none; color: inherit; display: block;
}
.dd-feat-card:hover { background: #221408; }
.dd-feat-card__ghost {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(60px, 8vw, 100px); line-height: 1;
  color: transparent; -webkit-text-stroke: 1px rgba(245,240,232,.07);
  position: absolute; right: -8px; bottom: -12px;
  pointer-events: none;
}
.dd-feat-card__tag {
  font-family: 'DM Mono', monospace; font-size: 9px;
  letter-spacing: .2em; text-transform: uppercase; margin-bottom: 16px;
}
.dd-feat-card__vinyl { margin-bottom: 20px; }
.dd-feat-card__title {
  font-family: 'Bebas Neue', sans-serif; font-size: 28px;
  letter-spacing: .04em; color: var(--cream); line-height: 1; margin-bottom: 6px;
}
.dd-feat-card__desc { font-size: 13px; color: rgba(245,240,232,.45); line-height: 1.5; }
.dd-feat-card__arrow {
  display: inline-block; margin-top: 24px;
  font-family: 'DM Mono', monospace; font-size: 10px;
  letter-spacing: .15em; color: rgba(245,240,232,.3);
  transition: color .2s, transform .2s;
}
.dd-feat-card:hover .dd-feat-card__arrow { color: var(--orange); transform: translateX(4px); }

/* ── ABOUT SECTION ────────────────────────────── */
.dd-about {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 80px; align-items: center;
}
.dd-about__body { font-size: 16px; line-height: 1.8; color: var(--ink2); max-width: 480px; }
.dd-about__body p + p { margin-top: 16px; }
.dd-about__visual {
  display: flex; align-items: center; justify-content: center;
}
.dd-about__ring {
  width: 280px; height: 280px; border-radius: 50%;
  border: 2px solid rgba(194,65,12,.2);
  display: flex; align-items: center; justify-content: center;
  position: relative;
  animation: borderPulse 3s ease-in-out infinite;
}
.dd-about__ring::before {
  content: ''; position: absolute; inset: -16px; border-radius: 50%;
  border: 1px solid rgba(194,65,12,.08);
}
.dd-about__ring::after {
  content: ''; position: absolute; inset: -32px; border-radius: 50%;
  border: 1px solid rgba(194,65,12,.04);
}
.dd-about__vinyl { animation: float 6s ease-in-out infinite; }
.dd-about__vinyl svg { animation: spin 8s linear infinite; }

/* ── VOLUMES STRIP (homepage) ─────────────────── */
.dd-vols-strip { background: var(--dark); padding: 80px 0 96px; }
.dd-vols-strip__head { padding: 0 48px; margin-bottom: 40px; }
.dd-vols-row {
  display: flex; overflow-x: auto; padding: 0 48px;
  scrollbar-width: none;
}
.dd-vols-row::-webkit-scrollbar { display: none; }
.dd-vol-thumb {
  flex: 0 0 180px; padding: 28px 24px;
  border-right: 1px solid rgba(245,240,232,.05);
  text-decoration: none; color: inherit; display: block;
  transition: background .2s; position: relative;
}
.dd-vol-thumb:hover { background: rgba(245,240,232,.04); }
.dd-vol-thumb__bar {
  position: absolute; top: 0; left: 0; width: 2px; height: 100%;
  opacity: 0; transition: opacity .2s;
}
.dd-vol-thumb:hover .dd-vol-thumb__bar { opacity: 1; }
.dd-vol-thumb__num {
  font-family: 'Bebas Neue', sans-serif; font-size: 52px; line-height: 1;
}
.dd-vol-thumb__name {
  font-family: 'DM Mono', monospace; font-size: 9px;
  letter-spacing: .14em; text-transform: uppercase;
  color: rgba(245,240,232,.35); margin-top: 4px;
}
.dd-vol-thumb__year { font-size: 11px; color: rgba(245,240,232,.2); margin-top: 8px; }

/* ── ARCHIVE PAGE ─────────────────────────────── */
.dd-archive { background: var(--cream); color: var(--ink); padding: 72px 48px; }
.dd-archive__intro { margin-bottom: 40px; }
.dd-archive__intro .section-title { color: var(--ink); margin-bottom: 8px; }
.dd-archive__intro p { font-size: 14px; color: #888; }

.dd-cd-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 20px;
}

.dd-cd-card {
  background: #fff;
  border: 2px solid var(--cream-dark);
  cursor: pointer; transition: all .2s;
  position: relative; overflow: hidden;
  text-decoration: none; color: inherit; display: block;
}
.dd-cd-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(26,14,5,.15);
  border-color: var(--orange);
}
.dd-cd-card.is-active {
  border-color: var(--orange);
  transform: translateY(-4px);
}

.dd-cd-card__art {
  aspect-ratio: 1; background: #1a0d04;
  display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.dd-cd-card__art-stripes {
  position: absolute; inset: 0;
}
.dd-cd-card__badge {
  position: absolute; top: 10px; right: 10px;
  background: rgba(0,0,0,.6); color: #fff;
  font-family: 'DM Mono', monospace; font-size: 10px;
  letter-spacing: .1em; padding: 3px 8px; border-radius: 2px;
}
.dd-cd-card__info { padding: 14px 16px; }
.dd-cd-card__title {
  font-family: 'Bebas Neue', sans-serif; font-size: 22px;
  letter-spacing: .04em; color: var(--ink);
}
.dd-cd-card__meta {
  font-family: 'DM Mono', monospace; font-size: 10px;
  color: #888; letter-spacing: .12em; margin-top: 3px;
}
.dd-cd-card__tagline { font-size: 12px; color: #666; margin-top: 6px; }
.dd-cd-card__no-tracks {
  font-family: 'DM Mono', monospace; font-size: 9px;
  color: #bbb; letter-spacing: .12em; margin-top: 8px;
}
.dd-cd-card__waves { position: absolute; bottom: 14px; right: 16px; }
.dd-wave-bars { display: flex; align-items: center; gap: 2px; height: 14px; }
.dd-wave-bars span {
  display: block; width: 3px; height: 100%;
  border-radius: 2px; transform-origin: center;
}

/* ── TRACKLIST PANEL ──────────────────────────── */
.dd-tracklist {
  background: #f0e8d8;
  border-top-width: 4px; border-top-style: solid;
  animation: fadeUp .3s ease;
}
.dd-tracklist__header {
  padding: 48px 48px 32px;
  border-bottom: 1px solid var(--cream-dark);
  display: flex; justify-content: space-between;
  align-items: flex-end; flex-wrap: wrap; gap: 20px;
}
.dd-tracklist__vol-label {
  font-family: 'DM Mono', monospace; font-size: 10px;
  letter-spacing: .2em; margin-bottom: 8px;
}
.dd-tracklist__vol-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(40px, 6vw, 80px); line-height: 1;
}
.dd-tracklist__vol-num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(60px, 10vw, 120px); line-height: .9; color: var(--ink);
}
.dd-tracklist__vol-sub { font-size: 15px; color: #666; margin-top: 8px; }
.dd-tracklist__intro {
  max-width: 820px;
  padding: 24px 48px 32px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.75;
}
.dd-tracklist__intro p,
.dd-tracklist__intro li {
  color: var(--ink2);
}
.dd-tracklist__intro p + p,
.dd-tracklist__intro p + ul,
.dd-tracklist__intro p + ol,
.dd-tracklist__intro ul + p,
.dd-tracklist__intro ol + p {
  margin-top: 16px;
}
.dd-tracklist__intro ul,
.dd-tracklist__intro ol {
  margin: 16px 0 0 20px;
}
.dd-tracklist__intro li + li { margin-top: 6px; }
.dd-tracklist__intro strong {
  color: var(--ink);
  font-weight: 600;
}
.dd-tracklist__intro a {
  color: var(--orange);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dd-tracklist__stats { display: flex; gap: 28px; flex-wrap: wrap; }
.dd-tracklist__stat { text-align: right; }
.dd-tracklist__stat strong {
  display: block; font-family: 'Bebas Neue', sans-serif;
  font-size: 40px; color: var(--ink); line-height: 1;
}
.dd-tracklist__stat small {
  font-family: 'DM Mono', monospace; font-size: 9px;
  color: #999; letter-spacing: .2em; text-transform: uppercase;
}

.dd-track-table { padding: 0 48px 40px; }
.dd-track-table__head {
  display: grid;
  grid-template-columns: 44px 1fr 90px 80px 80px;
  gap: 12px; padding: 16px 0 10px;
  font-family: 'DM Mono', monospace; font-size: 9px;
  color: #aaa; letter-spacing: .15em; text-transform: uppercase;
}
.dd-track-row {
  display: grid;
  grid-template-columns: 44px 1fr 90px 80px 80px;
  align-items: center; gap: 12px;
  padding: 12px 0; border-bottom: 1px solid #e8e0cc;
  transition: background .15s; cursor: default;
}
.dd-track-row:hover { background: rgba(194,65,12,.05); }
.dd-track-row__num {
  font-family: 'DM Mono', monospace; font-size: 13px;
  color: #bbb; text-align: center; font-weight: 500;
  transition: color .15s;
}
.dd-track-row:hover .dd-track-row__num { color: var(--orange); }
.dd-track-row__main {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  column-gap: 10px;
  min-width: 0;
}
.dd-track-row__media {
  display: contents;
}
.dd-track-row__image-stack {
  grid-column: 1;
  grid-row: 1 / span 3;
  position: relative;
  width: 108px;
  height: 108px;
  flex-shrink: 0;
}
.dd-track-row__image,
.dd-track-row__image-placeholder {
  width: 108px;
  height: 108px;
  flex-shrink: 0;
}
.dd-track-row__image {
  display: block;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.08);
}
.dd-track-row__image-stack .dd-track-row__image,
.dd-track-row__image-stack .dd-track-row__image-placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.dd-track-row__image--cover,
.dd-track-row__image--preview {
  transition: opacity .18s ease;
}
.dd-track-row__image--preview {
  opacity: 0;
}
@media (hover: hover) and (pointer: fine) {
  .dd-track-row:hover .dd-track-row__image--preview {
    opacity: 1;
  }
}
.dd-track-row__image-placeholder {
  border-radius: 10px;
}
.dd-track-row__identity {
  grid-column: 2;
  min-width: 0;
}
.dd-track-row__title { font-weight: 600; font-size: 14px; color: var(--ink); }
.dd-track-row__artist { font-size: 12px; color: #666; margin-top: 1px; }
.dd-track-row__description {
  grid-column: 2;
  font-size: 14px;
  color: #888;
  margin-top: 5px;
  line-height: 1.6;
}
.dd-track-row__description p { margin: 0; }
.dd-track-row__description p + p { margin-top: 10px; }
.dd-chart-peaks {
  padding-top: 8px;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  line-height: 1.45;
  color: #a16207;
  letter-spacing: .04em;
}
.dd-chart-peak {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 8px;
  white-space: nowrap;
}
.dd-chart-flag {
  display: inline-flex;
  width: 18px;
  height: 12px;
  overflow: hidden;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0,0,0,.14);
}
.dd-chart-flag svg {
  display: block;
  width: 18px;
  height: 12px;
}
.dd-track-row__genres {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}
.dd-track-row__genres span {
  font-size: 12px;
  padding: 2px 8px;
  background: rgba(194,65,12,.15);
  color: var(--orange);
  border-radius: 99px;
  font-family: 'DM Mono', monospace;
  letter-spacing: .06em;
}
.dd-track-row__label { font-family: 'DM Mono', monospace; font-size: 10px; color: #999; }
.dd-track-row__year { font-family: 'DM Mono', monospace; font-size: 11px; color: #aaa; text-align: center; }
.dd-track-row__bpm {
  font-family: 'DM Mono', monospace; font-size: 11px;
  color: #999; text-align: right; transition: color .15s;
}
.dd-track-row:hover .dd-track-row__bpm { color: var(--orange); }

.dd-tracklist__no-data { padding: 48px; }
.dd-tracklist__no-data p {
  font-family: 'DM Mono', monospace; font-size: 12px;
  color: #aaa; letter-spacing: .15em;
}

/* ── SINGLE VOLUME PAGE ───────────────────────── */
.dd-vol-hero {
  padding: 120px 48px 64px;
  background: var(--dark); position: relative; overflow: hidden;
}
.dd-vol-hero__bg {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(-52deg, transparent, transparent 80px, rgba(194,65,12,.03) 80px, rgba(194,65,12,.03) 81px);
}
.dd-vol-hero__content { position: relative; z-index: 2; }
.dd-vol-hero__back {
  font-family: 'DM Mono', monospace; font-size: 10px;
  letter-spacing: .15em; text-transform: uppercase;
  color: rgba(245,240,232,.4); text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
  margin-bottom: 32px; transition: color .2s;
}
.dd-vol-hero__back:hover { color: var(--orange); }
.dd-vol-hero__eyebrow {
  font-family: 'DM Mono', monospace; font-size: 10px;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--orange); margin-bottom: 12px;
}
.dd-vol-hero__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(64px, 12vw, 160px); line-height: .9;
  color: var(--cream); margin-bottom: 4px;
}
.dd-vol-hero__num { color: var(--orange); }
.dd-vol-hero__tagline {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(20px, 3vw, 40px);
  color: rgba(245,240,232,.25); letter-spacing: .1em; margin-bottom: 40px;
}
.dd-vol-hero__meta { display: flex; gap: 36px; flex-wrap: wrap; }
.dd-vol-hero__meta-item { }
.dd-vol-hero__meta-item strong {
  display: block; font-family: 'Bebas Neue', sans-serif;
  font-size: 28px; line-height: 1; color: var(--cream);
}
.dd-vol-hero__meta-item small {
  font-family: 'DM Mono', monospace; font-size: 9px;
  letter-spacing: .2em; text-transform: uppercase;
  color: rgba(245,240,232,.35);
}

/* ── FOOTER ───────────────────────────────────── */
.dd-footer {
  background: #0c0703; padding: 56px 48px 40px;
  border-top: 1px solid rgba(245,240,232,.05);
}
.dd-footer__top {
  display: flex; justify-content: space-between;
  align-items: flex-start; flex-wrap: wrap; gap: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(245,240,232,.05);
}
.dd-footer__logo {
  font-family: 'Bebas Neue', sans-serif; font-size: 32px;
  letter-spacing: .06em; color: var(--cream); text-decoration: none;
}
.dd-footer__logo span { color: var(--orange); }
.dd-footer__tagline { font-size: 13px; color: rgba(245,240,232,.3); margin-top: 6px; }
.dd-footer__links { display: flex; gap: 28px; flex-wrap: wrap; }
.dd-footer__links a {
  font-family: 'DM Mono', monospace; font-size: 10px;
  letter-spacing: .15em; text-transform: uppercase;
  color: rgba(245,240,232,.3); text-decoration: none; transition: color .2s;
}
.dd-footer__links a:hover { color: var(--orange); }
.dd-footer__bottom {
  display: flex; justify-content: space-between;
  align-items: center; flex-wrap: wrap; gap: 12px;
  padding-top: 28px;
  font-family: 'DM Mono', monospace; font-size: 10px;
  color: rgba(245,240,232,.2); letter-spacing: .1em;
}

/* ── VINYL SVG UTILITY ────────────────────────── */
.dd-vinyl { display: block; flex-shrink: 0; }
.dd-vinyl--spin { animation: spin 4s linear infinite; }
.dd-vinyl--slow  { animation: spin 8s linear infinite; }

/* ── RESPONSIVE ───────────────────────────────── */
@media (max-width: 860px) {
  .dd-nav { padding: 0 20px; }
  .dd-hero { padding: 100px 20px 72px; }
  .dd-hero__stats { flex-wrap: wrap; }
  .dd-hero__stat { min-width: 50%; border-right: none; border-bottom: 1px solid rgba(245,240,232,.06); }
  .dd-section, .dd-archive { padding: 64px 20px; }
  .dd-feat-grid { grid-template-columns: 1fr; }
  .dd-about { grid-template-columns: 1fr; gap: 48px; }
  .dd-about__visual { display: none; }
  .dd-vols-strip__head, .dd-vols-row { padding-left: 20px; padding-right: 20px; }
  .dd-footer { padding: 40px 20px 32px; }
  .dd-footer__top { flex-direction: column; }
  .dd-tracklist__header { padding: 32px 20px 24px; }
  .dd-tracklist__intro { padding: 20px 20px 24px; }
  .dd-track-table { padding: 0 20px 32px; }
  .dd-track-table__head,
  .dd-track-row { grid-template-columns: 32px 1fr; }
  .dd-track-row {
    align-items: flex-start;
    gap: 10px;
    padding: 16px 0 18px;
  }
  .dd-track-row__label,
  .dd-track-row__year,
  .dd-track-table__head :nth-child(3),
  .dd-track-table__head :nth-child(4),
  .dd-track-table__head :nth-child(5) { display: none; }
  .dd-track-row__bpm { display: none; }
  .dd-track-row__main { grid-column: 2; }
  .dd-track-row__main {
    display: block;
  }
  .dd-track-row__media {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .dd-track-row__image-stack,
  .dd-track-row__image,
  .dd-track-row__image-placeholder {
    width: 56px;
    height: 56px;
  }
  .dd-track-row__image-placeholder { display: none; }
  .dd-track-row__image-stack:has(.dd-track-row__image-placeholder:only-child) { display: none; }
  .dd-track-row__image { border-radius: 6px; }
  .dd-track-row__title { font-size: 15px; line-height: 1.2; }
  .dd-track-row__artist { font-size: 12px; }
  .dd-track-row__description {
    width: 100%;
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.65;
    color: #6d5946;
  }
  .dd-track-row__genres {
    width: 100%;
    margin-top: 10px;
  }
  .dd-vol-hero { padding: 100px 20px 48px; }
  .dd-vol-hero__meta { gap: 20px; }
}