/* DIGITAL ANALOG ARTS — All original vector artwork and illustration styling.
   Illustrations are self-contained SVGs with viewBox coordinates; every reel,
   tape guide and line scales as one unit when the page changes size.
   DO NOT add fixed-pixel positioning of a tape line relative to a CSS reel. */

.illustration-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

/* Hero machine illustration */
.hero-art {
  position: relative;
  width: 100%;
  max-width: 610px;
  height: auto;
  aspect-ratio: 940 / 570;
  margin-inline: auto;
  transform: rotate(-2deg);
  filter: drop-shadow(0 32px 55px rgba(0,0,0,.40));
  min-width: 0;
}
.hero-machine-svg { filter: saturate(.92); }

/* Vinyl in the Music section */
.record-illustration {
  width: min(100%, 310px);
  aspect-ratio: 1;
  margin-inline: auto;
  filter: drop-shadow(0 18px 32px rgba(0,0,0,.35));
}

/* Analog VU meter rack */
.meters-illustration {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(12px, 3vw, 24px);
  min-width: 0;
  min-height: 0;
  background: radial-gradient(circle at 50% 30%, #343e33, #1a211b 70%);
}
.meter-svg { width: 100%; height: auto; }

/* Restoration cards */
.tile-art,
.three-up .tile-art {
  height: auto;
  aspect-ratio: 600 / 340;
  min-width: 0;
  display: block;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 30%, #29352b 0, #161d17 78%);
}
.tile-art .illustration-svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 950px) {
  .hero-art { width: min(100%, 560px); }
}
@media (max-width: 690px) {
  .hero-art { height: auto; aspect-ratio: 940 / 570; }
  .tile-art, .three-up .tile-art { height: auto; }
  .meters-illustration { padding: 12px; }
}