/* Elementor Reputation Hover Card (v1.3) */
.erc-card{
  --erc-shadow: 0 10px 30px rgba(0,0,0,.15);
  position: relative;
  width: 100%;
  max-width: 100%;
  min-height: 340px;
  margin-left: auto;
  margin-right: auto;
}

.erc-card .badge{
  position: absolute;
  top: -42px;
  left: 50%;
  transform: translateX(-50%);
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: #193763;
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: var(--erc-shadow);
  transition: background-color .35s ease;
  z-index: 5;
}
.erc-card .badge .elementor-icon{ display:inline-flex; align-items:center; justify-content:center; }
.erc-card .badge svg{ width: 44px; height: 44px; display:block; }

.erc-card .panel{
  position: relative;
  margin-top: 40px;
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--erc-shadow);
  overflow: hidden;
  height: 100%;
  min-height: inherit;
}
.erc-card .panel .content{
  position: relative;
  z-index: 3;
  padding: 56px 24px 24px;
  display: block;
  color: #2c2c2c;
  transition: color .45s ease;
  text-align: center;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}
.erc-card .panel .title{
  font-weight: 800;
  letter-spacing: .35em;
  margin: 0 0 12px;
  text-transform: uppercase;
}
.erc-card .panel .desc{
  line-height: 1.9;
  margin: 0;
}

/* Curtains start from CENTER and grow towards edges */
.erc-card .curtain{
  content: "";
  position: absolute;
  left: 0; right: 0;
  height: 0;
  background: #1e1a2b;
  z-index: 2;
  transition: height .55s cubic-bezier(.2,.7,.2,1);
  border-radius: inherit;
}
.erc-card .curtain.top{ top: 50%; transform-origin: top; }
.erc-card .curtain.bottom{ bottom: 50%; transform-origin: bottom; }

.erc-card:hover .curtain.top,
.erc-card.is-hover .curtain.top{ height: 50%; }
.erc-card:hover .curtain.bottom,
.erc-card.is-hover .curtain.bottom{ height: 50%; }

.erc-card:hover .badge,
.erc-card.is-hover .badge{
  background: var(--erc-badge-hover, #0f2546);
}

.erc-card:hover .panel .content,
.erc-card.is-hover .panel .content{ color: #fff; }

@media (max-width: 767px){
  .erc-card{ min-height: 320px; }
  .erc-card .badge{ width: 84px; height: 84px; top: -38px; }
  .erc-card .panel .content{ padding: 52px 18px 20px; }
  .erc-card .panel .title{ letter-spacing: .28em; font-size: 18px; }
  .erc-card .panel .desc{ font-size: 14px; }
}