/* SiteRefit server-rendered showcase v12.63 */

/* Historical examples block is no longer used. */
#real-examples{display:none!important}

#sr-showcase-v143[hidden]{display:none!important}
#sr-showcase-v143{
  padding:76px 0!important;
  background:#f6f9f7!important;
  border-top:1px solid #edf2ef!important;
  border-bottom:1px solid #edf2ef!important;
}
.sr143-head{
  max-width:820px!important;
  margin:0 auto 32px!important;
  text-align:center!important;
}
.sr143-kicker{
  display:block!important;
  margin:0 0 10px!important;
  color:#267541!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.14em!important;
}
.sr143-head h2{
  margin:0 0 12px!important;
  color:#123d67!important;
  font-family:Georgia,serif!important;
  font-size:clamp(32px,4vw,48px)!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
}
.sr143-head p{
  max-width:720px!important;
  margin:0 auto!important;
  color:#667c90!important;
  line-height:1.6!important;
}
.sr143-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
}
.sr143-card{
  min-width:0!important;
  overflow:hidden!important;
  border:1px solid #dbe6e0!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 14px 36px rgba(20,58,91,.06)!important;
}
.sr143-preview{
  position:relative!important;
  aspect-ratio:16/10!important;
  overflow:hidden!important;
  background:
    linear-gradient(135deg,#edf4f0 0%,#f8faf9 55%,#e8f2eb 100%)!important;
  border-bottom:1px solid #e3ebe6!important;
}
.sr143-preview img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:top center!important;
  background:#fff!important;
}
.sr143-preview-fallback{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  place-items:center!important;
  padding:24px!important;
  color:#173b60!important;
  text-align:center!important;
}
.sr143-preview-fallback strong{
  display:block!important;
  font-family:Georgia,serif!important;
  font-size:24px!important;
}
.sr143-preview-fallback small{
  display:block!important;
  margin-top:7px!important;
  color:#6f8193!important;
}
.sr143-after-badge{
  position:absolute!important;
  left:12px!important;
  bottom:12px!important;
  padding:6px 9px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.94)!important;
  color:#287242!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.05em!important;
  box-shadow:0 4px 15px rgba(20,58,91,.10)!important;
}
.sr143-body{padding:17px 18px 18px!important}
.sr143-title-row{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:12px!important;
}
.sr143-title-row h3{
  margin:0!important;
  color:#153b60!important;
  font-size:17px!important;
  line-height:1.25!important;
}
.sr143-real{
  flex:0 0 auto!important;
  padding:5px 8px!important;
  border-radius:999px!important;
  background:#edf7ef!important;
  color:#2b7546!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.06em!important;
}
.sr143-industry{
  min-height:17px!important;
  margin:5px 0 13px!important;
  color:#718397!important;
  font-size:11px!important;
}
.sr143-route{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr)!important;
  gap:7px!important;
  align-items:center!important;
  margin:0 0 15px!important;
}
.sr143-domain{
  min-width:0!important;
  padding:10px!important;
  border:1px solid #e1e9e5!important;
  border-radius:11px!important;
  background:#fafcfb!important;
}
.sr143-domain.after{
  background:#f0f8f2!important;
  border-color:#d2e7d8!important;
}
.sr143-domain small{
  display:block!important;
  margin-bottom:3px!important;
  color:#77899a!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.07em!important;
  text-transform:uppercase!important;
}
.sr143-domain b{
  display:block!important;
  overflow:hidden!important;
  color:#173b60!important;
  font-size:11px!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.sr143-arrow{
  color:#4ba05f!important;
  text-align:center!important;
  font-size:20px!important;
  font-weight:900!important;
}
.sr143-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:9px!important;
}
.sr143-actions a{
  min-height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 11px!important;
  border-radius:10px!important;
  text-decoration:none!important;
  font-size:10px!important;
  font-weight:850!important;
  text-align:center!important;
}
.sr143-actions .original{
  border:1px solid #cfdad4!important;
  background:#fff!important;
  color:#35536d!important;
}
.sr143-actions .result{
  border:1px solid #4ba05f!important;
  background:#4ba05f!important;
  color:#fff!important;
}

@media(max-width:900px){
  .sr143-grid{grid-template-columns:1fr!important}
  .sr143-card{
    display:grid!important;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
  }
  .sr143-preview{
    aspect-ratio:auto!important;
    min-height:300px!important;
    border-bottom:0!important;
    border-right:1px solid #e3ebe6!important;
  }
}
@media(max-width:700px){
  #sr-showcase-v143{padding:54px 0!important}
  .sr143-card{display:block!important}
  .sr143-preview{
    min-height:0!important;
    aspect-ratio:16/10!important;
    border-right:0!important;
    border-bottom:1px solid #e3ebe6!important;
  }
  .sr143-route{grid-template-columns:1fr!important}
  .sr143-arrow{transform:rotate(90deg)!important}
  .sr143-actions{grid-template-columns:1fr!important}

  /* Preserve mobile repair for How it works. */
  body #how .steps,body #how .step-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:14px!important;
  }
  body #how .steps::before,body #how .steps::after,
  body #how .step-grid::before,body #how .step-grid::after,
  body #how .step::before,body #how .step::after{
    display:none!important;
    content:none!important;
  }
  body #how .step{
    position:relative!important;
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:11px!important;
    row-gap:5px!important;
    align-items:start!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:17px 16px!important;
    overflow:hidden!important;
    transform:none!important;
  }
  body #how .step > .step-number{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    float:none!important;
    grid-column:1!important;
    grid-row:1 / span 2!important;
    justify-self:start!important;
    align-self:start!important;
    width:31px!important;
    min-width:31px!important;
    height:31px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    z-index:1!important;
    border-radius:50%!important;
    font-size:13px!important;
    line-height:1!important;
  }
  body #how .step > .step-icon{display:none!important;visibility:hidden!important}
  body #how .step > h3{
    grid-column:2!important;
    grid-row:1!important;
    width:auto!important;
    min-width:0!important;
    margin:2px 0 0!important;
    padding:0!important;
    transform:none!important;
    font-size:17px!important;
    line-height:1.25!important;
  }
  body #how .step > p{
    grid-column:2!important;
    grid-row:2!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    line-height:1.48!important;
  }
}
