/* ==================================================================
 * PRICING · v2 — чистая премиум-сборка /pricing
 * ------------------------------------------------------------------
 * Это полная пересборка без слоёв billing-neon.css и
 * billing-premium-2026.css. Один файл, чистая премиум-эстетика,
 * без бесконечных gradient-shift анимаций и тяжёлого backdrop-filter
 * на каждом элементе.
 *
 * Контракт по JS-хукам сохранён: #bnPeriods, .bn-period[data-months],
 * .is-active, #bnGoPay, .bn-quote-open[data-tier/tier-name/annual/impl],
 * #bnQuoteModal, #bnQuoteTitle/Price/Impl/Tier, #bnQuoteForm + поля,
 * #bnQuoteMsg, #bnQuoteSuccess, [data-close], #bnAlert.
 * ================================================================== */

/* ---------- TOKENS ---------- */
html, body.bn-host { margin: 0; padding: 0; overflow-x: hidden; }
body.bn-host {
    --bg-0: #08090f;
    --bg-1: #0c0e17;
    --bg-2: #131626;
    --line: rgba(255,255,255,.08);
    --line-strong: rgba(139,92,246,.35);
    --fg: #f4f6fb;
    --fg-dim: #c0c5d6;
    --fg-mute: #9aa1b6;
    --fg-faint: #6a7088;
    --violet: #8b5cf6;
    --violet-deep: #7c3aed;
    --violet-light: #a78bfa;
    --cyan: #22d3ee;
    --cyan-deep: #06b6d4;
    --emerald: #10b981;
    --emerald-light: #6ee7c4;
    --amber: #fbbf24;
    --rose: #f43f5e;
    --grad: linear-gradient(135deg, #7c3aed 0%, #8b5cf6 40%, #06b6d4 100%);
    --grad-soft: linear-gradient(135deg, rgba(124,58,237,.16) 0%, rgba(6,182,212,.08) 100%);
    --grad-edge: linear-gradient(135deg, rgba(139,92,246,.55), rgba(34,211,238,.45));
    --grad-text-w: linear-gradient(135deg, #fff 0%, #c4b5fd 100%);
    --grad-text-3: linear-gradient(135deg, #fff 0%, #a78bfa 50%, #22d3ee 100%);
    --radius: 18px;
    --radius-lg: 24px;
    --radius-xl: 28px;
    --shadow-1: 0 1px 0 rgba(255,255,255,.04) inset, 0 1px 2px rgba(0,0,0,.30);
    --shadow-2: 0 12px 32px -16px rgba(0,0,0,.6), 0 4px 14px -6px rgba(124,58,237,.30);
    --shadow-3: 0 24px 50px -18px rgba(0,0,0,.65), 0 10px 24px -10px rgba(124,58,237,.30);
    --shadow-glow: 0 28px 60px -20px rgba(124,58,237,.45);
    --ring: 0 0 0 1px rgba(139,92,246,.5), 0 0 0 4px rgba(139,92,246,.16);
    --ease: cubic-bezier(.22, 1, .36, 1);

    background: var(--bg-0);
    color: var(--fg);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    font-feature-settings: "ss01" on, "cv01" on, "tnum" on;
}
body.bn-host * { box-sizing: border-box; }
body.bn-host a { text-decoration: none; }
body.bn-host ::selection { background: rgba(139,92,246,.36); color: #fff; }

/* премиум-фокус */
body.bn-host :focus-visible {
    outline: none;
    box-shadow: var(--ring);
    border-radius: 12px;
}

/* премиум-скроллбар */
body.bn-host ::-webkit-scrollbar { width: 10px; height: 10px; }
body.bn-host ::-webkit-scrollbar-track { background: transparent; }
body.bn-host ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(139,92,246,.4), rgba(6,182,212,.3));
    border-radius: 999px;
    border: 2px solid var(--bg-0);
}

/* ---------- LAYOUT ---------- */
.bn {
    position: relative;
    min-height: 100vh;
    padding: 0 0 80px;
    background:
        radial-gradient(900px 460px at 50% -12%, rgba(124,58,237,.18), transparent 60%),
        radial-gradient(720px 420px at 100% 8%, rgba(6,182,212,.10), transparent 55%);
    overflow: hidden;
}
.bn-wrap {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 22px;
    position: relative;
    z-index: 1;
}

/* ---------- TOP BAR ---------- */
.bn-top {
    display: flex; align-items: center; justify-content: space-between;
    padding: 24px 0 8px;
}
.bn-logo {
    display: inline-flex; align-items: center; gap: 10px;
    font-weight: 900; font-size: 1.1rem;
    color: #fff;
    letter-spacing: -.01em;
}
.bn-logo i {
    color: transparent;
    background: linear-gradient(135deg, #a78bfa, #22d3ee);
    -webkit-background-clip: text; background-clip: text;
}
.bn-logo .sep { color: var(--fg-faint); font-weight: 400; margin: 0 2px; }
.bn-back {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 18px;
    color: var(--fg-dim);
    font-size: .9rem; font-weight: 700;
    background:
        linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.4), rgba(34,211,238,.3)) border-box;
    border: 1px solid transparent;
    border-radius: 999px;
    transition: transform .2s var(--ease), color .2s;
}
.bn-back:hover { transform: translateX(-2px); color: #fff; }

/* ---------- HERO ---------- */
.bn-hero { text-align: center; padding: 48px 0 16px; }
.bn-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 20px;
    margin-bottom: 22px;
    font-size: .74rem; font-weight: 800;
    letter-spacing: .14em; text-transform: uppercase;
    color: #e3d4ff;
    background:
        linear-gradient(180deg, rgba(124,58,237,.20), rgba(6,182,212,.12)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.55), rgba(34,211,238,.55)) border-box;
    border: 1px solid transparent;
    border-radius: 999px;
    box-shadow: 0 6px 18px -8px rgba(124,58,237,.45);
}
.bn-eyebrow i {
    color: transparent;
    background: linear-gradient(135deg, #c4b5fd, #22d3ee);
    -webkit-background-clip: text; background-clip: text;
}
.bn-h1 {
    font-size: clamp(32px, 5.2vw, 56px);
    line-height: 1.06;
    letter-spacing: -.025em;
    font-weight: 900;
    margin: 0 0 18px;
    color: #fff;
}
.bn-h1 .grad {
    background: linear-gradient(120deg, #a78bfa 0%, #22d3ee 50%, #f0abfc 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
    /* НЕТ ANIMATION — это убирает основной лаг */
}
.bn-sub {
    color: var(--fg-dim);
    font-size: clamp(15px, 1.4vw, 18px);
    line-height: 1.65;
    max-width: 660px;
    margin: 0 auto;
}

/* ---------- CHAIN (Лид → План → ...) ---------- */
.bn-chain {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: 8px;
    max-width: 960px;
    margin: 32px auto 12px;
}
.bn-chain-step {
    padding: 8px 16px;
    font-weight: 700; font-size: .86rem;
    color: var(--fg);
    background:
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.01)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.4), rgba(34,211,238,.3)) border-box;
    border: 1px solid transparent;
    border-radius: 999px;
    transition: transform .2s var(--ease);
}
.bn-chain-step:hover { transform: translateY(-2px); }
.bn-chain-arrow { color: var(--violet-light); font-size: .78rem; opacity: .8; }
.bn-chain-note {
    text-align: center;
    color: var(--fg-mute);
    font-size: .92rem;
    margin: 12px auto 0;
    max-width: 720px;
}
.bn-chain-note i { color: var(--amber); margin-right: 4px; }

