/* bbi-visual components (bbv-*) — separable layer on top of styles.css */
.bbv{--c:#22d3ee;--t:#0bdeb1;--nv:#0b1220;--pl:rgba(34,211,238,.14);position:relative}
.bbv-sec{padding:clamp(40px,7vw,88px) 0;position:relative;overflow:hidden}
.bbv-sec--tint{background:radial-gradient(60% 50% at 50% 0,rgba(11,222,177,.08),transparent 70%),linear-gradient(180deg,#0a0f1a,#09090b)}
.bbv-head{text-align:center;max-width:720px;margin:0 auto 32px}
.bbv-head p{color:var(--mut,#ccccd7)}
.bbv-frame{position:relative;border:1px solid rgba(34,211,238,.28);border-radius:18px;background:linear-gradient(180deg,rgba(15,23,42,.92),rgba(9,9,11,.96));box-shadow:0 0 0 1px rgba(255,255,255,.03) inset,0 20px 60px -20px rgba(19,200,255,.35);overflow:hidden}
.bbv-frame::before{content:"";position:absolute;inset:-40% -20% auto;height:70%;background:radial-gradient(closest-side,rgba(34,211,238,.18),transparent);pointer-events:none}
/* hub */
.bbv-hub{position:relative;aspect-ratio:1/1.05;max-width:760px;margin:0 auto}
@media(min-width:640px){.bbv-hub{aspect-ratio:16/10}}
.bbv-hub svg.bbv-lines{position:absolute;inset:0;width:100%;height:100%}
.bbv-hub line{stroke:rgba(34,211,238,.55);stroke-width:1.5;stroke-dasharray:4 6;vector-effect:non-scaling-stroke;animation:bbvdash 1.6s linear infinite}
.bbv-hub__c{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(96px,22%,150px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:800;font-size:clamp(14px,2.4vw,20px);color:#fff;background:radial-gradient(circle at 35% 30%,#123047,#0b1220);border:1px solid rgba(34,211,238,.6);box-shadow:0 0 0 10px rgba(34,211,238,.06),0 0 0 22px rgba(34,211,238,.03),0 0 50px rgba(34,211,238,.45)}
.bbv-hub__c small{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--c);font-weight:600}
.bbv-pill{position:absolute;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:600;color:#e6fbff;background:rgba(11,18,32,.92);border:1px solid rgba(34,211,238,.4);box-shadow:0 0 18px -6px rgba(34,211,238,.7)}
.bbv-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--t);box-shadow:0 0 8px var(--t)}
a.bbv-pill{text-decoration:none}a.bbv-pill:hover,a.bbv-pill:focus-visible{border-color:var(--t);color:#fff}
@media(min-width:640px){.bbv-pill{font-size:14px;padding:8px 14px}}
/* feature cards */
.bbv-cards{display:grid;gap:18px}
@media(min-width:760px){.bbv-cards{grid-template-columns:repeat(3,1fr)}}
.bbv-card{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:linear-gradient(180deg,#0d1424,#0a0d14);overflow:hidden}
.bbv-card__art{height:220px;position:relative;border-bottom:1px solid rgba(34,211,238,.15);background:radial-gradient(70% 70% at 50% 40%,rgba(34,211,238,.12),transparent)}
.bbv-card__body{padding:20px 22px 24px}
.bbv-card__t{display:flex;align-items:center;gap:10px;margin:0 0 4px;font-size:1.2rem;color:var(--c)}
.bbv-card__ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--pl);border:1px solid rgba(34,211,238,.35)}
.bbv-card__ic svg{width:16px;height:16px;stroke:var(--c);fill:none;stroke-width:2}
.bbv-tag{margin:0 0 10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#9fb3c8;font-weight:600}
.bbv-card p{margin:0 0 12px;color:var(--mut,#ccccd7)}
.bbv-card a.bbv-more{color:var(--t);font-weight:600}
/* pipeline */
.bbv-pipe{list-style:none;margin:0;padding:18px;display:grid;gap:8px}
.bbv-pipe li{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);font-size:14px;color:#dbe7f3;transition:all .4s}
.bbv-pipe li .bbv-dot{width:9px;height:9px;border-radius:50%;background:#475569;flex:none}
.bbv-pipe li .bbv-st{margin-left:auto;font-size:11px;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.06);color:#9fb3c8;white-space:nowrap}
.bbv-pipe li.is-on{border-color:rgba(34,211,238,.6);background:rgba(34,211,238,.09);box-shadow:0 0 24px -6px rgba(34,211,238,.6)}
.bbv-pipe li.is-on .bbv-dot,.bbv-pipe li.is-done .bbv-dot{background:var(--t);box-shadow:0 0 8px var(--t)}
.bbv-pipe li.is-on .bbv-st{background:rgba(11,222,177,.18);color:#5ff5d2}
.bbv-card__art .bbv-pipe{position:absolute;inset:0;padding:16px;align-content:center}
/* orbit */
.bbv-orbit{position:relative;width:100%;height:100%;min-height:220px}
.bbv-ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px dashed rgba(34,211,238,.35);transform:translate(-50%,-50%)}
.bbv-ring--1{width:110px;height:110px}.bbv-ring--2{width:180px;height:180px;animation:bbvspin 40s linear infinite}.bbv-ring--3{width:250px;height:250px;animation:bbvspin 60s linear infinite reverse;border-color:rgba(34,211,238,.18)}
.bbv-orbit__c{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:#0b1220;border:1px solid rgba(34,211,238,.6);box-shadow:0 0 30px rgba(34,211,238,.5);color:#fff;font-weight:800;font-size:13px;text-align:center;line-height:1.1}
.bbv-sat{position:absolute;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;display:grid;place-items:center;background:#0d1a2b;border:1px solid rgba(34,211,238,.45)}
.bbv-ring--2 .bbv-sat,.bbv-ring--3 .bbv-sat{animation:bbvspin 40s linear infinite reverse}
.bbv-ring--3 .bbv-sat{animation-duration:60s;animation-direction:normal}
.bbv-sat svg{width:18px;height:18px;stroke:var(--c);fill:none;stroke-width:2}
/* mockups */
.bbv-mock{font-size:13px;color:#dbe7f3}
.bbv-mock__bar{display:flex;gap:6px;align-items:center;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.07);position:relative}
.bbv-mock__bar i{width:9px;height:9px;border-radius:50%;background:#334155}
.bbv-mock__bar span{margin-left:8px;color:#94a3b8;font-size:12px}
.bbv-mock__body{padding:16px;display:grid;gap:12px;position:relative}
.bbv-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06)}
.bbv-row b{font-weight:700;color:#fff}
.bbv-row--hl{border-color:rgba(34,211,238,.55);box-shadow:0 0 22px -8px rgba(34,211,238,.8);background:rgba(34,211,238,.07)}
.bbv-chip{font-size:11px;padding:3px 8px;border-radius:999px;background:rgba(11,222,177,.15);color:#5ff5d2;white-space:nowrap}
.bbv-chip--b{background:rgba(7,150,255,.18);color:#8cc8ff}.bbv-chip--w{background:rgba(250,204,21,.14);color:#fde68a}
.bbv-ml{margin-left:auto}
.bbv-bars{display:flex;align-items:flex-end;gap:6px;height:64px;padding:0 4px}
.bbv-bars i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(180deg,var(--c),rgba(34,211,238,.15));transform-origin:bottom;animation:bbvgrow 1.2s ease-out both}
.bbv-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bbv-kpi{padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06)}
.bbv-kpi small{display:block;color:#94a3b8;font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.bbv-kpi b{font-size:15px;color:#fff}
.bbv-tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.bbv-tbl th,.bbv-tbl td{padding:8px 6px;text-align:left;border-bottom:1px solid rgba(255,255,255,.06)}
.bbv-tbl th{color:#94a3b8;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.bbv-search{display:flex;align-items:center;gap:8px;padding:12px 14px;border-radius:12px;border:1px solid rgba(34,211,238,.55);background:#0b1220;box-shadow:0 0 30px -8px rgba(34,211,238,.7)}
.bbv-search span{color:#fff;font-weight:600}
.bbv-caret{width:2px;height:16px;background:var(--c);animation:bbvblink 1s steps(1) infinite}
/* split / meet */
.bbv-split{display:grid;gap:28px;align-items:center}
@media(min-width:900px){.bbv-split{grid-template-columns:1.05fr 1fr;gap:56px}}
.bbv-steps{list-style:none;margin:0;padding:0;display:grid;gap:22px;counter-reset:s}
.bbv-steps li{counter-increment:s;display:grid;grid-template-columns:auto 1fr;gap:4px 16px}
.bbv-steps li::before{content:counter(s,decimal-leading-zero);grid-row:span 2;font:800 1.6rem/1 ui-monospace,"IBM Plex Mono",monospace;color:var(--c);text-shadow:0 0 18px rgba(34,211,238,.6)}
.bbv-steps h3{margin:0;font-size:1.1rem;color:#fff;display:inline-block;padding-bottom:6px;background:linear-gradient(90deg,var(--t),var(--c)) left bottom/48px 2px no-repeat}
.bbv-steps p{margin:0;color:var(--mut,#ccccd7)}
.bbv-steps--row{gap:16px}
@media(min-width:760px){.bbv-steps--row{grid-template-columns:repeat(3,1fr)}.bbv-steps--row.bbv-4{grid-template-columns:repeat(4,1fr)}}
.bbv-steps--row li{padding:20px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#0d1424,#0a0d14);grid-template-columns:1fr}
.bbv-steps--row li::before{grid-row:auto;margin-bottom:8px}
.bbv-prompt .bbv-mock__body p{margin:0}
.bbv-bubble{padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);max-width:92%}
.bbv-bubble--me{margin-left:auto;background:rgba(34,211,238,.12);border:1px solid rgba(34,211,238,.35)}
/* compare */
.bbv-cmp{overflow-x:auto;border-radius:18px}
.bbv-cmp table{width:100%;min-width:520px;border-collapse:separate;border-spacing:0;font-size:14px}
.bbv-cmp th,.bbv-cmp td{padding:14px 16px;text-align:left;border-bottom:1px solid rgba(255,255,255,.07);vertical-align:top}
.bbv-cmp thead th{font-size:13px}
.bbv-cmp td:nth-child(2),.bbv-cmp th:nth-child(2){background:rgba(34,211,238,.06);color:#e6fbff}
.bbv-brand{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.15);font-weight:700;white-space:nowrap}
.bbv-brand--us{border-color:rgba(34,211,238,.6);color:#fff;box-shadow:0 0 16px -4px rgba(34,211,238,.7)}
.bbv-yes{color:#5ff5d2}
.bbv-cmp tfoot td,.bbv-cmp tfoot th{font-weight:800;font-size:15px;border-bottom:0;background:linear-gradient(90deg,rgba(11,222,177,.12),rgba(7,150,255,.08))}
.bbv-cmp tbody th{font-weight:600;color:#cbd5e1}
.bbv-note{font-size:12px;color:#94a3b8;margin-top:10px}
/* industry tiles */
.bbv-tiles{display:grid;gap:14px;grid-template-columns:1fr 1fr;perspective:1200px}
@media(min-width:900px){.bbv-tiles{grid-template-columns:repeat(4,1fr);gap:18px}}
.bbv-tile{position:relative;display:block;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.1);aspect-ratio:4/3;transform:rotateX(4deg) rotateY(-3deg);transition:transform .35s,box-shadow .35s;text-decoration:none;color:#fff;background:#0b1220}
.bbv-tile:nth-child(even){transform:rotateX(4deg) rotateY(3deg)}
.bbv-tile:hover,.bbv-tile:focus-visible{transform:none;box-shadow:0 0 0 1px rgba(34,211,238,.6),0 18px 40px -12px rgba(34,211,238,.5)}
.bbv-tile img{width:100%;height:100%;object-fit:cover;display:block}
.bbv-tile__l{position:absolute;inset:auto 0 0 0;padding:28px 12px 10px;background:linear-gradient(180deg,transparent,rgba(5,8,14,.92));font-weight:700;font-size:14px;line-height:1.25}
.bbv-tile__l small{display:block;font-weight:500;font-size:12px;color:#cbd5e1;margin-top:2px}
.bbv-tiles--lg .bbv-tile{aspect-ratio:4/3.4}
@media(max-width:420px){.bbv-tile__l small{display:none}}
/* final CTA glow input panel */
.bbi-final{position:relative;overflow:hidden;box-shadow:0 0 0 1px rgba(34,211,238,.35),0 0 80px -20px rgba(34,211,238,.6)}
.bbv-cta-input{display:flex;align-items:center;gap:10px;max-width:520px;margin:18px auto;padding:10px 10px 10px 16px;border-radius:14px;border:1px solid rgba(34,211,238,.55);background:#0b1220;box-shadow:0 0 34px -8px rgba(34,211,238,.8);text-align:left}
.bbv-cta-input label{flex:1;min-width:0}
.bbv-cta-input input{width:100%;background:transparent;border:0;color:#fff;font:inherit;outline:none;min-height:40px}
.bbv-cta-input:focus-within{border-color:var(--t)}
/* hero visual band */
.bbv-band{padding:8px 0 clamp(32px,6vw,64px)}
.bbv-band .bbv-split{align-items:stretch}
@keyframes bbvdash{to{stroke-dashoffset:-20}}@keyframes bbvspin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes bbvgrow{from{transform:scaleY(.1)}}@keyframes bbvblink{50%{opacity:0}}
.bbv-ring--2 .bbv-sat,.bbv-ring--3 .bbv-sat{animation-name:bbvcounter}@keyframes bbvcounter{to{transform:rotate(-360deg)}}
.bbv-ring--3 .bbv-sat{animation-name:bbvcounter2}@keyframes bbvcounter2{to{transform:rotate(360deg)}}
.bbv-js .bbv-reveal{opacity:0;transform:translateY(14px);transition:opacity .6s,transform .6s}.bbv-js .bbv-reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.bbv *,.bbv{animation:none!important;transition:none!important}.bbv-reveal{opacity:1;transform:none}.bbv-tile{transform:none!important}}
.bbi a.bbv-pill,.bbi a.bbv-tile{text-decoration:none!important}
@media(min-width:640px){.bbv-hub{aspect-ratio:2/1;max-width:820px}}
.bbv-card__art{overflow:hidden}
