/* PLAY FIRST HERO ONLY: adopt the compact Classes first-section scale.
   Keep shoe physics, actual image, all subsequent Play sections untouched. */
body.compact-rhythm main > section.page-hero.play-shoes-hero {
  box-sizing:border-box;
  height:auto!important;
  min-height:clamp(455px,57svh,560px)!important;
  padding:clamp(30px,4vw,54px) var(--pad)!important;
  justify-content:center!important;
}
body.compact-rhythm main > section.play-shoes-hero > h1.co-overlay-title {
  font-size:clamp(56px,6vw,99px)!important;
  line-height:.89!important;
  letter-spacing:-.06em!important;
  max-width:57%!important;
  margin:12px 0 20px!important;
}
body.compact-rhythm main > section.play-shoes-hero > h1.co-overlay-title > .hand{
  margin:clamp(12px,1.3vw,18px) 0 0 auto!important;
  font-size:var(--co-fitted-hand,clamp(23px,2.35vw,37px))!important;
  line-height:1.12!important;
}
body.compact-rhythm main > section.play-shoes-hero > p{
  font-size:clamp(14px,1.3vw,19px)!important;
  line-height:1.42!important;
  margin:0!important;
  max-width:min(55%,560px)!important;
}
body.compact-rhythm main > section.play-shoes-hero > .hero-scribble{
  font-size:clamp(24px,2.8vw,39px);top:11%;right:5%;
}
@media(max-width:760px){
  body.compact-rhythm main > section.page-hero.play-shoes-hero {
    min-height:0!important;
    padding:30px var(--pad) 175px!important;
    justify-content:flex-start!important;
  }
  body.compact-rhythm main > section.play-shoes-hero > h1.co-overlay-title {
    font-size:clamp(58px,12.8vw,86px)!important;
    max-width:100%!important;
    margin:13px 0 18px!important;
  }
  body.compact-rhythm main > section.play-shoes-hero > p{
    font-size:15px!important;line-height:1.43!important;
    max-width:100%!important;
  }
  body.compact-rhythm main > section.play-shoes-hero > .hero-scribble{
    top:auto;right:6%;bottom:130px;font-size:25px;
  }
  body.compact-rhythm main > section.play-shoes-hero .play-shoes-added-photo {
    top:auto;right:15px;bottom:162px;width:clamp(100px,27vw,145px);
  }
}
/* Match the Classes hero more closely at intermediate and phone widths. */
@media(min-width:761px) and (max-width:1080px){
  body.compact-rhythm main > section.page-hero.play-shoes-hero{min-height:clamp(455px,53svh,520px)!important;}
}
@media(max-width:530px){
  body.compact-rhythm main > section.page-hero.play-shoes-hero{min-height:480px!important;}
  body.compact-rhythm main > section.play-shoes-hero .play-shoes-added-photo{
    top:auto!important;bottom:25px!important;right:14px!important;width:108px!important;
  }
}