/* ---------- TRIAL ---------- */
.bn-trial {
    position: relative;
    margin: 40px 0 12px;
    padding: 28px 32px;
    border-radius: var(--radius-xl);
    background:
        linear-gradient(135deg, rgba(16,185,129,.16) 0%, rgba(6,182,212,.10) 55%, rgba(124,58,237,.12) 100%) padding-box,
        linear-gradient(135deg, rgba(16,185,129,.55), rgba(6,182,212,.4) 60%, rgba(124,58,237,.4)) border-box;
    border: 1px solid transparent;
    box-shadow: var(--shadow-2);
    display: flex; align-items: center; gap: 22px;
    flex-wrap: wrap;
    overflow: hidden;
}
.bn-trial::before {
    content: "";
    position: absolute; top: -60%; left: -10%;
    width: 50%; height: 220%;
    background: radial-gradient(closest-side, rgba(16,185,129,.25), transparent 70%);
    pointer-events: none;
    filter: blur(8px);
}
.bn-trial-icon {
    width: 64px; height: 64px;
    border-radius: 18px;
    display: grid; place-items: center;
    font-size: 1.7rem; color: #fff;
    background: linear-gradient(135deg, #10b981, #06b6d4 70%);
    box-shadow: 0 14px 30px -10px rgba(16,185,129,.5), inset 0 1px 0 rgba(255,255,255,.18);
    flex-shrink: 0;
    position: relative;
}
.bn-trial-text { flex: 1; min-width: 260px; position: relative; }
.bn-trial-text h2 {
    margin: 0 0 6px;
    font-size: 1.4rem; font-weight: 900;
    color: #fff;
    letter-spacing: -.01em;
}
.bn-trial-text p {
    margin: 0;
    color: var(--fg-dim);
    font-size: .96rem;
    line-height: 1.6;
}
.bn-trial-btn { flex: 0 0 auto; position: relative; }

/* ---------- SECTION HEADS ---------- */
.bn-section-head { text-align: center; max-width: 720px; margin: 60px auto 24px; }
.bn-section-title {
    font-size: clamp(24px, 3vw, 34px);
    line-height: 1.15;
    letter-spacing: -.015em;
    font-weight: 900;
    margin: 0 0 8px;
    background: var(--grad-text-w);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.bn-section-sub {
    color: var(--fg-dim);
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
}

/* ---------- PERIOD SELECTOR ---------- */
.bn-periods {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 32px 0 14px;
}
.bn-period {
    position: relative;
    cursor: pointer;
    text-align: left;
    padding: 22px 20px;
    background:
        linear-gradient(180deg, rgba(28,31,45,.85), rgba(16,18,28,.95)) padding-box,
        linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.02)) border-box;
    border: 1px solid transparent;
    border-radius: 18px;
    box-shadow: var(--shadow-1);
    transition: transform .25s var(--ease), box-shadow .25s, border-color .25s;
    overflow: hidden;
}
.bn-period:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-2);
}
.bn-period.is-active {
    background:
        linear-gradient(180deg, rgba(35,28,60,.95), rgba(20,18,42,.96)) padding-box,
        linear-gradient(135deg, #8b5cf6, #22d3ee) border-box;
    box-shadow: var(--shadow-glow);
}
.bn-period-badge {
    position: absolute; top: 12px; right: 12px;
    padding: 4px 10px;
    font-size: .62rem; font-weight: 800;
    letter-spacing: .04em; text-transform: uppercase;
    color: #fff;
    background: var(--grad);
    border-radius: 999px;
    box-shadow: 0 6px 14px -4px rgba(124,58,237,.5);
}
.bn-period-save {
    position: absolute; top: 12px; right: 12px;
    padding: 4px 10px;
    font-size: .66rem; font-weight: 800;
    color: var(--emerald-light);
    background: rgba(16,185,129,.16);
    border: 1px solid rgba(16,185,129,.4);
    border-radius: 999px;
}
.bn-period-label {
    font-size: 1.05rem; font-weight: 800;
    color: #fff;
    margin-bottom: 4px;
    letter-spacing: -.005em;
}
.bn-period-sub {
    font-size: .78rem;
    color: var(--fg-mute);
    min-height: 32px;
    margin-bottom: 14px;
}
.bn-period-price {
    font-size: 1.55rem; font-weight: 900;
    color: #fff;
    line-height: 1;
    letter-spacing: -.02em;
}
.bn-period-price small {
    font-size: .76rem; font-weight: 600;
    color: var(--fg-mute);
}
.bn-period-total {
    font-size: .76rem;
    color: var(--fg-faint);
    margin-top: 6px;
}
.bn-period-radio {
    position: absolute; bottom: 16px; right: 16px;
    width: 22px; height: 22px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,.18);
    display: grid; place-items: center;
    transition: all .25s var(--ease);
}
.bn-period.is-active .bn-period-radio {
    border-color: transparent;
    background: var(--grad);
    box-shadow: 0 0 0 3px rgba(139,92,246,.16);
}
.bn-period.is-active .bn-period-radio::after {
    content: "";
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #fff;
}

