/* JLVD MUSIC v0.8 — spinning vinyl inspired by the sliding record interaction.
   Scoped to header/footer branding only: no effect on hero and physical vinyl. */
.jlvd-vinyl-mark {
  --vinyl-cover-size: 72px;
  position: relative;
  display: block;
  width: calc(var(--vinyl-cover-size) * 1.43);
  height: var(--vinyl-cover-size);
  flex: 0 0 auto;
  overflow: visible;
  isolation: isolate;
}
.jlvd-vinyl-disc-runner {
  position: absolute;
  z-index: 1;
  top: 2.5%;
  left: 2.5%;
  width: calc(var(--vinyl-cover-size) * .95);
  aspect-ratio: 1;
  animation: jlvd-brand-disc-out 1.25s cubic-bezier(.15,.78,.18,1) .15s both;
}
.jlvd-vinyl-disc {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background:
    radial-gradient(ellipse 22% 15% at 30% 22%, rgba(255,255,255,.18), transparent 95%),
    repeating-radial-gradient(circle at center, transparent 0 3px, rgba(255,255,255,.095) 4px 4.7px, transparent 5.3px 9px),
    conic-gradient(from 5deg, #090909 0deg, #353535 28deg, #101010 60deg, #222 92deg, #050505 125deg, #292929 169deg, #0c0c0c 218deg, #333 255deg, #0b0b0b 300deg, #252525 336deg, #090909 360deg);
  border: 1px solid #414141;
  box-shadow: 4px 5px 17px #000c, inset 0 0 0 2px #070707, inset 0 0 14px #000;
  animation: jlvd-brand-disc-spin 5s linear infinite;
}
.jlvd-vinyl-disc::before {
  content: '';
  position: absolute;
  inset: 35%;
  border-radius: 50%;
  background: radial-gradient(circle at center,
    #060606 0 6%, #bcb7ad 6.3% 9%, #33312f 9.5% 54%, #77716a 54.5% 57%, #111 58%);
  box-shadow: inset 0 0 7px #0008, 0 0 0 1px #000;
}
.jlvd-vinyl-disc::after {
  content: '';
  position: absolute;
  inset: 3%;
  border-radius: 50%;
  border: 1px solid #ffffff20;
  box-shadow: inset 0 0 1px #ffffff30;
}
.jlvd-vinyl-sleeve {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  display: block;
  width: var(--vinyl-cover-size);
  height: var(--vinyl-cover-size);
  overflow: hidden;
  background: #0d0d0d;
  border: 1px solid #565656;
  border-radius: 2px;
  box-shadow: 3px 5px 15px #000a, inset 0 0 4px #fff2;
}
/* More specific than the legacy `.brand img` rule. */
.jlvd-vinyl-mark .jlvd-vinyl-sleeve img,
.brand .jlvd-vinyl-mark .jlvd-vinyl-sleeve img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  max-width: none;
  border: 0;
}
@keyframes jlvd-brand-disc-out {
  from { transform: translateX(0); }
  to { transform: translateX(42%); }
}
@keyframes jlvd-brand-disc-spin {
  to { transform: rotate(360deg); }
}
/* Header brand remains a single home link and never overlaps navigation. */
.site-header .brand {
  gap: 10px;
  min-width: 295px;
  flex: 0 0 auto;
  overflow: visible;
}
.site-header .brand-text {
  position: relative;
  z-index: 3;
}
.site-header .header-row { gap: 20px; }
.site-header .nav { gap: clamp(12px, 2vw, 30px); }
/* Footer artwork uses the existing home VINYL/featured-release settings. */
.jlvd-footer-brand-row {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-bottom: 21px;
}
.jlvd-footer-vinyl-link {
  display: block;
  flex: 0 0 auto;
  line-height: 0;
  text-decoration: none;
}
.jlvd-footer-vinyl-link .jlvd-vinyl-mark { --vinyl-cover-size: 132px; }
.jlvd-footer-brand-row .footer-logo {
  width: min(100%, 136px);
  max-height: 120px;
  height: auto;
  margin: 0;
  object-fit: contain;
  flex: 0 1 auto;
}
.jlvd-footer-identity > p { max-width: 390px; }
@media (max-width: 1230px) {
  .site-header .brand { min-width: 272px; gap: 8px; }
  .site-header .brand .jlvd-vinyl-mark { --vinyl-cover-size: 60px; }
  .site-header .brand-text { font-size: 37px; }
  .site-header .header-row { gap: 13px; }
  .site-header .nav { gap: 13px; }
}
@media (max-width: 900px) {
  .site-header .brand { min-width: auto; }
  .site-header .brand .jlvd-vinyl-mark { --vinyl-cover-size: 50px; }
  .site-header .brand-text { font-size: 29px; }
  .site-header .brand-text small { font-size: 8px; letter-spacing: .18em; }
  .site-header .header-note { display: none; }
  .jlvd-footer-brand-row { gap: 25px; }
  .jlvd-footer-vinyl-link .jlvd-vinyl-mark { --vinyl-cover-size: 106px; }
}
@media (max-width: 480px) {
  .site-header .brand { gap: 8px; }
  .site-header .brand .jlvd-vinyl-mark { --vinyl-cover-size: 44px; }
  .site-header .brand-text { font-size: 25px; }
  .site-header .brand-text small { font-size: 7px; letter-spacing: .15em; }
  .site-header .header-row { gap: 5px; }
  .site-header .header-right { gap: 5px; }
  .site-header .header-right .btn.slim { min-height: 34px; padding: 8px; font-size: 9px; }
  .site-header .menu-toggle { margin-left: 2px; }
  .jlvd-footer-brand-row { gap: 18px; }
  .jlvd-footer-vinyl-link .jlvd-vinyl-mark { --vinyl-cover-size: 91px; }
  .jlvd-footer-brand-row .footer-logo { max-width: 96px; }
}
@media (prefers-reduced-motion: reduce) {
  .jlvd-vinyl-disc-runner { animation: none; transform: translateX(42%); }
  .jlvd-vinyl-disc { animation: none; }
}