/* ix.ua organizations hero v189
   Wide low artwork with a soft left fade, matching the newer account banners. */

.org-directory-hero{
  position:relative!important;
  min-height:176px!important;
  padding:26px 28px!important;
  overflow:hidden!important;
  border:1px solid #d7e9e7!important;
  border-radius:14px!important;
  background:linear-gradient(105deg,#f1faf8 0%,#fffdfa 60%,#f6fbfa 100%)!important;
}

.org-directory-hero>div{
  position:relative!important;
  z-index:3!important;
  width:49%!important;
  max-width:560px!important;
  min-width:0!important;
}

.org-directory-hero>img{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  border-radius:0!important;
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    transparent 14%,
    rgba(0,0,0,.12) 23%,
    rgba(0,0,0,.48) 38%,
    #000 54%,
    #000 100%)!important;
  mask-image:linear-gradient(90deg,
    transparent 0%,
    transparent 14%,
    rgba(0,0,0,.12) 23%,
    rgba(0,0,0,.48) 38%,
    #000 54%,
    #000 100%)!important;
}

.org-directory-hero:after{
  content:"";
  position:absolute;
  z-index:2;
  inset:0 auto 0 0;
  width:56%;
  pointer-events:none;
  background:linear-gradient(90deg,
    rgba(255,253,250,1) 0%,
    rgba(255,253,250,.98) 56%,
    rgba(255,253,250,.75) 75%,
    rgba(255,253,250,0) 100%);
}

@media (max-width:900px){
  .org-directory-hero>div{width:57%!important}
  .org-directory-hero:after{width:64%}
}

@media (max-width:650px){
  .org-directory-hero{
    min-height:148px!important;
    padding:20px!important;
  }
  .org-directory-hero>div{
    width:78%!important;
    max-width:none!important;
  }
  .org-directory-hero>img{
    opacity:.32!important;
    object-position:64% center!important;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 20%,#000 56%)!important;
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 20%,#000 56%)!important;
  }
  .org-directory-hero:after{
    width:78%;
    background:linear-gradient(90deg,
      rgba(255,253,250,.98) 0%,
      rgba(255,253,250,.89) 58%,
      rgba(255,253,250,0) 100%);
  }
}