.listening-gallery{padding:90px 0}.listening-intro{max-width:720px;margin-bottom:40px}.listening-intro h2{font:900 clamp(60px,7vw,96px)/.9 var(--condensed);text-transform:uppercase;margin:20px 0}.listening-intro p{line-height:1.7;color:var(--muted)}
.demo-card{display:grid;grid-template-columns:1fr 1fr;min-height:340px;margin-bottom:28px;background:linear-gradient(145deg,#20170f,#100d0a);border:1px solid #594632;overflow:hidden}
.demo-card>img{width:100%;height:100%;min-height:340px;object-fit:cover}.demo-card:nth-child(even)>img{order:2}
.demo-card[data-demo="dispatch"]>img{object-position:right center}
.demo-copy{padding:clamp(24px,4vw,56px);align-self:center}.demo-copy h3{font:900 clamp(36px,4vw,60px)/1 var(--condensed);text-transform:uppercase;margin:16px 0}.demo-copy>p:not(.kicker){color:var(--muted);line-height:1.7}
.demo-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:24px}.demo-recall{display:grid;gap:10px;min-width:0;text-align:left;padding:15px 16px;background:#0d0b09;border:1px solid #7d6247;color:var(--cream);cursor:pointer;font:700 18px/1.1 var(--condensed);letter-spacing:.03em}.demo-recall span{font:10px/1.35 var(--mono);color:#aa9378}.demo-recall b{font-weight:800}.demo-recall:hover,.demo-recall[aria-pressed=true]{border-color:var(--orange);color:var(--orange);background:#2a190d}.demo-recall:focus-visible{outline:2px solid var(--orange);outline-offset:4px}.demo-comparison .demo-recall:nth-child(3){grid-column:1/-1}.demo-status{display:block;min-height:20px;margin-top:12px;font:11px var(--mono);color:var(--muted)}.demo-card.is-playing{border-color:var(--orange)}
@media(max-width:700px){.demo-card{grid-template-columns:1fr}.demo-card:nth-child(even)>img{order:0}.demo-card>img{height:240px;min-height:0}.demo-copy{padding:24px}}
@media(max-width:410px){.demo-comparison{grid-template-columns:1fr}.demo-comparison .demo-recall:nth-child(3){grid-column:auto}}