/* Photo-based landscape, compact demo, natural tree — revision 2 */
.hero {
  padding-bottom: 166px;
  isolation: isolate;
  background: radial-gradient(ellipse at 80% 70%, rgba(226,162,127,.16),transparent 55%),var(--cream);
}
.hero::after {
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:1;
  left:0;right:0;bottom:-12px;
  height:344px;
  background-image:linear-gradient(to bottom,rgba(245,239,230,.88) 0%,rgba(245,239,230,.33) 36%,rgba(245,239,230,.10) 75%,rgba(245,239,230,.55) 100%),url("/assets/hero-hills-mobile.webp");
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 26%,#000 81%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 26%,#000 81%,transparent 100%);
}
.hero-copy{position:relative;z-index:3}
.listen-section{
  position:relative;
  z-index:2;
  padding-top:0;
  padding-bottom:30px;
  margin-top:-45px;
}
.demo-card{
  max-width:820px;
  display:grid;
  grid-template-columns:97px minmax(0,1fr);
  gap:13px;
  align-items:center;
  padding:12px;
  border-radius:21px;
  box-shadow:0 10px 28px rgba(64,55,48,.10);
}
.demo-art{height:122px;min-height:0;aspect-ratio:auto;border-radius:12px;overflow:hidden}
.demo-art img{height:100%;width:100%;object-fit:cover;object-position:42% 50%}
.demo-body{padding:0;min-width:0}
.demo-body .small-label{font-size:.56rem;margin-bottom:3px;letter-spacing:.12em}
.demo-body h2{font-size:clamp(1.17rem,4.7vw,1.8rem);line-height:1.12;margin-bottom:5px;letter-spacing:-.04em}
.demo-body > p:not(.small-label){
 font-size:.75rem;
 line-height:1.39;
 margin:0;
 display:-webkit-box;
 -webkit-line-clamp:3;
 -webkit-box-orient:vertical;
 overflow:hidden;
}
.audio-player{margin-top:8px;gap:10px}
.play-button{width:36px;height:36px;min-width:36px}
.play-button svg{width:16px;height:16px}
.audio-progress{height:6px}
.audio-times{font-size:.65rem}
.demo-body p.demo-note{display:none}
.benefits-section{padding-top:15px;padding-bottom:54px}
@media(min-width:560px){
 .hero{padding-bottom:180px}
 .hero::after{
   height:375px;
   background-image:linear-gradient(to bottom,rgba(245,239,230,.9) 0%,rgba(245,239,230,.28) 44%,rgba(245,239,230,.12) 76%,rgba(245,239,230,.58) 100%),url("/assets/hero-hills.webp");
   background-position:center 49%;
 }
 .listen-section{margin-top:-57px}
 .demo-card{grid-template-columns:124px minmax(0,1fr);gap:17px;padding:12px;max-width:780px}
 .demo-art{height:133px;min-height:0}
 .demo-body{padding:0}
 .demo-body h2{font-size:1.55rem}
 .demo-body>p:not(.small-label){font-size:.79rem;line-height:1.45;-webkit-line-clamp:2}
 .audio-player{margin-top:10px}
 .play-button{width:40px;height:40px}
}
@media(min-width:850px){
 .hero{padding-top:80px;padding-bottom:190px}
 .hero::after{height:440px;background-position:center 53%}
 .listen-section{margin-top:-60px;padding-top:0;padding-bottom:40px}
 .demo-card{grid-template-columns:141px minmax(0,1fr);gap:20px;padding:14px;max-width:825px}
 .demo-art{height:138px;min-height:0}
 .demo-body{padding:0 5px 0 0}
 .demo-body .small-label{font-size:.61rem}
 .demo-body h2{font-size:1.65rem;margin-bottom:6px}
 .demo-body>p:not(.small-label){font-size:.83rem;line-height:1.45;-webkit-line-clamp:2}
 .audio-player{margin-top:12px;gap:13px}
 .benefits-section{padding-bottom:85px}
}