/* V10: tighter section rhythm and watercolor-fibre textures on existing approved hills. */
.hero::after {background-image:url("/assets/textured-hills-mobile-v10.svg")}
.section-padding {padding-top:36px;padding-bottom:36px}
.listen-section.section-padding {padding-top:0;padding-bottom:18px}
.benefits-section {padding-top:8px;padding-bottom:28px}
.section-intro {margin-bottom:18px}
.narrow-center .section-title {margin-bottom:12px}
.step-grid {gap:10px}
.step-card {padding:18px 18px 19px}
.step-top {margin-bottom:8px}
.step-card h3 {margin-bottom:6px}
.song-grid {margin-top:17px;gap:10px}
.song-card {padding:18px}
.song-icon {width:46px;height:46px;border-radius:15px;font-size:2rem;margin-bottom:13px}
.song-card h3 {margin-bottom:6px}
.song-card p {margin-bottom:10px}
.faq-inner {gap:13px}
.closing-section {padding-top:45px;padding-bottom:48px}
.site-footer {padding-top:27px}
@media (max-width:559px) {
  .step-card {display:grid;grid-template-columns:47px minmax(0,1fr);column-gap:15px;row-gap:3px;align-items:start;padding:17px 17px}
  .step-top {grid-column:1;grid-row:1 / 3;margin:0;display:block}
  .step-top .step-number {width:41px;height:41px;border-radius:50%;display:grid;place-items:center;background:#E5EBDD;color:#60795E;font:500 1.35rem var(--serif)}
  .step-top .step-symbol {display:none}
  .step-card h3 {grid-column:2;grid-row:1;margin:0;font-size:1.35rem}
  .step-card p {grid-column:2;grid-row:2;margin:0;font-size:.84rem;line-height:1.5}
  .song-card {display:grid;grid-template-columns:51px minmax(0,1fr);grid-template-rows:auto auto auto;gap:3px 13px;align-items:start;padding:17px}
  .song-icon {grid-column:1;grid-row:1 / 4;margin:0}
  .song-card h3 {grid-column:2;grid-row:1;margin:0;font-size:1.35rem}
  .song-card p {grid-column:2;grid-row:2;margin:0;font-size:.83rem;line-height:1.5}
  .song-card a,.song-card .soon-tag {grid-column:2;grid-row:3;justify-self:start;margin-top:8px}
  .message-section h2 {margin-bottom:12px}
  .message-section p:last-child {line-height:1.6}
}
@media (min-width:560px) {
  .hero::after {background-image:url("/assets/textured-hills-desktop-v10.svg")}
  .section-padding {padding-top:45px;padding-bottom:45px}
  .benefits-section {padding-bottom:35px}
  .song-grid {gap:13px}
  .step-grid {gap:13px}
  .song-card {padding:21px}
  .step-card {padding:21px}
}
@media (min-width:850px) {
  .section-padding {padding-top:58px;padding-bottom:58px}
  .benefits-section {padding-bottom:49px}
  .song-card {padding:23px}
  .step-card {padding:24px}
  .song-grid {gap:15px}
  .step-grid {gap:15px}
}
