/* Canonical managed-banner frame.
   The banner follows the artwork ratio instead of the viewport height so the
   next section can enter the first screen on taller devices. */
@media (min-width:761px){
  body.home-page .hero.hero-slider,
  body.managed-banner-page .hero.hero-slider,
  body.bullion-page .bullion-managed-banner{
    box-sizing:border-box!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:12 / 5!important;
    overflow:hidden!important;
  }
}

@media (max-width:760px){
  body.home-page .hero.hero-slider,
  body.managed-banner-page .hero.hero-slider,
  body.bullion-page .bullion-managed-banner{
    box-sizing:border-box!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:3 / 4!important;
    overflow:hidden!important;
  }
}

body.home-page .hero.hero-slider .hero-slides,
body.home-page .hero.hero-slider .hero-slide,
body.managed-banner-page .hero.hero-slider .hero-slides,
body.managed-banner-page .hero.hero-slider .hero-slide,
body.bullion-page .bullion-managed-banner .hero-slides,
body.bullion-page .bullion-managed-banner .hero-slide{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
}

body.home-page .hero.hero-slider .hero-slide,
body.managed-banner-page .hero.hero-slider .hero-slide,
body.bullion-page .bullion-managed-banner .hero-slide{
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}

body.home-page .hero.hero-slider .hero-slide>video,
body.managed-banner-page .hero.hero-slider .hero-slide>video,
body.bullion-page .bullion-managed-banner .hero-slide>video{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}

/* Manual offsets remain useful, but the complete copy group must stay inside
   the visible banner safe area after the frame becomes shorter. */
@media (min-width:761px){
  body.home-page .hero.hero-slider.content-placement-manual .hero-copy-group,
  body.managed-banner-page .hero.hero-slider.content-placement-manual .hero-copy-group{
    transform:translate(
      var(--managed-copy-offset-x,0%),
      var(--managed-copy-offset-y,0%)
    )!important;
  }
}

@media (max-width:760px){
  body.home-page .hero.hero-slider.content-placement-manual .hero-copy-group,
  body.managed-banner-page .hero.hero-slider.content-placement-manual .hero-copy-group{
    transform:translate(
      var(--managed-copy-offset-x,0%),
      var(--managed-copy-offset-y,0%)
    )!important;
  }
}