/* V13: simplify the path from hero into the real demo.
   Keep only the three approved compact benefit symbols below the player. */
.hero-actions{gap:0}
.listen-intro{margin-bottom:13px}
.listen-section.section-padding{padding-bottom:0}
.benefits-section{
  padding-top:12px;
  padding-bottom:24px;
}
.benefit-grid{max-width:690px}
.benefit-icon{height:28px;font-size:1.4rem}
.benefit h3{margin-top:5px}
@media(max-width:559px){
  .hero-actions{margin-bottom:0}
  .listen-intro .section-title{font-size:1.76rem}
  .listen-section .demo-card{margin-bottom:0}
  .benefits-section{padding-top:14px;padding-bottom:25px}
  .benefit{padding:0 6px}
  .benefit-icon{height:27px;font-size:1.36rem}
  .benefit h3{font-size:.70rem;line-height:1.25;margin-top:4px}
  .benefit:not(:last-child)::after{height:27px;top:10px}
}
@media(min-width:560px){
  .listen-intro{margin-bottom:17px}
  .benefits-section{padding-top:17px;padding-bottom:30px}
}
@media(min-width:850px){
  .benefits-section{padding-top:19px;padding-bottom:34px}
}
