body.hsl-popup-open{
  overflow:hidden !important;
}

.hsl-popup[hidden]{
  display:none !important;
}

.hsl-popup{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:grid;
  place-items:center;
  padding:20px;
  font-family:inherit;
}

.hsl-popup,
.hsl-popup *{
  box-sizing:border-box;
}

.hsl-popup__backdrop{
  position:absolute;
  inset:0;
  background:rgba(22,24,54,.46);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
  opacity:0;
  transition:opacity .22s ease;
}

.hsl-popup__card{
  position:relative;
  z-index:1;
  width:min(400px,100%);
  padding:30px 26px 24px;
  overflow:hidden;
  border:1px solid #e7e8f0;
  border-radius:20px;
  background:#fff;
  box-shadow:0 20px 55px rgba(24,27,72,.18);
  color:#313192;
  text-align:center;
  opacity:0;
  transform:translateY(9px) scale(.985);
  transition:opacity .22s ease,transform .22s ease;
}

.hsl-popup__card::before{
  display:none;
}

.hsl-popup.is-open .hsl-popup__backdrop,
.hsl-popup.is-open .hsl-popup__card{
  opacity:1;
}

.hsl-popup.is-open .hsl-popup__card{
  transform:none;
}

.hsl-popup__close{
  position:absolute;
  top:12px;
  left:12px;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#f5f6f9;
  color:#6e728c;
  font:700 22px/1 inherit;
  cursor:pointer;
}

.hsl-popup__icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin:0 auto 16px;
  border-radius:50%;
  background:#ecf8f3;
  box-shadow:none;
  color:#0db06d;
}

.hsl-popup__icon svg{
  width:30px;
  height:30px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.hsl-popup__eyebrow{
  display:none;
}

.hsl-popup h3{
  margin:0 0 8px;
  color:#313192;
  font-size:22px;
  font-weight:900;
  line-height:1.5;
}

.hsl-popup p{
  margin:0;
  color:#666a80;
  font-size:14.5px;
  font-weight:500;
  line-height:1.85;
}

.hsl-popup__button{
  width:100%;
  min-height:46px;
  margin-top:18px;
  padding:10px 18px;
  border:0;
  border-radius:12px;
  background:#313192;
  color:#fff;
  font-family:inherit;
  font-size:14.5px;
  font-weight:900;
  cursor:pointer;
}

@media (hover:hover) and (pointer:fine){
  .hsl-popup__close:hover{
    background:#eceef4;
    color:#313192;
  }

  .hsl-popup__button:hover{
    background:#fbba0e;
    color:#24256f;
  }
}

@media (max-width:700px){
  .hsl-popup{
    padding:16px;
  }

  .hsl-popup__card{
    width:100%;
    padding:27px 19px 19px;
    border-radius:18px;
  }

  .hsl-popup h3{
    font-size:21px;
  }

  .hsl-popup p,
  .hsl-popup__button{
    font-size:14.5px;
  }
}

/* Lock popup controls against theme button colors in every interaction state. */
body .hsl-popup .hsl-popup__button,
body .hsl-popup .hsl-popup__button:hover,
body .hsl-popup .hsl-popup__button:focus,
body .hsl-popup .hsl-popup__button:focus-visible,
body .hsl-popup .hsl-popup__button:active{
  width:100% !important;
  min-height:46px !important;
  margin:18px 0 0 !important;
  padding:10px 18px !important;
  border:1px solid #313192 !important;
  border-radius:12px !important;
  background:#313192 !important;
  background-image:none !important;
  color:#fff !important;
  box-shadow:none !important;
  outline:0 !important;
  text-decoration:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}

body .hsl-popup .hsl-popup__button:hover{
  border-color:#29297d !important;
  background:#29297d !important;
}

body .hsl-popup .hsl-popup__button:focus,
body .hsl-popup .hsl-popup__button:focus-visible{
  border-color:#313192 !important;
  background:#313192 !important;
  box-shadow:0 0 0 3px rgba(49,49,146,.18) !important;
}

body .hsl-popup .hsl-popup__button:active{
  border-color:#24246d !important;
  background:#24246d !important;
  transform:translateY(1px) !important;
}

body .hsl-popup .hsl-popup__close,
body .hsl-popup .hsl-popup__close:hover,
body .hsl-popup .hsl-popup__close:focus,
body .hsl-popup .hsl-popup__close:focus-visible,
body .hsl-popup .hsl-popup__close:active{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid #e4e6ee !important;
  border-radius:50% !important;
  background:#f5f6f9 !important;
  background-image:none !important;
  color:#626680 !important;
  box-shadow:none !important;
  outline:0 !important;
  text-decoration:none !important;
  transform:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}

body .hsl-popup .hsl-popup__close:hover{
  border-color:#d9dce8 !important;
  background:#eceef4 !important;
  color:#313192 !important;
}

body .hsl-popup .hsl-popup__close:focus,
body .hsl-popup .hsl-popup__close:focus-visible{
  border-color:#cfd2e1 !important;
  background:#f5f6f9 !important;
  color:#313192 !important;
  box-shadow:0 0 0 3px rgba(49,49,146,.14) !important;
}

body .hsl-popup .hsl-popup__close:active{
  border-color:#d5d8e5 !important;
  background:#e7e9f1 !important;
  color:#24246d !important;
}

body .hsl-popup button::before,
body .hsl-popup button::after{
  display:none !important;
  content:none !important;
}

@media (prefers-reduced-motion:reduce){
  .hsl-popup__backdrop,
  .hsl-popup__card{
    transition:none;
  }
}
