/* V11691 — Service catalog sample stability + smooth before/after interaction.
   Keeps dimensions fixed, avoids image pop/blink, and never animates layout geometry. */
html body.serviceCatalogPage #catalogCards .baCard,
html body.serviceCatalogPage #catalogCards .logoCatalogCard{
  contain:layout paint!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  transform:translateZ(0)!important;
  transition:box-shadow 220ms cubic-bezier(.2,.72,.25,1),
             border-color 220ms cubic-bezier(.2,.72,.25,1),
             background-color 220ms cubic-bezier(.2,.72,.25,1)!important;
}

html body.serviceCatalogPage #catalogCards .baSlider,
html body.serviceCatalogPage #catalogCards .logoSingleImageWrap{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  background:#fff!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
  transform:translateZ(0)!important;
}

/* Do not let partially-loaded before/after layers flash independently. */
html body.serviceCatalogPage #catalogCards .baSlider:not(.cimSampleReadyV11691) img,
html body.serviceCatalogPage #catalogCards .logoSingleImageWrap:not(.cimSampleReadyV11691) img{
  opacity:0!important;
}
html body.serviceCatalogPage #catalogCards .baSlider.cimSampleReadyV11691 img,
html body.serviceCatalogPage #catalogCards .logoSingleImageWrap.cimSampleReadyV11691 img{
  opacity:1!important;
  transition:opacity 240ms cubic-bezier(.2,.72,.25,1)!important;
}

/* Smooth slider reveal only; no size/position animation, so there is no jolt. */
html body.serviceCatalogPage #catalogCards .baSlider img.baAfter{
  will-change:clip-path!important;
  transition:clip-path 70ms linear,-webkit-clip-path 70ms linear,opacity 240ms cubic-bezier(.2,.72,.25,1)!important;
}
html body.serviceCatalogPage #catalogCards .baRange{
  accent-color:#0b67d1;
}

@media (hover:hover) and (pointer:fine){
  html body.serviceCatalogPage #catalogCards .baCard:hover,
  html body.serviceCatalogPage #catalogCards .logoCatalogCard:hover{
    transform:translateZ(0)!important;
    box-shadow:0 14px 32px rgba(7,43,88,.10)!important;
  }
}

@media (prefers-reduced-motion:reduce){
  html body.serviceCatalogPage #catalogCards .baCard,
  html body.serviceCatalogPage #catalogCards .logoCatalogCard,
  html body.serviceCatalogPage #catalogCards .baSlider img,
  html body.serviceCatalogPage #catalogCards .logoSingleImageWrap img{
    transition:none!important;
  }
}