/* ---------- BUTTONS ---------- */
.bn-cta-row {
    display: flex; flex-wrap: wrap; gap: 12px;
    margin-top: 22px;
}
.bn-cta-row > .bn-btn--primary { flex: 1 1 auto; min-width: 220px; }
.bn-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 15px 28px;
    border-radius: 14px;
    font-weight: 800; font-size: 1rem;
    letter-spacing: -.005em;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition: transform .25s var(--ease), filter .2s, box-shadow .25s;
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.bn-btn--primary {
    background: var(--grad);
    color: #fff;
    box-shadow:
        0 16px 38px -12px rgba(124,58,237,.55),
        0 4px 12px -4px rgba(6,182,212,.35),
        inset 0 1px 0 rgba(255,255,255,.18);
}
.bn-btn--primary::before {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%);
    transform: translateX(-110%);
    transition: transform .7s var(--ease);
    pointer-events: none;
    z-index: -1;
}
.bn-btn--primary:hover { transform: translateY(-2px); filter: brightness(1.06); color: #fff; }
.bn-btn--primary:hover::before { transform: translateX(110%); }
.bn-btn--ghost {
    color: #efeaff;
    background:
        linear-gradient(180deg, rgba(28,31,45,.85), rgba(18,20,30,.92)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.55), rgba(34,211,238,.45)) border-box;
}
.bn-btn--ghost:hover {
    color: #fff;
    background:
        linear-gradient(180deg, rgba(45,38,80,.85), rgba(28,30,55,.92)) padding-box,
        linear-gradient(135deg, #a78bfa, #22d3ee) border-box;
    transform: translateY(-2px);
}
.bn-btn:active { transform: scale(.98); }

/* ---------- NOTE PILL ---------- */
.bn-note {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    max-width: 720px;
    margin: 22px auto 0;
    padding: 12px 22px;
    text-align: center;
    color: var(--fg-dim);
    font-size: .9rem;
    background:
        linear-gradient(180deg, rgba(124,58,237,.14), rgba(6,182,212,.06)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.5), rgba(34,211,238,.4)) border-box;
    border: 1px solid transparent;
    border-radius: 999px;
}
.bn-note i { color: var(--violet-light); }

