/* NOPE blog conversion layer — organic_v1 (2026-10-08)
   Keeps the article useful-first, then offers the quiz as a contextual next step. */
.nope-cro-inline,
.nope-cro-final{
  margin:34px 0;
  padding:22px 24px;
  border:1px solid rgba(38,216,95,.24);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(38,216,95,.075),rgba(255,255,255,.018));
  box-shadow:0 16px 42px rgba(0,0,0,.12);
}
.nope-cro-inline .nope-cro-kicker,
.nope-cro-final .nope-cro-kicker{
  margin:0 0 7px;
  color:#26D85F;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.nope-cro-inline h3,
.nope-cro-final h3{
  margin:0 0 8px;
  color:#f7f7f8;
  font-size:clamp(1.22rem,2.4vw,1.55rem);
  line-height:1.2;
  letter-spacing:-.025em;
}
.nope-cro-inline p,
.nope-cro-final p{
  margin:0;
  color:#bfc3c9;
  font-size:.98rem;
  line-height:1.65;
}
.nope-cro-inline a,
.nope-cro-final a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:15px;
  color:#26D85F !important;
  font-weight:800;
  text-decoration:none !important;
  border-bottom:1px solid rgba(38,216,95,.35);
  padding-bottom:2px;
}
.nope-cro-inline a:hover,
.nope-cro-final a:hover{border-color:#26D85F}

.nope-cro-sticky{
  position:fixed;
  left:12px;
  right:12px;
  bottom:calc(10px + env(safe-area-inset-bottom));
  z-index:9997;
  display:none;
  align-items:center;
  gap:12px;
  max-width:640px;
  margin:0 auto;
  padding:11px 11px 11px 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(15,16,19,.94);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  box-shadow:0 18px 55px rgba(0,0,0,.42);
  transform:translateY(18px);
  opacity:0;
  transition:opacity .2s ease, transform .2s ease;
}
.nope-cro-sticky.is-visible{display:flex;opacity:1;transform:translateY(0)}
.nope-cro-sticky-copy{min-width:0;flex:1}
.nope-cro-sticky-copy strong{display:block;color:#f7f7f8;font-size:.88rem;line-height:1.15;margin-bottom:2px}
.nope-cro-sticky-copy span{display:block;color:#969aa2;font-size:.75rem;line-height:1.2}
.nope-cro-sticky a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 13px;
  border-radius:12px;
  background:#26D85F;
  color:#07110a !important;
  text-decoration:none !important;
  font-size:.8rem;
  font-weight:900;
  white-space:nowrap;
}
.nope-cro-sticky-close{
  flex:0 0 30px;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#80848c;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}
.nope-cro-sticky-close:hover{background:rgba(255,255,255,.07);color:#fff}

@media (min-width:821px){.nope-cro-sticky{display:none !important}}
@media (max-width:820px){
  .nope-cro-inline,.nope-cro-final{margin:28px 0;padding:19px 18px;border-radius:18px}
}
@media (prefers-reduced-motion:reduce){.nope-cro-sticky{transition:none}}