/* skip-a-beat — curation project detail pages (v2 Editorial Contrast) */

.v2-proj { background: var(--paper); padding: 96px 0 128px; }
.v2-proj-desc { max-width: 44rem; font-size: 16px; line-height: 1.8; color: rgba(242,239,232,0.75); margin-top: 28px; }

.v2-proj-embed {
  position: relative; margin-top: 56px; aspect-ratio: 16/9; overflow: hidden;
  background-size: cover; background-position: center; background-color: var(--muted);
}
.v2-proj-embed::after {
  content: ''; position: absolute; inset: auto 0 0 0; height: 40%;
  background: linear-gradient(to top, rgba(15,14,12,0.75), transparent);
}
.v2-proj-embed-tag {
  position: absolute; left: 20px; bottom: 16px; z-index: 1;
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(242,239,232,0.85);
}

.v2-proj-back {
  display: inline-flex; align-items: center; gap: 8px; margin-bottom: 40px;
  font-size: 11px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted-fg);
  transition: color 0.3s;
}
.v2-proj-back:hover { color: var(--accent); }

.v2-proj-video { position: relative; margin-top: 56px; aspect-ratio: 16/9; overflow: hidden; background: var(--ink); }
.v2-proj-video iframe { width: 100%; height: 100%; border: 0; display: block; }

.v2-proj-native-video {
  position: relative; margin-top: 56px; overflow: hidden; background: var(--ink);
  display: flex; align-items: center; justify-content: center;
  max-height: 85vh;
}
.v2-proj-native-video video { width: 100%; height: 100%; max-height: 85vh; object-fit: contain; display: block; }

.v2-proj-carousel {
  margin-top: 56px; display: flex; gap: 12px; overflow-x: auto;
  scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none;
}
.v2-proj-carousel::-webkit-scrollbar { display: none; }
.v2-proj-carousel img {
  flex: 0 0 240px; width: 240px; scroll-snap-align: start; aspect-ratio: 4/5;
  object-fit: cover; background: var(--muted);
}
@media (min-width: 768px) { .v2-proj-carousel img { flex-basis: 300px; width: 300px; } }

.v2-proj-body { margin-top: 48px; max-width: 44rem; }
.v2-proj-body p { font-size: 16px; line-height: 1.85; color: var(--ink); opacity: 0.85; }
.v2-proj-body p + p { margin-top: 24px; }

.v2-rbp-grid { margin-top: 24px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (min-width: 640px) { .v2-rbp-grid { grid-template-columns: repeat(4, 1fr); } }
.v2-page a.v2-rbp-card { display: block; }
.v2-rbp-thumb { aspect-ratio: 1/1; overflow: hidden; background: var(--muted); }
.v2-rbp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.4s var(--ease, ease); }
.v2-rbp-card:hover .v2-rbp-thumb img { transform: scale(1.05); }
.v2-rbp-song { margin-top: 12px; font-size: 14px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink); }
.v2-rbp-artist { margin-top: 2px; font-size: 12px; color: var(--muted-fg); }

.v2-proj-credits { margin-top: 24px; padding-left: 20px; border-left: 2px solid var(--accent); }
.v2-proj-credits p { font-size: 14px; line-height: 1.7; color: var(--muted-fg); }
.v2-proj-credits p + p { margin-top: 8px; }
.v2-proj-credits strong { color: var(--ink); font-weight: 700; }

.v2-mc-list { margin-top: 56px; display: flex; flex-direction: column; gap: 4px; max-height: 900px; overflow-y: auto; border-top: 1px solid var(--rule); }
.v2-mc-item { padding-top: 16px; border-bottom: 1px solid var(--rule); }
.v2-mc-title { padding-bottom: 10px; font-size: 13px; font-weight: 600; letter-spacing: -0.01em; }
.v2-page a.v2-mc-title, .v2-mc-title a { color: var(--ink); transition: color 0.3s; }
.v2-mc-title a:hover { color: var(--accent); }
.v2-mc-item iframe { width: 100%; height: 120px; border: 0; display: block; }

.v2-page a.v2-proj-listen {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 32px;
  padding: 16px 24px; background: var(--ink); color: var(--paper);
  font-size: 12px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
  transition: background 0.3s;
}
.v2-proj-listen:hover { background: var(--accent); }
.v2-proj-listen svg { width: 14px; height: 14px; flex-shrink: 0; }