/* ---------- TIER CARDS ---------- */
.bn-tiers {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    align-items: stretch;
}
.bn-tier {
    position: relative;
    display: flex; flex-direction: column;
    padding: 26px 22px;
    background:
        linear-gradient(180deg, rgba(28,31,45,.88), rgba(16,18,28,.94)) padding-box,
        linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.02)) border-box;
    border: 1px solid transparent;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-1);
    transition: transform .25s var(--ease), box-shadow .25s, border-color .25s;
}
.bn-tier::before {
    content: "";
    position: absolute; top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--grad);
    opacity: .65;
}
.bn-tier--emerald::before { background: linear-gradient(90deg, #10b981, #34d399); }
.bn-tier--cyan::before { background: linear-gradient(90deg, #06b6d4, #22d3ee); }
.bn-tier--violet::before { background: linear-gradient(90deg, #8b5cf6, #a78bfa); }
.bn-tier--gold::before { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.bn-tier:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-2);
}
.bn-tier.is-popular {
    background:
        linear-gradient(180deg, rgba(40,30,70,.95), rgba(20,18,42,.96)) padding-box,
        linear-gradient(135deg, #a78bfa, #22d3ee) border-box;
    box-shadow: var(--shadow-glow);
}
.bn-tier-flag {
    position: absolute; top: 14px; right: 14px;
    padding: 4px 11px;
    font-size: .62rem; font-weight: 800;
    letter-spacing: .05em; text-transform: uppercase;
    color: #fff;
    background: var(--grad);
    border-radius: 999px;
    box-shadow: 0 6px 14px -4px rgba(124,58,237,.5);
}
.bn-tier-head { margin-bottom: 16px; }
.bn-tier-name {
    font-size: 1.4rem; font-weight: 900;
    line-height: 1.1;
    letter-spacing: -.01em;
    background: linear-gradient(135deg, #fff 0%, #d7dbe8 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.bn-tier-tagline {
    color: var(--fg-mute);
    font-size: .8rem;
    margin-top: 4px;
}
.bn-tier-limits {
    display: flex; flex-wrap: wrap; gap: 6px;
    margin-bottom: 14px;
}
.bn-tier-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 10px;
    font-size: .74rem; font-weight: 600;
    color: #d7dbe8;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 999px;
}
.bn-tier-chip i { color: var(--violet-light); font-size: .8rem; }
.bn-tier-pricebox {
    padding: 14px 16px;
    margin-bottom: 16px;
    background:
        linear-gradient(135deg, rgba(124,58,237,.16), rgba(6,182,212,.10));
    border: 1px solid rgba(139,92,246,.30);
    border-radius: 16px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.bn-tier-price { display: flex; align-items: baseline; gap: 6px; }
.bn-tier-price-val {
    font-size: 1.7rem; font-weight: 900;
    letter-spacing: -.02em;
    background: var(--grad-text-w);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.bn-tier-price-per {
    color: var(--fg-faint);
    font-size: .85rem;
}
.bn-tier-impl {
    margin-top: 7px;
    font-size: .78rem;
    color: var(--fg-dim);
    display: flex; align-items: center; gap: 7px;
}
.bn-tier-impl i { color: var(--amber); }
.bn-tier-inherits {
    display: flex; align-items: center; gap: 7px;
    margin-bottom: 10px;
    font-size: .76rem; font-weight: 700;
    color: #a5b4fc;
}
.bn-tier-feats {
    list-style: none;
    padding: 0;
    margin: 0 0 14px;
    display: flex; flex-direction: column; gap: 8px;
    flex: 1;
}
.bn-tier-feats li {
    display: flex; align-items: flex-start; gap: 8px;
    font-size: .86rem; line-height: 1.4;
    color: #dde0ec;
}
.bn-tier-feats li i {
    color: var(--emerald-light);
    background: rgba(16,185,129,.14);
    width: 18px; height: 18px;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: .72rem;
    margin-top: 1px;
    flex-shrink: 0;
}
.bn-tier-upsell {
    padding: 10px 12px;
    margin-bottom: 14px;
    font-size: .76rem;
    line-height: 1.5;
    color: #c9cee0;
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
}
.bn-tier-upsell i { color: var(--violet-light); margin-right: 4px; }
.bn-tier-btn { width: 100%; padding: 13px 18px; font-size: .92rem; margin-top: auto; }
.bn-tier-btn + .bn-tier-btn { margin-top: 8px; }
.bn-tier-selfserve {
    text-align: center;
    margin-top: 10px;
    font-size: .74rem;
    color: var(--fg-faint);
}

/* ---------- PERIMETER MATRIX ---------- */
.bn-matrix-wrap {
    overflow-x: auto;
    background:
        linear-gradient(180deg, rgba(28,31,45,.85), rgba(16,18,28,.92));
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: var(--shadow-2);
}
.bn-matrix {
    width: 100%;
    border-collapse: collapse;
    min-width: 700px;
}
.bn-matrix th, .bn-matrix td {
    padding: 16px 18px;
    text-align: center;
    border-bottom: 1px solid rgba(255,255,255,.05);
}
.bn-matrix thead th {
    color: #fff;
    font-weight: 800;
    font-size: .88rem;
    background: linear-gradient(180deg, rgba(124,58,237,.16), rgba(124,58,237,.04));
    border-bottom: 1px solid rgba(139,92,246,.25);
}
.bn-matrix thead th.bn-matrix-mod { text-align: left; }
.bn-matrix tbody tr { transition: background .2s ease; }
.bn-matrix tbody tr:hover { background: rgba(124,58,237,.06); }
.bn-matrix tbody tr:last-child td { border-bottom: none; }
.bn-matrix td.bn-matrix-mod {
    text-align: left;
    white-space: nowrap;
    padding-right: 28px;
}
.bn-matrix td.bn-matrix-mod i {
    color: var(--violet-light);
    margin-right: 10px;
    font-size: 1.05rem;
    vertical-align: middle;
}
.bn-matrix td.bn-matrix-mod span {
    display: inline-flex;
    flex-direction: column;
    vertical-align: middle;
}
.bn-matrix td.bn-matrix-mod b {
    color: #fff;
    font-size: .9rem;
}
.bn-matrix td.bn-matrix-mod small {
    color: var(--fg-faint);
    font-size: .76rem;
}
.bn-matrix .bn-yes {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(16,185,129,.14);
    color: var(--emerald-light);
    font-size: 1rem;
    box-shadow: inset 0 0 0 1px rgba(16,185,129,.3);
}
.bn-matrix .bn-yes.bn-opt {
    background: rgba(252,211,77,.14);
    color: var(--amber);
    box-shadow: inset 0 0 0 1px rgba(252,211,77,.3);
}
.bn-matrix .bn-opt-lbl {
    display: block;
    font-size: .62rem;
    color: var(--amber);
    margin-top: 4px;
}
.bn-matrix .bn-no {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(255,255,255,.04);
    color: var(--fg-faint);
    opacity: .85;
}

/* ---------- PoC BANNER ---------- */
.bn-poc {
    position: relative;
    margin-top: 56px;
    padding: 32px;
    background:
        linear-gradient(135deg, rgba(124,58,237,.20) 0%, rgba(6,182,212,.12) 70%, rgba(251,191,36,.10) 100%) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.55), rgba(34,211,238,.4) 60%, rgba(251,191,36,.3)) border-box;
    border: 1px solid transparent;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-2);
    overflow: hidden;
    display: flex; flex-wrap: wrap; align-items: center; gap: 24px;
}
.bn-poc::before {
    content: "";
    position: absolute; top: -40%; right: -15%;
    width: 50%; height: 180%;
    background: radial-gradient(closest-side, rgba(124,58,237,.30), transparent 70%);
    pointer-events: none;
}
.bn-poc-left { flex: 1; min-width: 280px; position: relative; }
.bn-poc-title {
    font-size: 1.7rem; font-weight: 900;
    margin: 12px 0 8px;
    letter-spacing: -.02em;
    background: var(--grad-text-w);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.bn-poc-sub {
    color: var(--fg-dim);
    font-size: .96rem;
    line-height: 1.6;
    margin: 0 0 12px;
}
.bn-poc-credit {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 16px;
    font-size: .88rem;
    color: var(--emerald-light);
    background: rgba(16,185,129,.10);
    border: 1px solid rgba(16,185,129,.28);
    border-radius: 10px;
}
.bn-poc-right { flex: 0 0 auto; position: relative; }

/* ---------- TRUST STRIP ---------- */
.bn-trust {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 12px;
    margin-top: 32px;
}
.bn-trust span {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 18px;
    font-size: .84rem; font-weight: 600;
    color: var(--fg-dim);
    background:
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.25), rgba(34,211,238,.18)) border-box;
    border: 1px solid transparent;
    border-radius: 12px;
}
.bn-trust i {
    color: transparent;
    background: linear-gradient(135deg, #a78bfa, #22d3ee);
    -webkit-background-clip: text; background-clip: text;
}

/* ---------- FAQ ---------- */
.bn-faq { margin-top: 64px; }
.bn-faq-title {
    text-align: center;
    font-size: 1.5rem; font-weight: 900;
    color: #fff;
    margin: 0 0 24px;
    letter-spacing: -.01em;
}
.bn-faq-item {
    margin-bottom: 10px;
    background:
        linear-gradient(180deg, rgba(28,31,45,.85), rgba(18,20,30,.92));
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
    transition: border-color .25s, box-shadow .25s;
}
.bn-faq-item:hover {
    border-color: rgba(139,92,246,.30);
    box-shadow: 0 8px 22px -10px rgba(124,58,237,.30);
}
.bn-faq-item[open] {
    border-color: rgba(139,92,246,.4);
    background: linear-gradient(180deg, rgba(40,30,70,.55), rgba(22,18,38,.92));
}
.bn-faq-q {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 20px 24px;
    cursor: pointer;
    font-weight: 700; font-size: 1rem;
    color: #fff;
    list-style: none;
}
.bn-faq-q::-webkit-details-marker { display: none; }
.bn-faq-q i {
    width: 30px; height: 30px;
    border-radius: 50%;
    background: rgba(139,92,246,.16);
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--violet-light);
    font-size: .76rem;
    transition: transform .25s var(--ease), background .25s;
}
.bn-faq-item[open] .bn-faq-q i {
    transform: rotate(180deg);
    background: var(--grad);
    color: #fff;
}
.bn-faq-a {
    padding: 0 24px 20px;
    color: var(--fg-dim);
    font-size: .94rem;
    line-height: 1.7;
}

/* ---------- ALERT TOAST ---------- */
.bn-alert {
    position: fixed; left: 50%; bottom: 28px;
    z-index: 9999;
    padding: 14px 24px;
    transform: translateX(-50%) translateY(24px);
    color: #fff;
    font-size: .92rem; font-weight: 600;
    background:
        linear-gradient(180deg, rgba(22,24,38,.96), rgba(14,16,26,.98)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.55), rgba(34,211,238,.45)) border-box;
    border: 1px solid transparent;
    border-radius: 14px;
    box-shadow: var(--shadow-2);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s, transform .25s var(--ease);
    max-width: 90vw;
}
.bn-alert.is-show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
.bn-alert.is-ok {
    background:
        linear-gradient(180deg, rgba(16,40,30,.96), rgba(8,24,18,.98)) padding-box,
        linear-gradient(135deg, rgba(16,185,129,.55), rgba(6,182,212,.45)) border-box;
    color: var(--emerald-light);
}
.bn-alert.is-err {
    background:
        linear-gradient(180deg, rgba(40,16,20,.96), rgba(24,8,12,.98)) padding-box,
        linear-gradient(135deg, rgba(239,68,68,.55), rgba(244,63,94,.45)) border-box;
    color: #fca5a5;
}

/* ==================================================================
 * MODAL — quote request (premium two-pane)
 * ================================================================== */
.bn-modal {
    position: fixed; inset: 0; z-index: 10000;
    display: flex; align-items: center; justify-content: center;
    padding: 24px;
}
.bn-modal[hidden] { display: none; }
.bn-modal-bd {
    position: absolute; inset: 0;
    background: radial-gradient(800px 600px at 50% 50%, rgba(10,11,17,.7), rgba(4,5,9,.92));
    backdrop-filter: blur(14px) saturate(1.1);
    -webkit-backdrop-filter: blur(14px) saturate(1.1);
    animation: bnFade .2s ease;
}
@keyframes bnFade { from { opacity: 0; } to { opacity: 1; } }
.bn-modal-card {
    position: relative;
    width: 100%; max-width: 900px;
    max-height: 92vh;
    overflow: auto;
    background:
        linear-gradient(180deg, rgba(22,24,38,.96), rgba(14,16,26,.98)) padding-box,
        linear-gradient(135deg, rgba(139,92,246,.65), rgba(34,211,238,.55) 50%, rgba(240,171,252,.45)) border-box;
    border: 1px solid transparent;
    border-radius: 26px;
    box-shadow:
        0 60px 100px -30px rgba(0,0,0,.85),
        0 30px 60px -20px rgba(124,58,237,.45),
        inset 0 1px 0 rgba(255,255,255,.06);
    animation: bnModalIn .4s var(--ease);
}
@keyframes bnModalIn {
    from { opacity: 0; transform: translateY(20px) scale(.97); }
    to { opacity: 1; transform: none; }
}
.bn-modal-x {
    position: absolute; top: 16px; right: 16px;
    z-index: 5;
    width: 38px; height: 38px;
    display: grid; place-items: center;
    color: var(--fg-dim);
    font-size: 1rem;
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 11px;
    cursor: pointer;
    transition: all .2s var(--ease);
}
.bn-modal-x:hover {
    background: linear-gradient(135deg, rgba(239,68,68,.20), rgba(239,68,68,.08));
    border-color: rgba(239,68,68,.4);
    color: #fff;
    transform: rotate(90deg);
}

/* Modal grid (left aside + right form) */
.bn-qm-grid {
    display: grid;
    grid-template-columns: 320px 1fr;
    min-height: 540px;
}
.bn-qm-aside {
    position: relative;
    padding: 32px 28px;
    background:
        linear-gradient(170deg, rgba(124,58,237,.28) 0%, rgba(46,30,90,.4) 35%, rgba(8,38,62,.5) 75%, rgba(6,30,52,.55) 100%);
    border-right: 1px solid rgba(139,92,246,.30);
    overflow: hidden;
}
.bn-qm-aside::before {
    content: "";
    position: absolute; top: -25%; right: -20%;
    width: 60%; height: 80%;
    background: radial-gradient(closest-side, rgba(139,92,246,.40), transparent 70%);
    filter: blur(10px);
    pointer-events: none;
}
.bn-qm-aside > * { position: relative; z-index: 1; }
.bn-qm-aside .bn-eyebrow {
    margin-bottom: 14px;
    color: #fff;
    background:
        linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04)) padding-box,
        linear-gradient(135deg, rgba(255,255,255,.5), rgba(255,255,255,.15)) border-box;
    text-shadow: 0 2px 8px rgba(0,0,0,.4);
}
.bn-qm-tier {
    font-size: 1.7rem; font-weight: 900;
    margin: 12px 0 4px;
    letter-spacing: -.015em;
    line-height: 1.15;
    background: linear-gradient(135deg, #fff 0%, #ddeaff 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.bn-qm-price {
    padding: 12px 14px;
    margin-bottom: 24px;
    background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.06));
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
}
.bn-qm-price-main {
    display: block;
    font-size: 1.2rem; font-weight: 800;
    color: #fff;
    text-shadow: 0 2px 12px rgba(124,58,237,.35);
}
.bn-qm-price-sub {
    display: block;
    margin-top: 4px;
    font-size: .8rem;
    color: rgba(255,255,255,.7);
}
.bn-qm-steps-title {
    margin-bottom: 16px;
    font-size: .72rem; font-weight: 800;
    letter-spacing: .12em; text-transform: uppercase;
    color: rgba(255,255,255,.78);
}
.bn-qm-steps {
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
    display: flex; flex-direction: column;
    gap: 14px;
}
.bn-qm-steps::before {
    content: "";
    position: absolute;
    left: 12px; top: 8px; bottom: 8px;
    width: 2px;
    background: linear-gradient(180deg, rgba(255,255,255,.4), rgba(255,255,255,.06));
    border-radius: 2px;
}
.bn-qm-steps li {
    position: relative;
    display: flex; align-items: center; gap: 11px;
    font-size: .9rem; color: rgba(255,255,255,.92);
    line-height: 1.4;
    z-index: 1;
}
.bn-qm-step-n {
    flex-shrink: 0;
    width: 26px; height: 26px;
    display: grid; place-items: center;
    font-size: .78rem; font-weight: 900;
    color: #4c1d95;
    background: linear-gradient(135deg, #fff 0%, #e2e8ff 100%);
    border-radius: 50%;
    box-shadow:
        0 4px 12px -2px rgba(0,0,0,.4),
        0 0 0 3px rgba(124,58,237,.4);
}
.bn-qm-aside-foot {
    margin-top: 24px;
    padding-top: 16px;
    display: flex; align-items: center; gap: 8px;
    font-size: .8rem;
    color: rgba(255,255,255,.78);
    border-top: 1px solid rgba(255,255,255,.14);
}
.bn-qm-aside-foot i { color: var(--emerald-light); }

/* Modal main (form) */
.bn-qm-main { padding: 32px 32px 28px; }
.bn-qm-form-head {
    font-size: 1.15rem; font-weight: 800;
    margin-bottom: 22px;
    letter-spacing: -.005em;
    background: var(--grad-text-w);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.bn-qm-form {
    display: flex; flex-direction: column;
    gap: 14px;
}
.bn-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.bn-field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.bn-field {
    display: flex; flex-direction: column;
    gap: 6px;
}
.bn-field-lbl {
    font-size: .74rem; font-weight: 600;
    letter-spacing: .04em; text-transform: uppercase;
    color: var(--fg-mute);
}
.bn-field-lbl i { color: var(--rose); font-style: normal; }
.bn-field-input {
    display: flex; align-items: center; gap: 9px;
    padding: 0 13px;
    background: linear-gradient(180deg, rgba(28,31,45,.7), rgba(18,20,30,.85));
    border: 1px solid var(--line);
    border-radius: 12px;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.bn-field-input i {
    color: var(--fg-faint);
    font-size: .95rem;
    flex-shrink: 0;
    transition: color .2s ease;
}
.bn-field-input input,
.bn-field-input textarea {
    flex: 1;
    min-width: 0;
    padding: 12px 0;
    background: none;
    border: none;
    outline: none;
    color: #fff;
    font-size: .95rem;
    font-family: inherit;
}
.bn-field-input textarea {
    resize: vertical;
    line-height: 1.5;
}
.bn-field-input--area { align-items: flex-start; }
.bn-field-input--area i { margin-top: 13px; }
.bn-field-input input::placeholder,
.bn-field-input textarea::placeholder { color: var(--fg-faint); }
.bn-field-input:focus-within {
    border-color: transparent;
    background:
        linear-gradient(180deg, rgba(40,30,70,.7), rgba(22,18,38,.85)) padding-box,
        linear-gradient(135deg, #8b5cf6, #22d3ee) border-box;
    box-shadow: 0 0 0 3px rgba(139,92,246,.16);
}
.bn-field-input:focus-within i { color: var(--violet-light); }
.bn-qm-submit { width: 100%; margin-top: 4px; }
.bn-qm-msg {
    min-height: 16px;
    text-align: center;
    font-size: .85rem;
}
.bn-qm-msg.is-err { color: #fca5a5; }
.bn-qm-msg.is-ok { color: var(--emerald-light); }

/* Modal success state */
.bn-qm-success {
    text-align: center;
    padding: 50px 20px 36px;
    animation: bnFade .3s ease;
}
.bn-qm-success[hidden] { display: none; }
.bn-qm-success-icon {
    width: 90px; height: 90px;
    margin: 0 auto 18px;
    display: grid; place-items: center;
    font-size: 2.6rem;
    color: #fff;
    background: linear-gradient(135deg, #10b981, #06b6d4 60%, #8b5cf6);
    border-radius: 50%;
    box-shadow:
        0 20px 44px -12px rgba(16,185,129,.55),
        0 0 0 8px rgba(16,185,129,.10),
        inset 0 1px 0 rgba(255,255,255,.12);
}
.bn-qm-success h3 {
    margin: 8px 0 8px;
    font-size: 1.5rem; font-weight: 900;
    letter-spacing: -.01em;
    background: linear-gradient(135deg, #fff, #6ee7c4);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent;
}
.bn-qm-success p {
    color: var(--fg-dim);
    font-size: 1rem;
    line-height: 1.65;
    max-width: 360px;
    margin: 0 auto 22px;
}

/* ==================================================================
 * RESPONSIVE
 * ================================================================== */
@media (max-width: 980px) {
    .bn-tiers { grid-template-columns: repeat(2, 1fr); }
    .bn-periods { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
    .bn-modal-card { max-width: 560px; }
    .bn-qm-grid { grid-template-columns: 1fr; min-height: 0; }
    .bn-qm-aside {
        padding: 26px 24px 22px;
        border-right: none;
        border-bottom: 1px solid rgba(139,92,246,.30);
    }
    .bn-qm-tier { font-size: 1.4rem; }
    .bn-qm-steps { flex-direction: row; flex-wrap: wrap; gap: 8px; }
    .bn-qm-steps::before { display: none; }
    .bn-qm-steps li {
        flex: 1 1 calc(50% - 4px);
        padding: 8px 12px;
        font-size: .82rem;
        background: rgba(255,255,255,.06);
        border: 1px solid rgba(255,255,255,.08);
        border-radius: 10px;
    }
    .bn-qm-step-n {
        width: 20px; height: 20px;
        font-size: .68rem;
        box-shadow: 0 2px 8px -2px rgba(0,0,0,.4), 0 0 0 2px rgba(124,58,237,.4);
    }
    .bn-qm-aside-foot { display: none; }
}

@media (max-width: 720px) {
    .bn-wrap { padding: 0 16px; }
    .bn-top { padding: 18px 0 6px; }
    .bn-hero { padding: 32px 0 8px; }
    .bn-h1 { font-size: clamp(26px, 8vw, 36px); }
    .bn-eyebrow { font-size: .68rem; padding: 6px 16px; }
    .bn-section-head { margin: 48px auto 18px; }
    .bn-chain-step { padding: 6px 12px; font-size: .78rem; }
    .bn-trial { padding: 22px; gap: 14px; }
    .bn-trial-body { flex-direction: column; align-items: flex-start; }
    .bn-trial-btn { width: 100%; }
    .bn-poc-body { padding: 24px; flex-direction: column; }
    .bn-trust span { padding: 8px 14px; font-size: .8rem; }
    .bn-faq-q { padding: 16px 18px; font-size: .94rem; }
    .bn-faq-a { padding: 0 18px 16px; font-size: .9rem; }
    .bn-tier { padding: 22px 18px; }
    .bn-tier-name { font-size: 1.25rem; }
    .bn-alert { left: 14px; right: 14px; transform: translateY(24px); max-width: none; }
    .bn-alert.is-show { transform: translateY(0); }
}

@media (max-width: 560px) {
    .bn-tiers { grid-template-columns: 1fr; }
    .bn-periods { grid-template-columns: 1fr; }
    .bn-modal { padding: 0; align-items: stretch; }
    .bn-modal-card {
        max-width: none; max-height: 100vh; min-height: 100vh;
        border-radius: 0;
    }
    .bn-qm-aside { padding: 22px 20px 18px; }
    .bn-qm-tier { font-size: 1.3rem; }
    .bn-qm-main { padding: 22px 20px; }
    .bn-field-row { grid-template-columns: 1fr; }
    .bn-field-input input,
    .bn-field-input textarea { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    body.bn-host *,
    body.bn-host *::before,
    body.bn-host *::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
    }
}