/* v6.9.356 — keep the two desktop hero side panels centred to the golden stage
   at every desktop zoom level, without moving the carousel or background. */

@media (min-width:1181px){
  /* Undo the old viewport-percentage vertical offsets. They were applied to
     relative grid items, which made the panels drift down as the viewport grew. */
  .hero#home .hero-copy,
  .hero#home .hero-feature-panel.showroom-v199{
    top:auto!important;
    margin-top:0!important;
    align-self:center!important;
    transform:translateY(-18px)!important;
  }

  /* Keep the existing three-column composition, but cap its desktop width to
     the same visual footprint as the 1760px golden stage. Browser zoom-out now
     adds empty space outside the composition instead of stretching the middle
     column and pushing the side panels away/off-screen. */
  .hero#home{
    grid-template-columns:minmax(270px,320px) minmax(620px,980px) minmax(285px,325px)!important;
    justify-content:center!important;
  }

  .hero#home .hero-copy{
    justify-self:start!important;
  }

  .hero#home .hero-feature-panel.showroom-v199{
    justify-self:end!important;
  }
}

/* On very wide CSS viewports (including 80%, 75%, 67% browser zoom), keep the
   exact same centred composition rather than letting a legacy wide-screen rule
   reposition the panels. */
@media (min-width:2200px){
  .hero#home .hero-copy,
  .hero#home .hero-feature-panel.showroom-v199{
    top:auto!important;
    transform:translateY(-18px)!important;
  }
}

/* Preserve the site's existing tablet/mobile stacked behaviour. */
@media (max-width:1180px){
  .hero#home .hero-copy,
  .hero#home .hero-feature-panel.showroom-v199{
    top:auto!important;
    transform:none!important;
  }
}