[hidden] { display: none !important; }

.tbpp,
.tbpp * { box-sizing: border-box; }

.tbpp {
    --purple-dark:#241044;
    --purple:#5b28cf;
    --purple-light:#7b55e7;
    --text:#1c1530;
    --muted:#6f687b;
    position:fixed;
    inset:0;
    z-index:999999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    transition:opacity .3s ease, visibility .3s ease;
}

.tbpp.is-active {
    visibility:visible;
    opacity:1;
    pointer-events:auto;
}

.tbpp__overlay {
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 18% 15%,rgba(112,73,206,.22),transparent 34%),rgba(20,10,38,.76);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.tbpp__dialog {
    position:relative;
    width:min(1080px,100%);
    max-height:calc(100vh - 48px);
    display:grid;
    grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);
    overflow:hidden;
    border:1px solid rgba(122,81,219,.18);
    border-radius:28px;
    background:#fff;
    box-shadow:0 35px 100px rgba(24,6,58,.42),0 10px 30px rgba(65,22,137,.18);
    transform:translateY(26px) scale(.97);
    opacity:0;
    transition:transform .4s cubic-bezier(.2,.85,.3,1),opacity .3s ease;
}

.tbpp.is-active .tbpp__dialog {
    transform:translateY(0) scale(1);
    opacity:1;
}

.tbpp__close {
    position:absolute;
    top:18px;
    right:18px;
    z-index:20;
    width:42px;
    height:42px;
    padding:0;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.35);
    border-radius:50%;
    background:rgba(255,255,255,.14);
    color:#fff;
    cursor:pointer;
}

