.rspr-overlay{
  position:fixed; inset:0;
  background:rgba(0,0,0,.55);
  display:flex; align-items:center; justify-content:center;
  z-index:999999;
  opacity:0; pointer-events:none;
  transition:opacity .12s ease;
}
.rspr-overlay.rspr-open{opacity:1; pointer-events:auto;}

.rspr-modal{
  position:relative;
  width:min(720px, 92vw);
  border-radius:18px;
  overflow:hidden;
  background:#0b0f1a;
  box-shadow:0 18px 60px rgba(0,0,0,.45);
  color:#fff;
}

/* ===== AURORA – CELO POZADINA POPUPA ===== */
.rspr-aurora{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 30%, rgba(0,255,209,.55), transparent 45%),
    radial-gradient(circle at 80% 20%, rgba(116,91,255,.55), transparent 45%),
    radial-gradient(circle at 60% 80%, rgba(255,88,146,.45), transparent 45%),
    radial-gradient(circle at 30% 90%, rgba(0,153,255,.45), transparent 45%);
  filter: blur(10px) saturate(135%);
  animation: rsprAurora 6s ease-in-out infinite alternate;
  z-index:0;
}
@keyframes rsprAurora{
  0%   { transform: translate3d(-8px,-6px,0) scale(1.04); opacity:.95; }
  50%  { transform: translate3d(10px,6px,0) scale(1.02); opacity:1; }
  100% { transform: translate3d(-4px,10px,0) scale(1.06); opacity:.92; }
}

/* sadržaj iznad aurore */
.rspr-body{
  position:relative;
  z-index:1;
  padding:22px 22px 24px;
}

.rspr-close{
  position:absolute; top:10px; right:12px;
  width:40px; height:40px;
  border-radius:999px;
  border:0;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:22px;
  cursor:pointer;
  z-index:2;
}

/* ===== LOTTIE IZNAD NASLOVA ===== */
.rspr-lottie-wrap{
  display:flex;
  justify-content:center;
  padding:10px 0 10px;
}
.rspr-lottie{
  width:200px;
  height:200px;
}

/* ===== NASLOVI I TEKST ===== */

/* H3 – bež */
.rspr-title{
  margin:0 0 10px;
  font-size:24px;
  color:#f2e3c6;
  text-align:center;
}

/* H4 – BELO */
.rspr-body h4{
  color:#ffffff;
  margin:12px 0 8px;
  text-align:center;
}

/* PASUSI – BELO */
.rspr-body p,
.rspr-desc{
  color:#ffffff;
  opacity:0.95;
  text-align:center;
  margin:0 0 14px;
}

/* ===== BADGE ===== */
.rspr-badge{
  display:flex;
  gap:10px;
  align-items:baseline;
  padding:10px 12px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  width:fit-content;
  margin:0 auto 14px;
  color:#fff;
}

/* ===== DUGMAD ===== */
.rspr-cta, .rspr-submit{
  border:0;
  padding:12px 14px;
  border-radius:12px;
  cursor:pointer;
  font-weight:700;
}

.rspr-cta{
  width:100%;
  background:linear-gradient(90deg, rgba(0,255,209,.95), rgba(116,91,255,.95));
  color:#07101a;
}

.rspr-submit{
  width:100%;
  background:rgba(255,255,255,.12);
  color:#ffffff;
  margin-top:10px;
}

/* ===== FORMA ===== */
.rspr-form{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.10);
}

.rspr-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:10px;
}

.rspr-form input[type="text"],
.rspr-form input[type="email"]{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#ffffff;
  outline:none;
}

.rspr-form input::placeholder{
  color:rgba(255,255,255,.65);
}

/* checkbox + tekst */
.rspr-consent{
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:13px;
  color:#ffffff;
  opacity:.95;
  margin-top:10px;
}
.rspr-consent input{ margin-top:3px; }

/* ===== REZULTATI ===== */
.rspr-result{ margin-top:10px; }

.rspr-success{
  padding:10px 12px;
  border-radius:12px;
  background:rgba(0,255,209,.10);
  border:1px solid rgba(0,255,209,.20);
  color:#ffffff;
}

.rspr-code{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  letter-spacing:.6px;
  color:#ffffff;
}

.rspr-error{
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,88,146,.12);
  border:1px solid rgba(255,88,146,.25);
  color:#ffffff;
}

/* ===== RESPONSIVE ===== */
@media (max-width:560px){
  .rspr-row{ grid-template-columns:1fr; }
  .rspr-lottie{ width:160px; height:160px; }
}
.rspr-privacy-link{
  color:#00ffd1;
  text-decoration:underline;
  margin-left:6px;
  font-weight:500;
}
.rspr-privacy-link:hover{
  color:#ffffff;
}
