/* My Rhythm hero.
   The .rhy-header was a dark navy gradient band built for white text. The artwork is
   cream and carries its own copy, so the band becomes a light frame and the Back button
   and CTAs are re-toned dark-on-light so they stay visible. */
#page-rhythm .rhy-header,
#page-rhythm-public .rhy-header{
  background:#FBF6EC !important;
  padding:20px 24px 26px !important;
  text-align:center;
}
#page-rhythm .rhy-hero-img,
#page-rhythm-public .rhy-hero-img{
  max-width:1180px; margin:0 auto;
}
#page-rhythm .rhy-hero-img img,
#page-rhythm-public .rhy-hero-img img{
  display:block; width:100%; height:auto; border-radius:22px;
  box-shadow:0 14px 34px rgba(51,64,47,.10);
}
/* Back button: was white-on-navy, invisible on cream */
#page-rhythm .rhy-header > button:first-child,
#page-rhythm-public .rhy-header > button:first-child{
  background:#243447 !important;
  border:none !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important;
  float:left;
  box-shadow:0 6px 16px rgba(36,52,71,.22);
}
/* Hero CTAs sit under the artwork on cream */
#page-rhythm .rhy-header .mbr-hero-cta,
#page-rhythm-public .rhy-header .mbr-hero-cta{
  display:flex; gap:10px; justify-content:center; flex-wrap:wrap;
  margin-top:18px; clear:both;
}
#page-rhythm .rhy-header .mbr-btn.mbr-btn-light,
#page-rhythm-public .rhy-header .mbr-btn.mbr-btn-light{
  background:#5E7E57 !important; border-color:#5E7E57 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important;
}
#page-rhythm .rhy-header .mbr-btn.mbr-btn-ghost,
#page-rhythm-public .rhy-header .mbr-btn.mbr-btn-ghost{
  background:#fff !important; border:1.5px solid #EAE2D4 !important;
  color:#5E7E57 !important; -webkit-text-fill-color:#5E7E57 !important;
}
@media (max-width:640px){
  #page-rhythm .rhy-header,
  #page-rhythm-public .rhy-header{ padding:14px 12px 20px !important; }
  #page-rhythm .rhy-hero-img img,
  #page-rhythm-public .rhy-hero-img img{ border-radius:16px; }
  #page-rhythm .rhy-header .mbr-hero-cta .mbr-btn,
  #page-rhythm-public .rhy-header .mbr-hero-cta .mbr-btn{ width:100%; }
}