/* Song Demos v3 — compact horizontal iPhone cards matching approved mockup.
   The player is INSIDE the text column, not a row beneath both columns.
   Existing deskop photo-led cards and hero artwork are preserved. */
@media (max-width: 700px) {
  .demos-collection .song-demo-grid { gap:12px; }
  .demos-collection .song-demo-card {
    display:grid;
    grid-template-columns:minmax(0,39%) minmax(0,1fr);
    grid-template-areas:"photo content" "photo player";
    grid-template-rows:minmax(0,1fr) auto;
    column-gap:11px;
    row-gap:0;
    padding:10px;
    border-radius:19px;
    min-height:0;
    overflow:hidden;
    align-items:stretch;
  }
  .demos-collection .song-demo-photo {
    grid-area:photo;
    align-self:stretch;
    display:block;
    width:100%;
    height:100%;
    min-height:0;
    object-fit:cover;
    object-position:center;
    border-radius:12px;
  }
  .demos-collection .song-card-content {
    grid-area:content;
    min-width:0;
    padding:4px 0 0;
  }
  .demos-collection .song-category {
    font-size:.61rem;
    line-height:1.2;
    letter-spacing:.12em;
    margin:0 0 3px;
  }
  .demos-collection .song-card-content h2 {
    font-size:clamp(1.22rem,4.9vw,1.68rem);
    line-height:1.08;
    letter-spacing:-.042em;
    margin:0 0 5px;
  }
  .demos-collection .song-story {
    font-size:.735rem;
    line-height:1.37;
    margin:0 0 6px;
    max-width:none;
  }
  .demos-collection .song-dedication {
    font-size:.735rem;
    line-height:1.27;
    margin:0 0 2px;
  }
  .demos-collection .song-listening {
    grid-area:player;
    min-width:0;
    padding:5px 0 2px;
    margin:0;
  }
  .demos-collection .song-track-caption {
    font-size:.60rem;
    line-height:1.23;
    margin:0 0 5px;
    letter-spacing:0;
  }
  .demos-collection .demo-audio-player {
    display:flex;
    gap:7px;
    min-height:40px;
    padding:3px 6px 3px 3px;
    border-radius:30px;
    width:100%;
    min-width:0;
  }
  .demos-collection .demo-audio-player .play-button {
    width:34px;
    height:34px;
    flex:0 0 34px;
  }
  .demos-collection .demo-audio-player .play-button svg { width:16px; height:16px; }
  .demos-collection .demo-audio-player .audio-details {
    min-width:0;
    display:flex;
    flex:1 1 0;
    gap:5px;
  }
  .demos-collection .demo-audio-player .waveform-shell,
  .demos-collection .demo-audio-player .waveform-bars {
    height:24px;
    min-width:0;
  }
  .demos-collection .demo-audio-player .waveform-bars { gap:1px; }
  .demos-collection .demo-audio-player .waveform-bars span {
    min-width:1px;
    max-width:3px;
  }
  .demos-collection .demo-audio-player .waveform-bars span:nth-child(n+25) { display:none; }
  .demos-collection .demo-audio-player .audio-progress { height:24px; }
  .demos-collection .demo-audio-player .audio-progress::-webkit-slider-runnable-track { height:24px; }
  .demos-collection .demo-audio-player .audio-progress::-webkit-slider-thumb {
    width:10px;
    height:10px;
    margin-top:7px;
  }
  .demos-collection .demo-audio-player .audio-times {
    min-width:52px;
    gap:2px;
    font-size:.64rem;
    line-height:1;
    letter-spacing:-.02em;
  }
}
@media (max-width:359px) {
  .demos-collection .song-demo-card {
    grid-template-columns:minmax(0,37%) minmax(0,1fr);
    column-gap:9px;
    padding:8px;
  }
  .demos-collection .song-card-content h2 { font-size:1.17rem; }
  .demos-collection .song-story { font-size:.70rem; line-height:1.33; }
  .demos-collection .song-dedication { font-size:.69rem; }
  .demos-collection .demo-audio-player { gap:4px; padding-right:4px; }
  .demos-collection .demo-audio-player .play-button { width:31px; height:31px; flex-basis:31px; }
  .demos-collection .demo-audio-player .audio-times { min-width:50px; font-size:.60rem; }
  .demos-collection .demo-audio-player .waveform-bars span:nth-child(n+19) { display:none; }
}