.tbpp__close svg,
.tbpp__form button svg,
.tbpp__secondary svg {
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.tbpp__close svg { width:20px; height:20px; }

.tbpp__content {
    min-width:0;
    padding:clamp(34px,4.2vw,54px);
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:radial-gradient(circle at 7% 4%,rgba(115,68,218,.10),transparent 34%),linear-gradient(145deg,#fff 0%,#fbf9ff 100%);
}

.tbpp__badge {
    width:fit-content;
    margin-bottom:13px;
    padding:8px 13px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    border:1px solid rgba(84,32,181,.16);
    border-radius:999px;
    background:rgba(84,32,181,.07);
    color:var(--purple);
    font-size:11px;
    font-weight:700;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.tbpp__badge span {
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--purple-light);
    box-shadow:0 0 0 5px rgba(125,77,226,.12);
}

.tbpp__eyebrow {
    margin:0 0 7px;
    color:var(--muted);
    font-size:11px;
    font-weight:700;
    letter-spacing:.21em;
}

.tbpp__content h2 {
    margin:0;
    max-width:560px;
    color:var(--text);
    font-size:clamp(32px,3.25vw,49px);
    font-weight:700;
    line-height:1.02;
    letter-spacing:-.035em;
}

.tbpp__content h2 span {
    display:block;
    margin-top:3px;
    color:var(--purple);
}

.tbpp__description {
    max-width:570px;
    margin:15px 0 0;
    color:var(--muted);
    font-size:14px;
    line-height:1.58;
}

.tbpp__offer {
    max-width:590px;
    margin-top:17px;
    padding:13px 14px;
    display:flex;
    align-items:center;
    gap:12px;
    border:1px solid rgba(84,32,181,.14);
    border-radius:15px;
    background:linear-gradient(135deg,rgba(84,32,181,.08),rgba(127,77,226,.035));
}

.tbpp__offer-icon {
    width:40px;
    height:40px;
    flex:0 0 40px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:var(--purple);
}

.tbpp__offer-icon svg {
    width:21px;
    height:21px;
    fill:none;
    stroke:#fff;
    stroke-width:1.8;
}

.tbpp__offer strong {
    display:block;
    margin-bottom:2px;
    color:var(--text);
    font-size:13px;
}

.tbpp__offer span {
    display:block;
    color:var(--muted);
    font-size:11.5px;
}

.tbpp__form {
    position:relative;
    max-width:590px;
    margin-top:17px;
}

.tbpp__form label {
    display:block;
    margin-bottom:7px;
    color:var(--text);
    font-size:12px;
    font-weight:700;
}

.tbpp__form-row {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:9px;
}

.tbpp__form input[type="email"] {
    width:100%;
    min-width:0;
    height:50px;
    padding:0 15px;
    border:1px solid rgba(84,32,181,.22);
    border-radius:12px;
    background:#fff;
    color:var(--text);
    font:inherit;
    font-size:14px;
    outline:none;
}

.tbpp__honeypot {
    position:absolute!important;
    left:-9999px!important;
    opacity:0!important;
    pointer-events:none!important;
}

.tbpp__form button {
    min-width:178px;
    height:50px;
    padding:0 18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:0;
    border-radius:12px;
    background:linear-gradient(135deg,var(--purple),var(--purple-light));
    color:#fff;
    font:inherit;
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
    cursor:pointer;
    box-shadow:0 12px 24px rgba(84,32,181,.22);
}

.tbpp__form button svg,
.tbpp__secondary svg {
    width:17px;
    height:17px;
}

.tbpp__message {
    min-height:17px;
    margin:6px 0 0;
    font-size:12px;
}

.tbpp__message.is-success { color:#137333; }
.tbpp__message.is-error { color:#b3261e; }

.tbpp__secondary {
    max-width:590px;
    width:100%;
    min-height:48px;
    margin-top:10px;
    padding:12px 18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    border:1px solid rgba(84,32,181,.22);
    border-radius:12px;
    background:#fff;
    color:var(--purple)!important;
    font-size:13px;
    font-weight:700;
    text-decoration:none!important;
}

.tbpp__note {
    margin:10px 0 0;
    color:#8b8497;
    font-size:10.5px;
}

.tbpp__visual {
    position:relative;
    min-height:630px;
    padding:60px 30px 28px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    isolation:isolate;
    background:radial-gradient(circle at 50% 45%,rgba(168,130,255,.48),transparent 32%),linear-gradient(145deg,var(--purple-dark) 0%,#42138d 48%,#6d36d0 100%);
}

.tbpp__visual::before {
    content:"";
    position:absolute;
    inset:0;
    z-index:-3;
    opacity:.35;
    background-image:radial-gradient(rgba(255,255,255,.45) 1px,transparent 1px);
    background-size:18px 18px;
}

.tbpp__glow {
    position:absolute;
    top:50%;
    left:50%;
    width:330px;
    height:330px;
    z-index:-2;
    border-radius:50%;
    transform:translate(-50%,-52%);
    background:rgba(191,159,255,.23);
    box-shadow:0 0 80px rgba(193,160,255,.38);
}

.tbpp__ring {
    position:absolute;
    border:1px solid rgba(255,255,255,.16);
    border-radius:50%;
}

.tbpp__ring--one { width:470px; height:470px; }
.tbpp__ring--two { width:610px; height:610px; }

.tbpp__book-wrap {
    position:relative;
    z-index:2;
    width:min(100%,390px);
    animation:tbppFloat 4.8s ease-in-out infinite;
}

.tbpp__book {
    display:block;
    width:100%;
    max-height:480px;
    object-fit:contain;
    filter:drop-shadow(0 28px 28px rgba(17,3,54,.38));
}

.tbpp__visual-label {
    position:absolute;
    left:28px;
    bottom:22px;
    padding-left:12px;
    border-left:2px solid rgba(255,255,255,.7);
    color:#fff;
}

.tbpp__visual-label span,
.tbpp__visual-label small { display:block; }

.tbpp__visual-label span {
    font-size:11px;
    font-weight:700;
    letter-spacing:.14em;
}

.tbpp__visual-label small {
    margin-top:3px;
    color:rgba(255,255,255,.7);
    font-size:10px;
}

@keyframes tbppFloat {
    0%,100% { transform:translateY(0); }
    50% { transform:translateY(-9px); }
}

body.tbpp-open { overflow:hidden; }

@media (max-width:900px) {
    .tbpp { padding:18px; }
    .tbpp__dialog {
        grid-template-columns:minmax(0,1fr) 310px;
        max-height:calc(100vh - 36px);
        overflow-y:auto;
    }
    .tbpp__content { padding:34px 28px; }
    .tbpp__visual { min-height:560px; }
    .tbpp__form-row { grid-template-columns:1fr; }
    .tbpp__form button { width:100%; }
}

@media (max-width:700px) {
    .tbpp { align-items:flex-end; padding:10px; }
    .tbpp__dialog {
        width:100%;
        max-height:calc(100vh - 20px);
        grid-template-columns:1fr;
        overflow-y:auto;
        border-radius:22px;
    }
    .tbpp__visual {
        grid-row:1;
        min-height:230px;
        padding:28px 54px 8px;
    }
    .tbpp__book-wrap { width:min(100%,205px); }
    .tbpp__book { max-height:210px; }
    .tbpp__glow { width:210px; height:210px; }
    .tbpp__ring--one { width:290px; height:290px; }
    .tbpp__ring--two { width:390px; height:390px; }
    .tbpp__close {
        position:fixed;
        top:20px;
        right:20px;
        width:38px;
        height:38px;
    }
    .tbpp__content { padding:25px 20px 24px; }
    .tbpp__content h2 { font-size:clamp(28px,8.5vw,38px); }
    .tbpp__description { font-size:13.5px; }
    .tbpp__offer { align-items:flex-start; }
    .tbpp__form-row { grid-template-columns:1fr; }
    .tbpp__form button,
    .tbpp__secondary { width:100%; }
}

@media (prefers-reduced-motion:reduce) {
    .tbpp__dialog,
    .tbpp__book-wrap { animation:none!important; transition:none!important; }
}