:root{
  --popup-overlay:rgba(15,23,42,.56);
  --popup-card-bg:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  --popup-title:#0f172a;
  --popup-text:#334155;
  --popup-muted:#94a3b8;
  --popup-check:#5b8def;
  --popup-primary:#0f172a;
  --popup-primary-hover:#1e293b;
  --popup-shadow:0 24px 64px rgba(15,23,42,.22);
  --popup-radius:20px;
}

.popup-overlay{
  position:fixed;
  inset:0;
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:var(--popup-overlay);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease,visibility .22s ease;
}

.popup-overlay.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.popup-window{
  position:relative;
  width:100%;
  max-width:420px;
  padding:26px;
  border:0;
  border-radius:var(--popup-radius);
  background:var(--popup-card-bg);
  box-shadow:var(--popup-shadow);
  transform:translateY(14px) scale(.97);
  opacity:0;
  transition:transform .26s ease,opacity .26s ease;
  overflow:hidden;
}

.popup-overlay.is-visible .popup-window{
  transform:translateY(0) scale(1);
  opacity:1;
}

.popup-close{
  position:absolute;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  color:#94a3b8;
  opacity:.5;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}

.popup-close:hover{
  background:rgba(255,255,255,.96);
  color:#475569;
  transform:scale(1.04);
}

.popup-title{
  margin:0;
  padding-right:36px;
  color:var(--popup-title);
  font-size:22px;
  font-weight:700;
  line-height:1.3;
  letter-spacing:-.02em;
  text-wrap:balance;
}

.popup-copy{
  margin:16px 0 0;
  color:var(--popup-text);
  font-size:15px;
  line-height:1.8;
  white-space:pre-line;
}

.popup-points{
  margin:18px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}

.popup-points li{
  display:grid;
  grid-template-columns:18px 1fr;
  gap:10px;
  align-items:start;
  color:#1f334d;
  font-size:14px;
  line-height:1.6;
}

.popup-points li::before{
  content:"✔";
  color:var(--popup-check);
  font-weight:700;
  transform:translateY(1px);
}

.popup-trust-note{
  margin:16px 0 0;
  color:#64748b;
  font-size:12px;
  line-height:1.7;
  text-align:left;
}

.popup-actions{
  display:grid;
  gap:10px;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid #f1f5f9;
}

.popup-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:50px;
  padding:14px 20px;
  border-radius:999px;
  background:var(--popup-primary);
  color:#fff;
  font-size:15px;
  font-weight:600;
  line-height:1.2;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(15,23,42,.2);
  transition:background .18s ease,transform .18s ease,box-shadow .18s ease;
}

.popup-primary:hover{
  background:var(--popup-primary-hover);
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(15,23,42,.24);
  text-decoration:none;
}

.popup-secondary{
  border:0;
  background:transparent;
  color:#cbd5e1;
  font-size:12px;
  line-height:1.4;
  cursor:pointer;
  padding:4px 0 0;
  text-align:center;
  transition:color .18s ease;
}

.popup-secondary:hover{
  color:#64748b;
}

@media (max-width:480px){
  .popup-overlay{padding:14px}
  .popup-window{padding:24px 18px 18px}
  .popup-title{font-size:20px}
  .popup-copy{font-size:14px;line-height:1.75}
}

@media (prefers-reduced-motion:reduce){
  .popup-overlay,
  .popup-window,
  .popup-close,
  .popup-primary,
  .popup-secondary{
    transition:none;
  }
}