<div class="ipod-group">
  <div class="ipod">
    <div class="ipod-wheel"></div>
  </div>

  <!-- Earbud cables within the group container -->
  <svg
    class="ipod-cables hidden-lg-down"
    viewBox="0 0 150 100"
    style="overflow: visible"
  >
    <defs>
      <linearGradient id="cableGradient" x1="0%" y1="0%" x2="100%" y2="100%">
        <stop offset="0%" style="stop-color: #6b4fb3" />
        <stop offset="100%" style="stop-color: #4169e1" />
      </linearGradient>
    </defs>

    <path
      d="M 85,3 C 85,-12 75,-22 55,-22 C 35,-22 25,-15 25,0 C 25,15 28,35 32,50 L 35,65"
      stroke="url(#cableGradient)"
      stroke-width="2.5"
      fill="none"
      stroke-linecap="round"
    />

    <path
      d="M 35,65 C 28,72 20,82 5,88"
      stroke="url(#cableGradient)"
      stroke-width="1.8"
      fill="none"
      stroke-linecap="round"
    />

    <path
      d="M 35,65 C 55,73 95,82 125,83"
      stroke="url(#cableGradient)"
      stroke-width="1.8"
      fill="none"
      stroke-linecap="round"
    />
  </svg>

  <div class="earbud earbud-left hidden-lg-down"></div>
  <div class="earbud earbud-right hidden-lg-down"></div>
</div>
