/* ================================================
   JuriUp - Exit Popup (v2, design system lp-*)
   ================================================ */
#jp-exit-overlay {
    --primary:#FF8001; --primary-dark:#E67300; --secondary:#2C3064; --secondary-soft:rgba(44,48,100,.07);
    --headline:#313349; --body:#5F5C5A; --light:#FCF9F8; --white:#FFFFFF; --line:#EFE7E3; --success:#17684E;
    --shadow-lift:0 22px 60px -24px rgba(22,19,26,.22); --r-m:12px; --r-3xl:22px;
    --font-body:var(--jq-body,"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif);
    --font-head:var(--jq-title,"Barlow",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif);
    position: fixed; inset: 0; z-index: 999999;
    display: flex; align-items: center; justify-content: center; padding: 20px;
    background: rgba(44,48,100,.42);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .3s ease, visibility .3s ease;
    font-family: var(--font-body); color: var(--body); line-height: 1.6;
}
#jp-exit-overlay.jp-visible { opacity: 1; visibility: visible; pointer-events: auto; }
#jp-exit-overlay * { box-sizing: border-box; }

.jp-popup {
    position: relative; width: 100%; max-width: 480px;
    background: var(--white); border: 1px solid var(--line); border-radius: var(--r-3xl);
    box-shadow: var(--shadow-lift);
    transform: translateY(16px); opacity: 0;
    transition: transform .34s cubic-bezier(.22,.9,.35,1), opacity .3s ease;
}
#jp-exit-overlay.jp-visible .jp-popup { transform: none; opacity: 1; }

.jp-close {
    position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; padding: 0;
    border: 1px solid var(--line); background: var(--white); border-radius: 999px;
    display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2;
    transition: border-color .15s ease, background .15s ease;
}
.jp-close:hover { border-color: var(--secondary); background: var(--light); }
.jp-close svg { width: 15px; height: 15px; stroke: var(--secondary); fill: none; stroke-width: 2; stroke-linecap: round; }

.jp-popup-body { padding: 36px 36px 30px; text-align: center; }

.jp-badge {
    display: inline-flex; align-items: center; gap: 8px; margin: 0 0 18px;
    font-size: 12px; font-weight: 600; color: var(--primary); text-transform: uppercase; letter-spacing: .12em;
    background: var(--white); border: 1px solid var(--line); border-radius: 999px; padding: 9px 16px; line-height: 1;
}
.jp-badge svg { width: 15px; height: 15px; stroke: var(--primary); fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.jp-headline {
    font-family: var(--font-head); font-size: 27px; font-weight: 600; color: var(--headline);
    line-height: 1.18; letter-spacing: -.02em; margin: 0 0 12px; text-wrap: balance;
}
.jp-headline em { font-style: normal; color: var(--secondary); }

.jp-sub { font-size: 15px; color: var(--body); line-height: 1.6; margin: 0 0 22px; }

.jp-trust { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 9px; text-align: left; }
.jp-pill { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; color: var(--headline); }
.jp-pill svg { flex: none; width: 18px; height: 18px; margin-top: 2px; stroke: var(--success); fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.jp-cta-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 9px; width: 100%; height: 54px; padding: 0 28px;
    background: var(--primary); color: #fff !important; border: 2px solid var(--primary); border-radius: var(--r-m);
    font-family: var(--font-body); font-weight: 600; font-size: 16px; text-decoration: none !important; cursor: pointer;
    box-shadow: 0 6px 18px rgba(255,128,1,.34);
    transition: background .18s, border-color .18s, box-shadow .2s, transform .16s;
    margin: 0 0 14px;
}
.jp-cta-btn:hover { background: var(--primary-dark); border-color: var(--primary-dark); box-shadow: 0 10px 26px rgba(255,128,1,.42); transform: translateY(-1px); color: #fff !important; }
.jp-cta-btn:active { transform: translateY(1px); }
.jp-cta-btn svg { width: 19px; height: 19px; stroke: currentColor; fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

.jp-note { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--body); margin: 0 0 12px; }
.jp-note svg { width: 15px; height: 15px; stroke: var(--success); fill: none; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

.jp-dismiss {
    display: block; width: 100%; padding: 6px; background: none; border: none; cursor: pointer;
    font-family: inherit; font-size: 13px; font-weight: 500; color: var(--body); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(95,92,90,.4);
    transition: color .15s ease;
}
.jp-dismiss:hover { color: var(--secondary); }

@media (max-width: 540px) {
    #jp-exit-overlay { padding: 14px; align-items: flex-end; }
    .jp-popup-body { padding: 30px 22px 22px; }
    .jp-headline { font-size: 23px; }
}