.pbm-wrap{
  --pbm-accent:#008c48;
  --pbm-border:rgba(0,0,0,.35);
  --pbm-bg:#fff;
  --pbm-title:#4a4a4a;
  --pbm-text:#6b6b6b;

  display:grid;
  grid-template-columns:minmax(240px,.9fr) minmax(320px,1.1fr);
  gap:36px;
  align-items:stretch;
}
@media(max-width:1024px){ .pbm-wrap{grid-template-columns:1fr;} }

.pbm-media{
  position:relative;
  width:100%;
  height:100%;
  min-height:360px;
  overflow:hidden;
  background:#f3f3f3;
}
@media(max-width:1024px){ .pbm-media{min-height:260px;} }

.pbm-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
.pbm-media__placeholder{position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,0,0,.05),rgba(0,0,0,.02));}

.pbm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;}
@media(max-width:640px){ .pbm-grid{grid-template-columns:1fr;} }

.pbm-card{position:relative;background:transparent;border:0;padding:0;margin:0;min-width:0;}
.pbm-card__inner{
  position:relative;background:var(--pbm-bg);
  border:1px solid var(--pbm-border);
  padding:24px 26px 22px;
  height:100%;
  overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.pbm-card:hover .pbm-card__inner,.pbm-card:focus .pbm-card__inner{
  border-color:rgba(0,0,0,.12);
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

.pbm-icon{width:52px;height:52px;margin-bottom:12px;display:flex;align-items:center;justify-content:center;}
.pbm-icon img{width:52px;height:52px;object-fit:contain;}

.pbm-title{margin:0 0 10px 0;font-size:18px;line-height:1.25;color:var(--pbm-title);}
.pbm-text{margin:0;font-size:14px;line-height:1.55;color:var(--pbm-text);}

/* thinner animated border lines */
.pbm-line{position:absolute;background:var(--pbm-accent);opacity:0;transition:opacity .15s ease;pointer-events:none;}
.pbm-line--top,.pbm-line--bottom{height:1px;width:100%;left:0;transform:translateX(-105%);}
.pbm-line--top{top:0;}
.pbm-line--bottom{bottom:0;transform:translateX(105%);}
.pbm-line--left,.pbm-line--right{width:1px;height:100%;top:0;transform:translateY(105%);}
.pbm-line--left{left:0;}
.pbm-line--right{right:0;transform:translateY(-105%);}

.pbm-card:hover .pbm-line,.pbm-card:focus .pbm-line{opacity:1;}
.pbm-card:hover .pbm-line--top,.pbm-card:focus .pbm-line--top{animation:pbm-top .7s ease forwards;}
.pbm-card:hover .pbm-line--right,.pbm-card:focus .pbm-line--right{animation:pbm-right .7s ease .12s forwards;}
.pbm-card:hover .pbm-line--bottom,.pbm-card:focus .pbm-line--bottom{animation:pbm-bottom .7s ease .24s forwards;}
.pbm-card:hover .pbm-line--left,.pbm-card:focus .pbm-line--left{animation:pbm-left .7s ease .36s forwards;}

@keyframes pbm-top{0%{transform:translateX(-105%);}100%{transform:translateX(0);}}
@keyframes pbm-right{0%{transform:translateY(-105%);}100%{transform:translateY(0);}}
@keyframes pbm-bottom{0%{transform:translateX(105%);}100%{transform:translateX(0);}}
@keyframes pbm-left{0%{transform:translateY(105%);}100%{transform:translateY(0);}}

@media (prefers-reduced-motion: reduce){
  .pbm-card__inner{transition:none;}
  .pbm-card:hover .pbm-card__inner,.pbm-card:focus .pbm-card__inner{transform:none;}
  .pbm-line{display:none;}
}