/* Shared product-media component. The page-specific file only supplies media URLs. */
.po-solution__image--video{
  position:relative;
  overflow:hidden;
  background:#d9ddda;
}

.po-solution__image--video .po-solution__video{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  min-width:100%;
  min-height:100%;
  object-fit:cover;
  object-position:center;
  background:#d9ddda;
}

.po-solution__image--video .po-solution__video-toggle{
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:2;
  display:grid;
  width:44px;
  height:44px;
  padding:0;
  place-items:center;
  border:1px solid rgba(255,255,255,.72);
  border-radius:50%;
  background:rgba(25,39,35,.72);
  color:#fff;
  font:600 16px/1 Arial,sans-serif;
  cursor:pointer;
  box-shadow:0 6px 20px rgba(16,28,24,.18);
  transition:background-color .22s cubic-bezier(.32,.72,.28,1),border-color .22s cubic-bezier(.32,.72,.28,1),transform .22s cubic-bezier(.32,.72,.28,1);
}

.po-solution__image--video .po-solution__video-toggle:hover{
  border-color:#fff;
  background:rgba(25,39,35,.9);
}

.po-solution__image--video .po-solution__video-toggle:active{transform:scale(.96)}
.po-solution__image--video .po-solution__video-toggle:focus-visible{outline:3px solid rgba(166,109,61,.72);outline-offset:3px}

@media(max-width:640px){
  .po-solution__image--video .po-solution__video-toggle{right:12px;bottom:12px}
}

@media(prefers-reduced-motion:reduce){
  .po-solution__image--video .po-solution__video-toggle{display:none;transition:none}
}